framework7-svelte 7.0.0-beta.2 → 7.0.0-beta.20

package/components/icon.svelte

@@ -1,9 +1,9 @@
 <script>
-  import { colorClasses } from '../shared/mixins';
-  import { classNames } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
-  import { useTooltip } from '../shared/use-tooltip';
-  import { useTheme } from '../shared/use-theme';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
+  import { useTooltip } from '../shared/use-tooltip.js';
+  import { useTheme } from '../shared/use-theme.js';
 
   export let style = undefined;
 
@@ -92,7 +92,8 @@
   class={iconClasses}
   bind:this={el}
   {...restProps($$restProps)}
-  use:useTooltip={{ tooltip, tooltipTrigger }}>
+  use:useTooltip={{ tooltip, tooltipTrigger }}
+>
   {iconText || ''}
   <slot />
 </i>

package/components/input.svelte

@@ -1,9 +1,9 @@
 <script>
   import { createEventDispatcher, onMount, afterUpdate, onDestroy } from 'svelte';
-  import { colorClasses } from '../shared/mixins';
-  import { classNames, createEmitter } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
-  import { app, f7ready } from '../shared/f7';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames, createEmitter } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
+  import { app, f7ready } from '../shared/f7.js';
   import Toggle from './toggle.svelte';
   import Range from './range.svelte';
   import TextEditor from './text-editor.svelte';

package/components/link.svelte

@@ -6,14 +6,14 @@
     routerClasses,
     actionsAttrs,
     actionsClasses,
-  } from '../shared/mixins';
-  import { classNames, extend, isStringProp, plainText, createEmitter } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
-  import { useTooltip } from '../shared/use-tooltip';
-  import { useSmartSelect } from '../shared/use-smart-select';
-  import { useRouteProps } from '../shared/use-route-props';
-  import { useIcon } from '../shared/use-icon';
-  import { getReactiveContext } from '../shared/get-reactive-context';
+  } from '../shared/mixins.js';
+  import { classNames, extend, isStringProp, plainText, createEmitter } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
+  import { useTooltip } from '../shared/use-tooltip.js';
+  import { useSmartSelect } from '../shared/use-smart-select.js';
+  import { useRouteProps } from '../shared/use-route-props.js';
+  import { useIcon } from '../shared/use-icon.js';
+  import { getReactiveContext } from '../shared/get-reactive-context.js';
 
   import UseIcon from './use-icon.svelte';
   import Badge from './badge.svelte';
@@ -44,6 +44,10 @@
   let el;
   let f7SmartSelect;
 
+  export function smartSelectInstance() {
+    return f7SmartSelect;
+  }
+
   let TabbarContext =
     getReactiveContext('TabbarContext', (newValue) => {
       TabbarContext = newValue;

package/components/list-button.svelte

@@ -6,11 +6,11 @@
     routerClasses,
     actionsAttrs,
     actionsClasses,
-  } from '../shared/mixins';
-  import { classNames, extend, plainText, isStringProp, createEmitter } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
-  import { useTooltip } from '../shared/use-tooltip';
-  import { useRouteProps } from '../shared/use-route-props';
+  } from '../shared/mixins.js';
+  import { classNames, extend, plainText, isStringProp, createEmitter } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
+  import { useTooltip } from '../shared/use-tooltip.js';
+  import { useRouteProps } from '../shared/use-route-props.js';
 
   const emit = createEmitter(createEventDispatcher, $$props);
 

package/components/list-group.svelte

@@ -1,9 +1,9 @@
 <script>
-  import { colorClasses } from '../shared/mixins';
-  import { classNames } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
-  import { setReactiveContext } from '../shared/set-reactive-context';
-  import { getReactiveContext } from '../shared/get-reactive-context';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
+  import { setReactiveContext } from '../shared/set-reactive-context.js';
+  import { getReactiveContext } from '../shared/get-reactive-context.js';
 
   let className = undefined;
   export { className as class };
@@ -42,8 +42,11 @@
 
 <div
   class={classes}
