code cleanup

Author: Jeff Rooks

src/date-range-picker/components/Controls.svelte

@@ -51,11 +51,11 @@
 <div class="space-between">
   <button
     aria-disabled={prevBtnDisabled}
-    aria-label={`Previous month, ${localeFormat(prevMonth, "MMMM yyyy")}`}
+    aria-label={`Previous month, ${localeFormat(prevMonth, 'MMMM yyyy')}`}
     class={btnClass}
     disabled={prevBtnDisabled}
-    on:click={() => disptachEvent("prevMonth")}
-    title={`Previous month, ${localeFormat(prevMonth, "MMMM yyyy")}`}
+    on:click={() => disptachEvent('prevMonth')}
+    title={`Previous month, ${localeFormat(prevMonth, 'MMMM yyyy')}`}
     type="button">
     {@html prevIcon}
   </button>
@@ -65,7 +65,7 @@
         aria-label="Month select"
         bind:value={selectedMonth}
         class={selectClass}
-        on:change={() => disptachEvent("pageChange", {
+        on:change={() => disptachEvent('pageChange', {
             incrementAmount: differenceInCalendarMonths(
               selectedMonth.value,
               month
@@ -81,14 +81,14 @@
         {/each}
       </select>
     {:else}
-      <small>{localeFormat(month, "MMMM")}</small>
+      <small>{localeFormat(month, 'MMMM')}</small>
     {/if}
     {#if yearDropdown}
       <select
         aria-label="Year select"
         bind:value={selectedYear}
         class={selectClass}
-        on:change={() => disptachEvent("pageChange", {
+        on:change={() => disptachEvent('pageChange', {
             incrementAmount:
               differenceInCalendarYears(selectedYear.value, month) * 12
           })}>
@@ -102,16 +102,16 @@
         {/each}
       </select>
     {:else}
-      <small>{localeFormat(month, "yyyy")}</small>
+      <small>{localeFormat(month, 'yyyy')}</small>
     {/if}
   </span>
   <button
     aria-disabled={nextBtnDisabled}
-    aria-label={`Next month, ${localeFormat(nextMonth, "MMMM yyyy")}`}
+    aria-label={`Next month, ${localeFormat(nextMonth, 'MMMM yyyy')}`}
     class={btnClass}
     disabled={nextBtnDisabled}
-    on:click={() => disptachEvent("nextMonth")}
-    title={`Next month, ${localeFormat(nextMonth, "MMMM yyyy")}`}
+    on:click={() => disptachEvent('nextMonth')}
+    title={`Next month, ${localeFormat(nextMonth, 'MMMM yyyy')}`}
     type="button">
     {@html nextIcon}
   </button>

src/date-range-picker/components/Day.svelte

@@ -186,20 +186,20 @@
   role="gridcell">
   <button
     aria-disabled={day.isDisabled}
-    aria-label={localeFormat(day.date, "EEEE, MMMM dd, yyyy")}
+    aria-label={localeFormat(day.date, 'EEEE, MMMM dd, yyyy')}
     class="cell"
     class:muted={day.isNextMonth || day.isPrevMonth}
     disabled={day.isDisabled}
-    data-date={localeFormat(day.date, "yyyy-MM-dd")}
+    data-date={localeFormat(day.date, 'yyyy-MM-dd')}
     on:keydown={e => onKeydown(e, day.date)}
-    on:mouseenter={() => dispatchEvent("hover", day.date)}
+    on:mouseenter={() => dispatchEvent('hover', day.date)}
     on:mousedown={e => onMouseDown(e, day.date)}
     on:mouseup={e => onMouseUp(e, day.date)}
-    title={localeFormat(day.date, "EEEE, MMMM dd, yyyy")}
+    title={localeFormat(day.date, 'EEEE, MMMM dd, yyyy')}
     type="button">
     {#if monthIndicator}
-      <span class="month-indicator">{localeFormat(day.date, "MMM")}</span>
+      <span class="month-indicator">{localeFormat(day.date, 'MMM')}</span>
     {/if}
-    {localeFormat(day.date, "d")}
+    {localeFormat(day.date, 'd')}
   </button>
 </div>

src/date-range-picker/components/DaysOfWeek.svelte

@@ -14,10 +14,10 @@
   {/if}
   {#each daysOfWeek as dayOfWeek}
     <small
-      aria-label={localeFormat(dayOfWeek, "EEEE")}
+      aria-label={localeFormat(dayOfWeek, 'EEEE')}
       class="cell muted"
       role="gridcell">
-      {localeFormat(dayOfWeek, "eeeeee")}
+      {localeFormat(dayOfWeek, 'eeeeee')}
     </small>
   {/each}
   {#if weekNumbers}

src/date-range-picker/components/TimePicker.svelte

@@ -101,21 +101,21 @@
       aria-label="First available time"
       class={btnClass}
       disabled={isFirstAvailableTime}
-      on:click={() => dispatchEvent("timeChange", {
+      on:click={() => dispatchEvent('timeChange', {
           hours: parseInt(hours[0]),
           minutes: parseInt(minutes[0]),
           seconds: parseInt(seconds[0])
         })}
       title="First available time"
       type="button">
-      {@html "⇃"}
+      {@html '⇃'}
     </button>
   {/if}
   <select
     aria-label="Hour select"
     value={selectedHour}
     class={selectClass}
-    on:change={e => dispatchEvent("timeChange", {
+    on:change={e => dispatchEvent('timeChange', {
         hours: parseInt(e.target.value),
         minutes: selectedMinute,
         seconds: timePickerSeconds ? selectedSecond : 0
@@ -131,7 +131,7 @@
     aria-label="Minute select"
     value={selectedMinute}
     class={selectClass}
-    on:change={e => dispatchEvent("timeChange", {
+    on:change={e => dispatchEvent('timeChange', {
         hours: selectedHour,
         minutes: parseInt(e.target.value),
         seconds: timePickerSeconds ? selectedSecond : 0
@@ -150,7 +150,7 @@
       aria-label="Second select"
       value={selectedSecond}
       class={selectClass}
-      on:change={e => dispatchEvent("timeChange", {
+      on:change={e => dispatchEvent('timeChange', {
           hours: selectedHour,
           minutes: selectedMinute,
           seconds: parseInt(e.target.value)
@@ -179,14 +179,14 @@
       aria-label="Last available time"
       class={btnClass}
       disabled={isLastAvailableTime}
-      on:click={() => dispatchEvent("timeChange", {
+      on:click={() => dispatchEvent('timeChange', {
           hours: parseInt(hours[hours.length - 1]),
           minutes: parseInt(minutes[minutes.length - 1]),
           seconds: parseInt(seconds[seconds.length - 1])
         })}
       title="Last available time"
       type="button">
-      {@html "&#8638;"}
+      {@html '&#8638;'}
     </button>
   {/if}
 </div>

svelte.config.js

@@ -13,27 +13,28 @@ const env = createEnv()
 module.exports = {
   preprocess: {
     style: async ({ content, attributes }) => {
-        if (attributes.type !== "text/scss" && attributes.lang !== "scss") return // lang is now taken into account
+      if (attributes.type !== "text/scss" && attributes.lang !== "scss") return // lang is now taken into account
 
-        return new Promise((resolve, reject) => {
-          sass.render({
-              data: content,
-              includePaths: ["src"],
-              sourceMap: true,
-              outFile: "x" // this is necessary, but is ignored
-            },
-            (err, result) => {
-              if (err) return reject(err)
+      return new Promise((resolve, reject) => {
+        sass.render(
+          {
+            data: content,
+            includePaths: ["src"],
+            sourceMap: true,
+            outFile: "x" // this is necessary, but is ignored
+          },
+          (err, result) => {
+            if (err) return reject(err)
 
-              resolve({
-                code: result.css.toString(),
-                map: result.map.toString()
-              })
-            }
-          )
-        })
-      },
-      typescript: preprocess({
+            resolve({
+              code: result.css.toString(),
+              map: result.map.toString()
+            })
+          }
+        )
+      })
+    },
+    typescript: preprocess({
       env,
       compilerOptions: {
         ...readConfigFile(env),