chore: format files with Prettier 3

src/DatePicker/DatePicker.svelte

@@ -80,7 +80,7 @@
   const inputIds = derived(inputs, (_) => _.map(({ id }) => id));
   const labelTextEmpty = derived(
     inputs,
-    (_) => _.filter(({ labelText }) => !!labelText).length === 0
+    (_) => _.filter(({ labelText }) => !!labelText).length === 0,
   );
   const inputValue = writable(value);
   const inputValueFrom = writable(valueFrom);
@@ -183,7 +183,7 @@
     calendar?.calendarContainer?.setAttribute("role", "application");
     calendar?.calendarContainer?.setAttribute(
       "aria-label",
-      "calendar-container"
+      "calendar-container",
     );
   }
 
@@ -230,17 +230,17 @@
 </script>
 
 <svelte:window
-  on:click="{({ target }) => {
+  on:click={({ target }) => {
     if (!calendar || !calendar.isOpen) return;
     if (datePickerRef && datePickerRef.contains(target)) return;
     if (!calendar.calendarContainer.contains(target)) calendar.close();
-  }}"
+  }}
 />
 
 <!-- svelte-ignore a11y-mouse-events-have-key-events -->
 <!-- svelte-ignore a11y-no-static-element-interactions -->
 <div
-  class:bx--form-item="{true}"
+  class:bx--form-item={true}
   {...$$restProps}
   on:click
   on:mouseover
@@ -249,22 +249,22 @@
 >
   <!-- svelte-ignore a11y-no-static-element-interactions -->
   <div
-    bind:this="{datePickerRef}"
-    id="{id}"
-    class:bx--date-picker="{true}"
-    class:bx--date-picker--short="{short}"
-    class:bx--date-picker--light="{light}"
-    class:bx--date-picker--simple="{datePickerType === 'simple'}"
-    class:bx--date-picker--single="{datePickerType === 'single'}"
-    class:bx--date-picker--range="{datePickerType === 'range'}"
-    class:bx--date-picker--nolabel="{datePickerType === 'range' &&
-      $labelTextEmpty}"
-    on:keydown="{(e) => {
-      if (calendar?.isOpen && e.key === 'Escape') {
+    bind:this={datePickerRef}
+    {id}
+    class:bx--date-picker={true}
+    class:bx--date-picker--short={short}
+    class:bx--date-picker--light={light}
+    class:bx--date-picker--simple={datePickerType === "simple"}
+    class:bx--date-picker--single={datePickerType === "single"}
+    class:bx--date-picker--range={datePickerType === "range"}
+    class:bx--date-picker--nolabel={datePickerType === "range" &&
+      $labelTextEmpty}
+    on:keydown={(e) => {
+      if (calendar?.isOpen && e.key === "Escape") {
         e.stopPropagation();
         calendar.close();
       }
-    }}"
+    }}
   >
     <slot />
   </div>

src/DatePicker/DatePickerInput.svelte

@@ -79,15 +79,15 @@
 </script>
 
 <div
-  class:bx--date-picker-container="{true}"
-  class:bx--date-picker--nolabel="{!labelText}"
+  class:bx--date-picker-container={true}
+  class:bx--date-picker--nolabel={!labelText}
 >
   {#if labelText || $$slots.labelText}
     <label
-      for="{id}"
-      class:bx--label="{true}"
-      class:bx--visually-hidden="{hideLabel}"
-      class:bx--label--disabled="{disabled}"
+      for={id}
+      class:bx--label={true}
+      class:bx--visually-hidden={hideLabel}
+      class:bx--label--disabled={disabled}
     >
       <slot name="labelText">
         {labelText}
@@ -95,47 +95,47 @@
     </label>
   {/if}
   <div
-    class:bx--date-picker-input__wrapper="{true}"
-    class:bx--date-picker-input__wrapper--invalid="{invalid}"
-    class:bx--date-picker-input__wrapper--warn="{warn}"
+    class:bx--date-picker-input__wrapper={true}
+    class:bx--date-picker-input__wrapper--invalid={invalid}
+    class:bx--date-picker-input__wrapper--warn={warn}
   >
     <input
-      bind:this="{ref}"
-      data-invalid="{invalid || undefined}"
-      id="{id}"
-      name="{name}"
-      placeholder="{placeholder}"
-      type="{type}"
-      pattern="{pattern}"
-      disabled="{disabled}"
+      bind:this={ref}
+      data-invalid={invalid || undefined}
+      {id}
+      {name}
+      {placeholder}
+      {type}
+      {pattern}
+      {disabled}
       {...$$restProps}
-      value="{$range
+      value={$range
         ? $inputIds.indexOf(id) === 0
           ? $inputValueFrom
           : $inputValueTo
-        : $inputValue}"
-      class:bx--date-picker__input="{true}"
-      class:bx--date-picker__input--invalid="{invalid}"
-      class:bx--date-picker__input--sm="{size === 'sm'}"
-      class:bx--date-picker__input--xl="{size === 'xl'}"
+        : $inputValue}
+      class:bx--date-picker__input={true}
+      class:bx--date-picker__input--invalid={invalid}
+      class:bx--date-picker__input--sm={size === "sm"}
+      class:bx--date-picker__input--xl={size === "xl"}
       on:input
