framework7-svelte 7.1.5 → 8.0.0-beta.2

package/shared/use-tooltip.js

@@ -5,7 +5,6 @@ export const useTooltip = (el, props) => {
     tooltip,
     tooltipTrigger
   } = props;
-
   if (el && tooltip) {
     f7ready(() => {
       f7Tooltip = app.f7.tooltip.create({
@@ -15,19 +14,16 @@ export const useTooltip = (el, props) => {
       });
     });
   }
-
   return {
     update(_temp) {
       let {
         tooltip: value
       } = _temp === void 0 ? {} : _temp;
-
       if (!value && f7Tooltip) {
         f7Tooltip.destroy();
         f7Tooltip = null;
         return;
       }
-
       if (value && !f7Tooltip && app.f7) {
         f7Tooltip = app.f7.tooltip.create({
           targetEl: el,
@@ -36,17 +32,14 @@ export const useTooltip = (el, props) => {
         });
         return;
       }
-
       if (!value || !f7Tooltip) return;
       f7Tooltip.setText(value);
     },
-
     destroy() {
       if (f7Tooltip && f7Tooltip.destroy) {
         f7Tooltip.destroy();
         f7Tooltip = null;
       }
     }
-
   };
 };

package/shared/utils.js

@@ -18,11 +18,9 @@ export function extend() {
   let deep = true;
   let to;
   let from;
-
   for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
     args[_key] = arguments[_key];
   }
-
   if (typeof args[0] === 'boolean') {
     [deep, to] = args;
     args.splice(0, 2);
@@ -32,17 +30,13 @@ export function extend() {
     args.splice(0, 1);
     from = args;
   }
-
   for (let i = 0; i < from.length; i += 1) {
     const nextSource = args[i];
-
     if (nextSource !== undefined && nextSource !== null) {
       const keysArray = Object.keys(Object(nextSource));
-
       for (let nextIndex = 0, len = keysArray.length; nextIndex < len; nextIndex += 1) {
         const nextKey = keysArray[nextIndex];
         const desc = Object.getOwnPropertyDescriptor(nextSource, nextKey);
-
         if (desc !== undefined && desc.enumerable) {
           if (!deep) {
             to[nextKey] = nextSource[nextKey];
@@ -58,16 +52,13 @@ export function extend() {
       }
     }
   }
-
   return to;
 }
 export function classNames() {
   const classes = [];
-
   for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
     args[_key2] = arguments[_key2];
   }
-
   args.forEach(arg => {
     if (typeof arg === 'object' && arg.constructor === Object) {
       Object.keys(arg).forEach(key => {
@@ -83,7 +74,6 @@ export function classNames() {
 }
 export function createEmitter(createEventDispatcher, props) {
   const dispatch = createEventDispatcher();
-
   const emit = (events, argsArray) => {
     if (!events || !events.trim().length || typeof events !== 'string') return;
     events.trim().split(' ').forEach(event => {
@@ -91,13 +81,11 @@ export function createEmitter(createEventDispatcher, props) {
       if (!eventName) return;
       const propName = `on${eventName.charAt(0).toUpperCase() + eventName.slice(1)}`;
       dispatch(eventName, argsArray);
-
       if (typeof props[propName] === 'function') {
         if (!Array.isArray(argsArray)) props[propName](...[argsArray]);else props[propName](...(argsArray || []));
       }
     });
   };
-
   return emit;
 }
 let routerIdCounter = 0;

package/components/appbar.d.ts

@@ -1,30 +0,0 @@
-
-import { SvelteComponentTyped } from 'svelte';
-
-
-interface AppbarProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap['div']> {
-  noShadow?: boolean;
-  noHairline?: boolean;
-  inner?: boolean;
-  innerClass?: string;
-  innerClassName?: string;
-  children?: React.ReactNode;
-  color?: string;
-  colorTheme?: string;
-  textColor?: string;
-  bgColor?: string;
-  borderColor?: string;
-  rippleColor?: string;
-  dark?: boolean;
-}
-
-
-
-declare class Appbar extends SvelteComponentTyped<
-  AppbarProps,
-  {  },
-  {  'before-inner' : {};  'default' : {};  'after-inner' : {}; }
-> {}
-
-export { AppbarProps };
-export default Appbar;

package/components/appbar.svelte

@@ -1,38 +0,0 @@
-<script>
-  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 };
-
-  export let noShadow = undefined;
-  export let noHairline = undefined;
-  export let inner = true;
-  export let innerClass = undefined;
-  export let innerClassName = undefined;
-
-  $: classes = classNames(
-    className,
-    'appbar',
-    {
-      'no-shadow': noShadow,
-      'no-hairline': noHairline,
-    },
-    colorClasses($$props),
-  );
-
-  $: innerClasses = classNames('appbar-inner', innerClass, innerClassName);
-</script>
-
-<div class={classes} {...restProps($$restProps)}>
-  <slot name="before-inner" />
-  {#if inner}
-    <div class={innerClasses}>
-      <slot />
-    </div>
-  {:else}
-    <slot />
-  {/if}
-  <slot name="after-inner" />
-</div>

package/components/col.d.ts

@@ -1,38 +0,0 @@
-
-import { SvelteComponentTyped } from 'svelte';
-
-
-interface ColProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap['div']> {
-  tag ?: string;
-  width ?: number | string;
-  xsmall ?: number | string;
-  small ?: number | string;
-  medium ?: number | string;
-  large ?: number | string;
-  xlarge ?: number | string;
-  resizable ?: boolean;
-  resizableFixed ?: boolean;
-  resizableAbsolute ?: boolean;
-  resizableHandler ?: boolean;
-  onClick ?: (event?: any) => void;
-  onGridResize ?: (...args: any[]) => void;
-  children?: React.ReactNode;
-  color?: string;
-  colorTheme?: string;
-  textColor?: string;
-  bgColor?: string;
-  borderColor?: string;
-  rippleColor?: string;
-  dark?: boolean;
-}
-
-
-
-declare class Col extends SvelteComponentTyped<
-  ColProps,
-  { click: CustomEvent<void>; gridResize: CustomEvent<void>; },
-  {  'default' : {}; }
-> {}
-
-export { ColProps };
-export default Col;

package/components/col.svelte

@@ -1,73 +0,0 @@
-<script>
-  import { createEventDispatcher, onMount, onDestroy } from 'svelte';
-  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);
-
-  let className = undefined;
-  export { className as class };
-
-  export let tag = 'div';
-  export let width = 'auto';
-  export let xsmall = undefined;
-  export let small = undefined;
-  export let medium = undefined;
-  export let large = undefined;
-  export let xlarge = undefined;
-  export let resizable = false;
-  export let resizableFixed = false;
-  export let resizableAbsolute = false;
-  export let resizableHandler = true;
-
-  let el;
-
-  $: classes = classNames(
-    className,
-    {
-      col: width === 'auto',
-      [`col-${width}`]: width !== 'auto',
-      [`xsmall-${xsmall}`]: xsmall,
-      [`small-${small}`]: small,
-      [`medium-${medium}`]: medium,
-      [`large-${large}`]: large,
-      [`xlarge-${xlarge}`]: xlarge,
-      resizable,
-      'resizable-fixed': resizableFixed,
-      'resizable-absolute': resizableAbsolute,
-    },
-    colorClasses($$props),
-  );
-
-  function onClick() {
-    emit('click');
-  }
-  function onResize(targetEl) {
-    if (el !== targetEl) return;
-    emit('gridResize');
-  }
-
-  onMount(() => {
-    f7ready(() => {
-      app.f7.on('gridResize', onResize);
-    });
-  });
-  onDestroy(() => {
-    if (!app.f7) return;
-    app.f7.off('gridResize', onResize);
-  });
-</script>
-
-{#if tag === 'div'}
-  <div class={classes} bind:this={el} on:click={onClick} {...restProps($$restProps)}>
-    <slot />
-    {#if resizable && resizableHandler}<span class="resize-handler" />{/if}
-  </div>
-{:else if tag === 'span'}
-  <span class={classes} bind:this={el} on:click={onClick} {...restProps($$restProps)}>
-    <slot />
-    {#if resizable && resizableHandler}<span class="resize-handler" />{/if}
-  </span>
-{/if}

package/components/list-item-cell.d.ts

@@ -1,25 +0,0 @@
-
-import { SvelteComponentTyped } from 'svelte';
-
-
-interface ListItemCellProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap['div']> {
-  children?: React.ReactNode;
-  color?: string;
-  colorTheme?: string;
-  textColor?: string;
-  bgColor?: string;
-  borderColor?: string;
-  rippleColor?: string;
-  dark?: boolean;
-}
-
-
-
-declare class ListItemCell extends SvelteComponentTyped<
-  ListItemCellProps,
-  {  },
-  {  'default' : {}; }
-> {}
-
-export { ListItemCellProps };
-export default ListItemCell;

package/components/list-item-cell.svelte

@@ -1,14 +0,0 @@
-<script>
-  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 };
-
-  $: classes = classNames(className, 'item-cell', colorClasses($$props));
-</script>
-
-<div class={classes} {...restProps($$restProps)}>
-  <slot />
-</div>

package/components/list-item-row.d.ts

@@ -1,25 +0,0 @@
-
-import { SvelteComponentTyped } from 'svelte';
-
-
-interface ListItemRowProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap['div']> {
-  children?: React.ReactNode;
-  color?: string;
-  colorTheme?: string;
-  textColor?: string;
-  bgColor?: string;
-  borderColor?: string;
-  rippleColor?: string;
-  dark?: boolean;
-}
-
-
-
-declare class ListItemRow extends SvelteComponentTyped<
-  ListItemRowProps,
-  {  },
-  {  'default' : {}; }
-> {}
-
-export { ListItemRowProps };
-export default ListItemRow;

package/components/list-item-row.svelte

@@ -1,14 +0,0 @@
-<script>
-  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 };
-
-  $: classes = classNames(className, 'item-row', colorClasses($$props));
-</script>
-
-<div class={classes} {...restProps($$restProps)}>
-  <slot />
-</div>

package/components/menu-dropdown-item.d.ts

@@ -1,70 +0,0 @@
-
-import { SvelteComponentTyped } from 'svelte';
-
-
-interface MenuDropdownItemProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap['div']> {
-  text ?: string;
-  link ?: boolean;
-  href ?: string;
-  target ?: string;
-  divider ?: boolean;
-  color?: string;
-  colorTheme?: string;
-  textColor?: string;
-  bgColor?: string;
-  borderColor?: string;
-  rippleColor?: string;
-  dark?: boolean;
-  back?: boolean;
-  external?: boolean;
-  force?: boolean;
-  animate?: boolean;
-  ignoreCache?: boolean;
-  reloadCurrent?: boolean;
-  reloadAll?: boolean;
-  reloadPrevious?: boolean;
-  reloadDetail?: boolean;
-  routeTabId?: string;
-  view?: string;
-  routeProps?: any;
-  preventRouter?: boolean;
-  transition?: string;
-  openIn?: string;
-  searchbarEnable?: boolean | string;
-  searchbarDisable?: boolean | string;
-  searchbarClear?: boolean | string;
-  searchbarToggle?: boolean | string;
-  panelOpen?: boolean | string;
-  panelClose?: boolean | string;
-  panelToggle?: boolean | string;
-  popupOpen?: boolean | string;
-  popupClose?: boolean | string;
-  actionsOpen?: boolean | string;
-  actionsClose?: boolean | string;
-  popoverOpen?: boolean | string;
-  popoverClose?: boolean | string;
-  loginScreenOpen?: boolean | string;
-  loginScreenClose?: boolean | string;
-  sheetOpen?: boolean | string;
-  sheetClose?: boolean | string;
-  sortableEnable?: boolean | string;
-  sortableDisable?: boolean | string;
-  sortableToggle?: boolean | string;
-  cardOpen?: boolean | string;
-  cardPreventOpen?: boolean | string;
-  cardClose?: boolean | string;
-  menuClose?: boolean | string;
-  onClick ?: (event?: any) => void;
-  children?: React.ReactNode;
-}
-
-
-
-declare class MenuDropdownItem extends SvelteComponentTyped<
-  MenuDropdownItemProps,
-  { click: CustomEvent<void>; },
-  {  'default' : {}; }
-> {}
-
-export { MenuDropdownItemProps };
-export default MenuDropdownItem;

package/components/menu-dropdown-item.svelte

@@ -1,73 +0,0 @@
-<script>
-  import { createEventDispatcher } from 'svelte';
-  import {
-    colorClasses,
-    routerAttrs,
-    routerClasses,
-    actionsAttrs,
-    actionsClasses,
-  } 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);
-
-  let className = undefined;
-  export { className as class };
-
-  export let text = undefined;
-  export let href = undefined;
-  export let link = undefined;
-  export let target = undefined;
-  export let divider = undefined;
-  export let routeProps = undefined;
-
-  let el;
-
-  $: hrefComputed = typeof href === 'undefined' && link ? '#' : href;
-
-  $: attrs = extend(
-    {
-      href: hrefComputed,
-      target,
-      ...restProps($$restProps),
-    },
-    routerAttrs($$props),
-    actionsAttrs($$props),
-  );
-
-  $: isLink = link || href || href === '';
-
-  $: classes = classNames(
-    {
-      'menu-dropdown-link': isLink && !divider,
-      'menu-dropdown-item': !isLink && !divider,
-      'menu-dropdown-divider': divider,
-    },
-    className,
-    colorClasses($$props),
-    routerClasses($$props),
-    actionsClasses($$props),
-    {
-      'menu-close': typeof menuClose === 'undefined',
-    },
-  );
-
-  function onClick(e) {
-    emit('click', [e]);
-  }
-</script>
-
-<!-- svelte-ignore a11y-missing-attribute -->
-{#if isLink}
-  <a on:click={onClick} bind:this={el} class={classes} {...attrs} use:useRouteProps={routeProps}>
-    {plainText(text)}
-    <slot />
-  </a>
-{:else}
-  <div on:click={onClick} bind:this={el} class={classes} {...attrs} use:useRouteProps={routeProps}>
-    {plainText(text)}
-    <slot />
-  </div>
-{/if}

package/components/menu-dropdown.d.ts

@@ -1,30 +0,0 @@
-
-import { SvelteComponentTyped } from 'svelte';
-
-
-interface MenuDropdownProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap['div']> {
-  contentHeight ?: string;
-  position ?: string;
-  left ?: boolean;
-  center ?: boolean;
-  right ?: boolean;
-  children?: React.ReactNode;
-  color?: string;
-  colorTheme?: string;
-  textColor?: string;
-  bgColor?: string;
-  borderColor?: string;
-  rippleColor?: string;
-  dark?: boolean;
-}
-
-
-
-declare class MenuDropdown extends SvelteComponentTyped<
-  MenuDropdownProps,
-  {  },
-  {  'default' : {}; }
-> {}
-
-export { MenuDropdownProps };
-export default MenuDropdown;

package/components/menu-dropdown.svelte

@@ -1,35 +0,0 @@
-<script>
-  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 };
-
-  export let contentHeight = undefined;
-  export let position = undefined;
-  export let left = undefined;
-  export let center = undefined;
-  export let right = undefined;
-
-  $: positionComputed = (() => {
-    let pos = position || 'left';
-    if (left) pos = 'left';
-    if (center) pos = 'center';
-    if (right) pos = 'right';
-    return pos;
-  })();
-
-  $: classes = classNames(
-    'menu-dropdown',
-    `menu-dropdown-${positionComputed}`,
-    colorClasses($$props),
-    className,
-  );
-</script>
-
-<div class={classes} {...restProps($$restProps)}>
-  <div class="menu-dropdown-content" style={contentHeight && `height: ${contentHeight}`}>
-    <slot />
-  </div>
-</div>

package/components/menu-item.d.ts

@@ -1,83 +0,0 @@
-
-import { SvelteComponentTyped } from 'svelte';
-
-
-interface MenuItemProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap['div']> {
-  text?: string;
-  iconOnly?: boolean;
-  href?: string;
-  link?: boolean;
-  target?: string;
-  dropdown?: boolean;
-  tooltip ?: string;
-  tooltipTrigger ?: string;
-  color?: string;
-  colorTheme?: string;
-  textColor?: string;
-  bgColor?: string;
-  borderColor?: string;
-  rippleColor?: string;
-  dark?: boolean;
-  icon?: string;
-  iconMaterial?: string;
-  iconF7?: string;
-  iconIos?: string;
-  iconMd?: string;
-  iconAurora?: string;
-  iconColor?: string;
-  iconSize?: string | number;
-  back?: boolean;
-  external?: boolean;
-  force?: boolean;
-  animate?: boolean;
-  ignoreCache?: boolean;
-  reloadCurrent?: boolean;
-  reloadAll?: boolean;
-  reloadPrevious?: boolean;
-  reloadDetail?: boolean;
-  routeTabId?: string;
-  view?: string;
-  routeProps?: any;
-  preventRouter?: boolean;
-  transition?: string;
-  openIn?: string;
-  searchbarEnable?: boolean | string;
-  searchbarDisable?: boolean | string;
-  searchbarClear?: boolean | string;
-  searchbarToggle?: boolean | string;
-  panelOpen?: boolean | string;
-  panelClose?: boolean | string;
-  panelToggle?: boolean | string;
-  popupOpen?: boolean | string;
-  popupClose?: boolean | string;
-  actionsOpen?: boolean | string;
-  actionsClose?: boolean | string;
-  popoverOpen?: boolean | string;
-  popoverClose?: boolean | string;
-  loginScreenOpen?: boolean | string;
-  loginScreenClose?: boolean | string;
-  sheetOpen?: boolean | string;
-  sheetClose?: boolean | string;
-  sortableEnable?: boolean | string;
-  sortableDisable?: boolean | string;
-  sortableToggle?: boolean | string;
-  cardOpen?: boolean | string;
-  cardPreventOpen?: boolean | string;
-  cardClose?: boolean | string;
-  menuClose?: boolean | string;
-  onClick ?: (event?: any) => void;
-  onMenuOpened ?: (el?: HTMLElement) => void;
-  onMenuClosed ?: (el?: HTMLElement) => void;
-  children?: React.ReactNode;
-}
-
-
-
-declare class MenuItem extends SvelteComponentTyped<
-  MenuItemProps,
-  { click: CustomEvent<void>; menuOpened: CustomEvent<void>; menuClosed: CustomEvent<void>; },
-  {  'text' : {};  'default' : {}; }
-> {}
-
-export { MenuItemProps };
-export default MenuItem;