-  data-sortable-move-elements={typeof sortableMoveElements !== 'undefined' ? sortableMoveElements.toString() : undefined}
-  {...restProps($$restProps)}>
+  data-sortable-move-elements={typeof sortableMoveElements !== 'undefined'
+    ? sortableMoveElements.toString()
+    : undefined}
+  {...restProps($$restProps)}
+>
   <ul>
     <slot />
   </ul>

package/components/list-index.svelte

@@ -1,9 +1,9 @@
 <script>
   import { createEventDispatcher, onMount, onDestroy } from 'svelte';
-  import { colorClasses } from '../shared/mixins';
-  import { classNames, createEmitter } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
-  import { app, f7ready } from '../shared/f7';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames, createEmitter } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
+  import { app, f7ready } from '../shared/f7.js';
 
   const emit = createEmitter(createEventDispatcher, $$props);
 

package/components/list-input.svelte

@@ -1,10 +1,10 @@
 <script>
   import { createEventDispatcher, onMount, afterUpdate, onDestroy } from 'svelte';
-  import { colorClasses } from '../shared/mixins';
-  import { classNames, extend, plainText, createEmitter } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
-  import { app, f7ready } from '../shared/f7';
-  import { getReactiveContext } from '../shared/get-reactive-context';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames, extend, plainText, createEmitter } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
+  import { app, f7ready } from '../shared/f7.js';
+  import { getReactiveContext } from '../shared/get-reactive-context.js';
 
   import TextEditor from './text-editor.svelte';
 

package/components/list-item-cell.svelte

@@ -1,7 +1,7 @@
 <script>
-  import { colorClasses } from '../shared/mixins';
-  import { classNames } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
 
   let className = undefined;
   export { className as class };

package/components/list-item-row.svelte

@@ -1,7 +1,7 @@
 <script>
-  import { colorClasses } from '../shared/mixins';
-  import { classNames } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
 
   let className = undefined;
   export { className as class };

package/components/list-item.svelte

@@ -6,14 +6,14 @@
     routerAttrs,
     actionsClasses,
     actionsAttrs,
-  } from '../shared/mixins';
-  import { classNames, plainText, isStringProp, createEmitter } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
-  import { app, f7ready } from '../shared/f7';
-  import { useTooltip } from '../shared/use-tooltip';
-  import { useSmartSelect } from '../shared/use-smart-select';
-  import { useRouteProps } from '../shared/use-route-props';
-  import { getReactiveContext } from '../shared/get-reactive-context';
+  } from '../shared/mixins.js';
+  import { classNames, plainText, isStringProp, createEmitter } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
+  import { app, f7ready } from '../shared/f7.js';
+  import { useTooltip } from '../shared/use-tooltip.js';
+  import { useSmartSelect } from '../shared/use-smart-select.js';
+  import { useRouteProps } from '../shared/use-route-props.js';
+  import { getReactiveContext } from '../shared/get-reactive-context.js';
 
   import Badge from './badge.svelte';
 

package/components/list.d.ts

@@ -55,6 +55,7 @@ interface ListProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap['div
   onSortableEnable ?: (...args: any[]) => void;
   onSortableDisable ?: (...args: any[]) => void;
   onSortableSort ?: (sortData?: any) => void;
+  onSortableMove ?: (itemEl?: any) => void;
   onTabShow ?: (el?: HTMLElement) => void;
   onTabHide ?: (el?: HTMLElement) => void;
 }