-      on:input="{({ target }) => {
-        updateValue({ type: 'input', value: target.value });
-      }}"
-      on:change="{({ target }) => {
-        updateValue({ type: 'change', value: target.value });
-      }}"
+      on:input={({ target }) => {
+        updateValue({ type: "input", value: target.value });
+      }}
+      on:change={({ target }) => {
+        updateValue({ type: "change", value: target.value });
+      }}
       on:keydown
-      on:keydown="{({ key }) => {
-        if (key === 'ArrowDown') {
+      on:keydown={({ key }) => {
+        if (key === "ArrowDown") {
           focusCalendar();
         }
-      }}"
+      }}
       on:keyup
       on:blur
-      on:blur="{({ relatedTarget }) => {
+      on:blur={({ relatedTarget }) => {
         blurInput(relatedTarget);
-      }}"
+      }}
       on:paste
     />
     {#if invalid}
@@ -151,21 +151,21 @@
     {#if $hasCalendar && !invalid && !warn}
       <Calendar
         class="bx--date-picker__icon"
-        aria-label="{iconDescription}"
-        on:click="{openCalendar}"
+        aria-label={iconDescription}
+        on:click={openCalendar}
       />
     {/if}
   </div>
   {#if invalid}
-    <div class:bx--form-requirement="{true}">{invalidText}</div>
+    <div class:bx--form-requirement={true}>{invalidText}</div>
   {/if}
   {#if !invalid && warn}
-    <div class:bx--form-requirement="{true}">{warnText}</div>
+    <div class:bx--form-requirement={true}>{warnText}</div>
   {/if}
   {#if !invalid && !warn && helperText}
     <div
-      class:bx--form__helper-text="{true}"
-      class:bx--form__helper-text--disabled="{disabled}"
+      class:bx--form__helper-text={true}
+      class:bx--form__helper-text--disabled={disabled}
     >
       {helperText}
     </div>

src/DatePicker/DatePickerSkeleton.svelte

@@ -9,7 +9,7 @@
 <!-- svelte-ignore a11y-mouse-events-have-key-events -->
 <!-- svelte-ignore a11y-no-static-element-interactions -->
 <div
-  class:bx--form-item="{true}"
+  class:bx--form-item={true}
   {...$$restProps}
   on:click
   on:mouseover
@@ -17,18 +17,18 @@
   on:mouseleave
 >
   <div
-    class:bx--date-picker="{true}"
-    class:bx--skeleton="{true}"
-    class:bx--date-picker--range="{true}"
-    class:bx--date-picker--short="{!range}"
-    class:bx--date-picker--simple="{!range}"
+    class:bx--date-picker={true}
+    class:bx--skeleton={true}
+    class:bx--date-picker--range={true}
+    class:bx--date-picker--short={!range}
+    class:bx--date-picker--simple={!range}
   >
     {#each Array.from({ length: range ? 2 : 1 }, (_, i) => i) as input, i (input)}
-      <div class:bx--date-picker-container="{true}">
-        <label for="{id}" class:bx--label="{true}"></label>
+      <div class:bx--date-picker-container={true}>
+        <label for={id} class:bx--label={true}></label>
         <div
-          class:bx--date-picker__input="{true}"
-          class:bx--skeleton="{true}"
+          class:bx--date-picker__input={true}
+          class:bx--skeleton={true}
         ></div>
       </div>
     {/each}