@@ -63,7 +64,7 @@ interface ListProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap['div
 
 class List extends SvelteComponentTyped<
   ListProps,
-  { submit: CustomEvent<void>; sortableEnable: CustomEvent<void>; sortableDisable: CustomEvent<void>; sortableSort: CustomEvent<void>; virtualItemBeforeInsert: CustomEvent<void>; virtualBeforeClear: CustomEvent<void>; virtualItemsBeforeInsert: CustomEvent<void>; virtualItemsAfterInsert: CustomEvent<void>; },
+  { submit: CustomEvent<void>; sortableEnable: CustomEvent<void>; sortableDisable: CustomEvent<void>; sortableSort: CustomEvent<void>; sortableMove: CustomEvent<void>; virtualItemBeforeInsert: CustomEvent<void>; virtualBeforeClear: CustomEvent<void>; virtualItemsBeforeInsert: CustomEvent<void>; virtualItemsAfterInsert: CustomEvent<void>; },
   {  'before-list' : {};  'list' : {};  'default' : {};  'after-list' : {}; }
 > {}
 

package/components/list.svelte

@@ -1,11 +1,11 @@
 <script>
   import { createEventDispatcher, onMount, onDestroy } from 'svelte';
-  import { colorClasses } from '../shared/mixins';
-  import { classNames, extend, createEmitter } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
-  import { app, f7ready } from '../shared/f7';
-  import { useTab } from '../shared/use-tab';
-  import { setReactiveContext } from '../shared/set-reactive-context';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames, extend, createEmitter } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
+  import { app, f7ready } from '../shared/f7.js';
+  import { useTab } from '../shared/use-tab.js';
+  import { setReactiveContext } from '../shared/set-reactive-context.js';
 
   const emit = createEmitter(createEventDispatcher, $$props);
 
@@ -131,6 +131,10 @@
     if (listEl !== el) return;
     emit('sortableSort', [sortData]);
   }
+  function onSortableMove(listItemEl, listEl) {
+    if (listEl !== el) return;
+    emit('sortableMove', [listItemEl, listEl]);
+  }
 
   useTab(() => el, emit);
 
@@ -139,6 +143,7 @@
       app.f7.on('sortableEnable', onSortableEnable);
       app.f7.on('sortableDisable', onSortableDisable);
       app.f7.on('sortableSort', onSortableSort);
+      app.f7.on('sortableMove', onSortableMove);
 
       if (!virtualList) return;
       const vlParams = virtualListParams || {};
@@ -178,6 +183,7 @@
     app.f7.off('sortableEnable', onSortableEnable);
     app.f7.off('sortableDisable', onSortableDisable);
     app.f7.off('sortableSort', onSortableSort);
+    app.f7.off('sortableMove', onSortableMove);
 
     if (f7VirtualList && f7VirtualList.destroy) {
       f7VirtualList.destroy();

package/components/login-screen-title.svelte

@@ -1,7 +1,7 @@
 <script>
-  import { colorClasses } from '../shared/mixins';
-  import { classNames } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
 
   let className = undefined;
   export { className as class };

package/components/login-screen.svelte

@@ -1,10 +1,10 @@
 <script>
   import { createEventDispatcher, onMount, onDestroy } from 'svelte';
-  import { colorClasses } from '../shared/mixins';
-  import { classNames, createEmitter } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
-  import { app, f7ready } from '../shared/f7';
-  import { modalStateClasses } from '../shared/modal-state-classes';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames, createEmitter } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
+  import { app, f7ready } from '../shared/f7.js';
+  import { modalStateClasses } from '../shared/modal-state-classes.js';
 
   const emit = createEmitter(createEventDispatcher, $$props);
 

package/components/menu-dropdown-item.svelte

@@ -6,10 +6,10 @@
     routerClasses,
     actionsAttrs,
     actionsClasses,
-  } from '../shared/mixins';
-  import { classNames, extend, plainText, createEmitter } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
-  import { useRouteProps } from '../shared/use-route-props';
+  } from '../shared/mixins.js';
+  import { classNames, extend, plainText, createEmitter } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
+  import { useRouteProps } from '../shared/use-route-props.js';
 
   const emit = createEmitter(createEventDispatcher, $$props);
 

package/components/menu-dropdown.svelte

@@ -1,7 +1,7 @@
 <script>
-  import { colorClasses } from '../shared/mixins';
-  import { classNames } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
 
   let className = undefined;
   export { className as class };

package/components/menu-item.svelte

@@ -6,13 +6,13 @@
     routerClasses,
     actionsAttrs,
     actionsClasses,
-  } from '../shared/mixins';
-  import { classNames, extend, plainText, createEmitter } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
-  import { app, f7ready } from '../shared/f7';
-  import { useTooltip } from '../shared/use-tooltip';
-  import { useRouteProps } from '../shared/use-route-props';
-  import { useIcon } from '../shared/use-icon';
+  } from '../shared/mixins.js';
+  import { classNames, extend, plainText, createEmitter } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
+  import { app, f7ready } from '../shared/f7.js';
+  import { useTooltip } from '../shared/use-tooltip.js';
+  import { useRouteProps } from '../shared/use-route-props.js';
+  import { useIcon } from '../shared/use-icon.js';
 
   import UseIcon from './use-icon.svelte';
 

package/components/menu.svelte

@@ -1,7 +1,7 @@
 <script>
-  import { colorClasses } from '../shared/mixins';
-  import { classNames } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
 
   let className = undefined;
   export { className as class };

package/components/message.svelte

@@ -1,9 +1,9 @@
 <script>
   /* eslint-disable no-undef */
   import { createEventDispatcher } from 'svelte';
-  import { colorClasses } from '../shared/mixins';
-  import { classNames, plainText, createEmitter } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames, plainText, createEmitter } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
 
   const emit = createEmitter(createEventDispatcher, $$props);
 

package/components/messagebar-attachment.svelte

@@ -1,8 +1,8 @@
 <script>
   import { createEventDispatcher } from 'svelte';
-  import { colorClasses } from '../shared/mixins';
-  import { classNames, createEmitter } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames, createEmitter } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
 
   const emit = createEmitter(createEventDispatcher, $$props);
 
@@ -29,7 +29,7 @@
     <img src={image} />
   {/if}
   {#if deletable}
-    <span on:click={onDeleteClick}  class="messagebar-attachment-delete" />
+    <span on:click={onDeleteClick} class="messagebar-attachment-delete" />
   {/if}
   <slot />
 </div>

package/components/messagebar-attachments.svelte

@@ -1,7 +1,7 @@
 <script>
-  import { colorClasses } from '../shared/mixins';
-  import { classNames } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
 
   let className = undefined;
   export { className as class };

package/components/messagebar-sheet-image.svelte

@@ -1,8 +1,8 @@
 <script>
   import { createEventDispatcher } from 'svelte';
-  import { colorClasses } from '../shared/mixins';
-  import { classNames, createEmitter } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames, createEmitter } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
 
   const emit = createEmitter(createEventDispatcher, $$props);
 

package/components/messagebar-sheet-item.svelte

@@ -1,7 +1,7 @@
 <script>
-  import { colorClasses } from '../shared/mixins';
-  import { classNames } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
 
   let className = undefined;
   export { className as class };

package/components/messagebar-sheet.svelte

@@ -1,7 +1,7 @@
 <script>
-  import { colorClasses } from '../shared/mixins';
-  import { classNames } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
 
   let className = undefined;
   export { className as class };

package/components/messagebar.svelte

@@ -1,9 +1,9 @@
 <script>
   import { createEventDispatcher, onMount, onDestroy, afterUpdate } from 'svelte';
-  import { colorClasses } from '../shared/mixins';
-  import { classNames, noUndefinedProps, createEmitter } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
-  import { app, f7ready } from '../shared/f7';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames, noUndefinedProps, createEmitter } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
+  import { app, f7ready } from '../shared/f7.js';
 
   import Link from './link.svelte';
   import Input from './input.svelte';

package/components/messages-title.svelte

@@ -1,7 +1,7 @@
 <script>
-  import { colorClasses } from '../shared/mixins';
-  import { classNames } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
 
   let className = undefined;
   export { className as class };

package/components/messages.svelte

@@ -1,9 +1,9 @@
 <script>
   import { onMount, onDestroy, beforeUpdate, afterUpdate } from 'svelte';
-  import { colorClasses } from '../shared/mixins';
-  import { classNames, noUndefinedProps } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
-  import { app, f7ready } from '../shared/f7';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames, noUndefinedProps } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
+  import { app, f7ready } from '../shared/f7.js';
 
   let className = undefined;
   export { className as class };

package/components/nav-left.svelte

@@ -1,9 +1,9 @@
 <script>
   import { createEventDispatcher } from 'svelte';
-  import { colorClasses } from '../shared/mixins';
-  import { classNames, createEmitter } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
-  import { useTheme } from '../shared/use-theme';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames, createEmitter } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
+  import { useTheme } from '../shared/use-theme.js';
 
   import Link from './link.svelte';
 

package/components/nav-right.svelte

@@ -1,7 +1,7 @@
 <script>
-  import { colorClasses } from '../shared/mixins';
-  import { classNames } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
 
   let className = undefined;
   export { className as class };

package/components/nav-title-large.svelte

@@ -1,7 +1,7 @@
 <script>
-  import { colorClasses } from '../shared/mixins';
-  import { classNames } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
 
   let className = undefined;
   export { className as class };

package/components/nav-title.svelte

@@ -1,7 +1,7 @@
 <script>
-  import { colorClasses } from '../shared/mixins';
-  import { classNames, plainText } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames, plainText } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
 
   let className = undefined;
   export { className as class };

package/components/navbar.svelte

@@ -1,10 +1,10 @@
 <script>
   import { createEventDispatcher, onMount, onDestroy, afterUpdate } from 'svelte';
-  import { colorClasses } from '../shared/mixins';
-  import { classNames, plainText, createEmitter } from '../shared/utils';
-  import { restProps } from '../shared/rest-props';
-  import { f7ready, app } from '../shared/f7';
-  import { useTheme } from '../shared/use-theme';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames, plainText, createEmitter } from '../shared/utils.js';
+  import { restProps } from '../shared/rest-props.js';
+  import { f7ready, app } from '../shared/f7.js';
+  import { useTheme } from '../shared/use-theme.js';
 
   import NavLeft from './nav-left.svelte';
   import NavTitle from './nav-title.svelte';

package/components/page-content.svelte

@@ -1,10 +1,10 @@
 <script>
   import { onMount, onDestroy, createEventDispatcher } from 'svelte';
-  import { restProps } from '../shared/rest-props';
-  import { colorClasses } from '../shared/mixins';
-  import { classNames, createEmitter } from '../shared/utils';
-  import { app, f7ready } from '../shared/f7';
-  import { useTab } from '../shared/use-tab';
+  import { restProps } from '../shared/rest-props.js';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames, createEmitter } from '../shared/utils.js';
+  import { app, f7ready } from '../shared/f7.js';
+  import { useTab } from '../shared/use-tab.js';
 
   import Preloader from './preloader.svelte';
 

package/components/page.svelte

@@ -1,9 +1,9 @@
 <script>
   import { onMount, afterUpdate, onDestroy, createEventDispatcher } from 'svelte';
-  import { restProps } from '../shared/rest-props';
-  import { colorClasses } from '../shared/mixins';
-  import { classNames, createEmitter } from '../shared/utils';
-  import { app, f7ready } from '../shared/f7';
+  import { restProps } from '../shared/rest-props.js';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames, createEmitter } from '../shared/utils.js';
+  import { app, f7ready } from '../shared/f7.js';
 
   import PageContent from './page-content.svelte';
 

package/components/panel.svelte

@@ -1,9 +1,9 @@
 <script>
   import { onMount, onDestroy, createEventDispatcher } from 'svelte';
-  import { restProps } from '../shared/rest-props';
-  import { colorClasses } from '../shared/mixins';
-  import { classNames, noUndefinedProps, createEmitter } from '../shared/utils';
-  import { app, f7ready } from '../shared/f7';
+  import { restProps } from '../shared/rest-props.js';
+  import { colorClasses } from '../shared/mixins.js';
+  import { classNames, noUndefinedProps, createEmitter } from '../shared/utils.js';
+  import { app, f7ready } from '../shared/f7.js';
 
   const emit = createEmitter(createEventDispatcher, $$props);
 
@@ -12,6 +12,7 @@
 
   export let side = undefined;
   export let effect = undefined;
+  // svelte-ignore unused-export-let
   export let cover = false;
   export let reveal = false;
   export let push = false;

package/components/photo-browser.svelte

@@ -1,8 +1,8 @@
 <script>
   import { createEventDispatcher, onMount, onDestroy } from 'svelte';
 
-  import { extend, createEmitter } from '../shared/utils';
-  import { app, f7ready } from '../shared/f7';
+  import { extend, createEmitter } from '../shared/utils.js';
+  import { app, f7ready } from '../shared/f7.js';
 
   const emit = createEmitter(createEventDispatcher, $$props);