neko-ui 2.9.2 → 2.9.4

package/lib/select/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/select/index.tsx"],"sourcesContent":["import {\n  batch,\n  createEffect,\n  createMemo,\n  createSignal,\n  For,\n  mergeProps,\n  onMount,\n  Show,\n  splitProps,\n  untrack,\n} from 'solid-js';\nimport { isFunction } from '@moneko/common';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement, DropdownMultipleProps, DropdownProps, MenuOption } from '..';\nimport { clearAttribute, FieldName } from '../basic-config';\nimport Dropdown, { defaultProps } from '../dropdown';\nimport getOptions from '../get-options';\nimport { inline } from '../theme';\n\nimport { style } from './style';\n\nimport '../tag';\n\nfunction Select(props: SelectProps) {\n  const [local, other] = splitProps(props, [\n    'css',\n    'value',\n    'onChange',\n    'open',\n    'onOpenChange',\n    'label',\n    'prefixIcon',\n    'suffixIcon',\n    'placeholder',\n    'trigger',\n    'options',\n  ]);\n  let ref: HTMLInputElement | undefined;\n  let tagsRef: HTMLDivElement | undefined;\n  const [open, setOpen] = createSignal<boolean | null>(null);\n  const [value, setValue] = createSignal<(string | number)[]>([]);\n  const [x, setX] = createSignal<string>('');\n  const [options, setOptions] = createSignal<MenuOption[]>([]);\n  const [kv, setKv] = createSignal<Record<string, MenuOption | undefined>>({});\n\n  const fieldNames = createMemo(() => Object.assign({}, FieldName, other.fieldNames));\n\n  function getKv(arr: MenuOption[], fieldDic: typeof FieldName) {\n    const optKv: Record<string, MenuOption> = {};\n\n    for (let i = 0, len = arr.length; i < len; i++) {\n      const item = arr[i];\n      const _options = item[fieldDic.options];\n\n      optKv[item[fieldDic.value]!] = item;\n      if (Array.isArray(_options)) {\n        Object.assign(optKv, getKv(_options as MenuOption[], fieldDic));\n      }\n      const _children = item[fieldDic.children];\n\n      optKv[item[fieldDic.value]!] = item;\n      if (Array.isArray(_children)) {\n        Object.assign(optKv, getKv(_children as MenuOption[], fieldDic));\n      }\n    }\n    return optKv;\n  }\n\n  createEffect(() => {\n    batch(() => {\n      const fieldDic = fieldNames();\n      const opts = getOptions(local.options, fieldDic);\n\n      setOptions(opts);\n      setKv(getKv(opts, fieldDic));\n    });\n  });\n\n  function openChange(next: boolean | null) {\n    if (!other.disabled) {\n      if (isFunction(local.onOpenChange)) {\n        local.onOpenChange(next);\n      }\n      if (local.open === void 0) {\n        setOpen(next);\n      }\n    }\n  }\n  function click(e: MouseEvent) {\n    if (\n      (e.target as Element | null)?.parentElement ===\n      (ref?.parentNode?.parentNode as Document | null)?.activeElement\n    ) {\n      openChange(!untrack(open));\n    }\n  }\n  function onChange(val: (string | number)[] | string | number | undefined, item?: MenuOption) {\n    if (local.value === void 0) {\n      setValue(val ? (Array.isArray(val) ? val : [val]) : []);\n    }\n    if (isFunction(local.onChange)) {\n      local.onChange(val, item);\n    }\n  }\n  function keyDown({ key }: { key: string }) {\n    switch (key) {\n      case 'ArrowDown':\n        // console.log(key);\n        // Object.keys(state.current.kv).indexOf(state.current.value)\n        break;\n      case 'ArrowUp':\n        break;\n      case 'Backspace':\n        if (other.multiple) {\n          const old = [...untrack(value)];\n\n          old.splice(-1, 1);\n          onChange(old, untrack(kv)[untrack(value).length - 1]);\n        } else {\n          onChange(void 0, untrack(kv)[untrack(value)[0]]);\n        }\n        break;\n      case 'Enter':\n        openChange(!untrack(open));\n        break;\n      case 'Escape':\n        openChange(false);\n        break;\n      default:\n        break;\n    }\n  }\n  function preventDefault(e: Event) {\n    e.stopPropagation();\n    e.preventDefault();\n  }\n  function deleteValue(v: string | number, e: CustomEvent) {\n    preventDefault(e);\n    onChange(untrack(value).filter((old) => old !== v) as never, untrack(kv)[v]);\n  }\n  function focus(e: FocusEvent | MouseEvent) {\n    preventDefault(e);\n    openChange(true);\n  }\n  function blur(e: FocusEvent) {\n    preventDefault(e);\n    if (untrack(open)) {\n      openChange(false);\n    }\n  }\n\n  createEffect(() => {\n    batch(() => {\n      if (local.open !== untrack(open) && local.open !== void 0) {\n        setOpen(local.open);\n      }\n      if (local.value !== void 0 && local.value !== null) {\n        setValue(Array.isArray(local.value) ? local.value : [local.value]);\n      } else {\n        setValue([]);\n      }\n    });\n  });\n  onMount(() => {\n    if (local.value === void 0) {\n      const val = other.defaultValue;\n\n      setValue(val ? (Array.isArray(val) ? val : [val]) : []);\n    }\n  });\n  createEffect(() => {\n    if (local.label) {\n      setX(`.label {--x: ${tagsRef?.offsetLeft || 0}px; }`);\n    }\n  });\n  const prefix = createMemo(() =>\n    isFunction(local.prefixIcon) ? (local.prefixIcon() as JSX.Element) : local.prefixIcon,\n  );\n  const label = createMemo(() =>\n    isFunction(local.label) ? (local.label() as JSX.Element) : local.label,\n  );\n  const suffix = createMemo(() =>\n    isFunction(local.suffixIcon) ? (local.suffixIcon() as JSX.Element) : local.suffixIcon,\n  );\n\n  return (\n    <Dropdown\n      placement=\"left\"\n      css={style + x() + (local.css || '')}\n      trigger=\"none\"\n      items={options()}\n      value={value() as unknown as string}\n      onChange={onChange}\n      open={open()}\n      onOpenChange={openChange}\n      {...other}\n    >\n      <div\n        ref={ref}\n        class=\"select\"\n        tabindex={other.disabled ? -1 : 0}\n        onKeyDown={keyDown}\n        onFocus={focus}\n        onBlur={blur}\n        aria-disabled={other.disabled}\n      >\n        <Show when={prefix()}>\n          <span class=\"prefix\">{prefix()}</span>\n        </Show>\n        <Show when={label()}>\n          <label class=\"label\">{label()}</label>\n        </Show>\n        <div class=\"tags\" ref={tagsRef} onMouseDown={click}>\n          <Show\n            when={other.multiple}\n            fallback={\n              <Show\n                when={value().length}\n                fallback={\n                  <Show when={local.placeholder}>\n                    <span class=\"placeholder\">{local.placeholder}</span>\n                  </Show>\n                }\n              >\n                <span\n                  class=\"value\"\n                  classList={{\n                    opacity: !!open(),\n                  }}\n                >\n                  {kv()[value()[0]]?.[fieldNames().label] || value()[0]}\n                </span>\n              </Show>\n            }\n          >\n            <For\n              each={value()}\n              fallback={\n                <Show when={local.placeholder}>\n                  <span class=\"placeholder\">{local.placeholder}</span>\n                </Show>\n              }\n            >\n              {(v) => (\n                <n-tag\n                  class=\"tag\"\n                  classList={{\n                    opacity: !!open(),\n                  }}\n                  type={kv()[v]?.type || 'primary'}\n                  color={kv()[v]?.color}\n                  icon={kv()[v]?.icon}\n                  close-icon={!other.disabled && !kv()[v]?.disabled}\n                  onClose={deleteValue.bind(null, v)}\n                  disabled={other.disabled || kv()[v]?.disabled}\n                >\n                  {kv()[v]?.[fieldNames().label] || v}\n                </n-tag>\n              )}\n            </For>\n          </Show>\n        </div>\n        <Show when={suffix()}>\n          <span class=\"suffix\">{suffix()}</span>\n        </Show>\n      </div>\n    </Dropdown>\n  );\n}\n\n/** 通用API */\ninterface SelectBaseProps {\n  /** 占位符 */\n  placeholder?: string;\n  /** 选项 */\n  options?: (MenuOption | string | number)[];\n  /** 标题 */\n  label?: JSX.Element | (() => JSX.Element | (() => JSX.Element));\n  /** 前缀图标 */\n  prefixIcon?: JSX.Element | (() => JSX.Element | (() => JSX.Element));\n  /** 后缀图标 */\n  suffixIcon?: JSX.Element | (() => JSX.Element | (() => JSX.Element));\n  style?: Record<string, string | number>;\n}\n\n/** 单选 */\nexport interface SelectProps extends Omit<DropdownProps, 'items' | 'children'>, SelectBaseProps {\n  /** 值 */\n  value?: string | number;\n}\n\n/** 多选 */\nexport interface SelectMultipleProps\n  extends Omit<DropdownMultipleProps, 'items' | 'children'>,\n    SelectBaseProps {\n  /** 值\n   * @default []\n   */\n  value?: (string | number)[];\n}\nexport type SelectElement = CustomElement<SelectProps, 'onChange' | 'onOpenChange'>;\nexport type SelectMultipleElement = CustomElement<SelectMultipleProps, 'onChange' | 'onOpenChange'>;\n\ncustomElement<SelectProps>(\n  'n-select',\n  {\n    ...defaultProps,\n    options: [],\n    label: void 0,\n    placeholder: '请选择',\n    dropdownMatchSelectWidth: true,\n    prefixIcon: void 0,\n    suffixIcon: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        onChange(key: string | number, item: MenuOption) {\n          el.dispatchEvent(\n            new CustomEvent('change', {\n              detail: [key, item],\n            }),\n          );\n        },\n        onOpenChange(open: boolean | null) {\n          el.dispatchEvent(\n            new CustomEvent('openchange', {\n              detail: open,\n            }),\n          );\n        },\n      },\n      _,\n    );\n\n    createEffect(() => {\n      clearAttribute(el, ['options', 'css', 'fieldNames']);\n    });\n    return (\n      <>\n        <style textContent={inline} />\n        <Select {...props} />\n      </>\n    );\n  },\n);\nexport default Select;\n"],"names":["Select","props","ref","tagsRef","local","other","splitProps","open","setOpen","createSignal","value","setValue","x","setX","options","setOptions","kv","setKv","fieldNames","createMemo","Object","assign","FieldName","openChange","next","disabled","isFunction","onOpenChange","click","e","target","parentElement","parentNode","activeElement","untrack","onChange","val","item","Array","isArray","keyDown","key","multiple","old","splice","length","preventDefault","stopPropagation","deleteValue","v","filter","focus","blur","createEffect","batch","fieldDic","opts","getOptions","getKv","arr","optKv","i","len","_options","_children","children","onMount","defaultValue","label","offsetLeft","prefix","prefixIcon","suffix","suffixIcon","Dropdown","style","css","Show","placeholder","For","bind","type","color","icon","customElement","defaultProps","dropdownMatchSelectWidth","_","opt","el","element","mergeProps","dispatchEvent","CustomEvent","detail","clearAttribute","inline"],"mappings":"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"}
+{"version":3,"sources":["components/select/index.tsx"],"sourcesContent":["import {\n  batch,\n  createEffect,\n  createMemo,\n  createSignal,\n  For,\n  mergeProps,\n  onMount,\n  Show,\n  splitProps,\n  untrack,\n} from 'solid-js';\nimport { isFunction } from '@moneko/common';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement, DropdownMultipleProps, DropdownProps, MenuOption } from '..';\nimport { clearAttribute, FieldName } from '../basic-config';\nimport Dropdown, { defaultProps } from '../dropdown';\nimport getOptions from '../get-options';\nimport { inline } from '../theme';\n\nimport { style } from './style';\n\nimport '../tag';\n\nfunction Select(props: SelectProps) {\n  const [local, other] = splitProps(props, [\n    'css',\n    'value',\n    'onChange',\n    'open',\n    'onOpenChange',\n    'label',\n    'prefixIcon',\n    'suffixIcon',\n    'placeholder',\n    'trigger',\n    'options',\n  ]);\n  let ref: HTMLInputElement | undefined;\n  let tagsRef: HTMLDivElement | undefined;\n  const [open, setOpen] = createSignal<boolean | null>(null);\n  const [value, setValue] = createSignal<(string | number)[]>([]);\n  const [x, setX] = createSignal<string>('');\n  const [options, setOptions] = createSignal<MenuOption[]>([]);\n  const [kv, setKv] = createSignal<Record<string, MenuOption | undefined>>({});\n\n  const fieldNames = createMemo(() => Object.assign({}, FieldName, other.fieldNames));\n\n  function getKv(arr: MenuOption[], fieldDic: typeof FieldName) {\n    const optKv: Record<string, MenuOption> = {};\n\n    for (let i = 0, len = arr.length; i < len; i++) {\n      const item = arr[i];\n      const _options = item[fieldDic.options];\n\n      optKv[item[fieldDic.value]!] = item;\n      if (Array.isArray(_options)) {\n        Object.assign(optKv, getKv(_options as MenuOption[], fieldDic));\n      }\n      const _children = item[fieldDic.children];\n\n      optKv[item[fieldDic.value]!] = item;\n      if (Array.isArray(_children)) {\n        Object.assign(optKv, getKv(_children as MenuOption[], fieldDic));\n      }\n    }\n    return optKv;\n  }\n\n  createEffect(() => {\n    batch(() => {\n      const fieldDic = fieldNames();\n      const opts = getOptions(local.options, fieldDic);\n\n      setOptions(opts);\n      setKv(getKv(opts, fieldDic));\n    });\n  });\n\n  function openChange(next: boolean | null) {\n    if (!other.disabled) {\n      if (isFunction(local.onOpenChange)) {\n        local.onOpenChange(next);\n      }\n      if (local.open === void 0) {\n        setOpen(next);\n      }\n    }\n  }\n  function click(e: MouseEvent) {\n    if (\n      (e.target as Element | null)?.parentElement ===\n      (ref?.parentNode?.parentNode as Document | null)?.activeElement\n    ) {\n      openChange(!untrack(open));\n    }\n  }\n  function onChange(val: (string | number)[] | string | number | undefined, item?: MenuOption) {\n    if (local.value === void 0) {\n      setValue(val ? (Array.isArray(val) ? val : [val]) : []);\n    }\n    if (isFunction(local.onChange)) {\n      local.onChange(val, item);\n    }\n  }\n  function keyDown({ key }: { key: string }) {\n    switch (key) {\n      case 'ArrowDown':\n        // console.log(key);\n        // Object.keys(state.current.kv).indexOf(state.current.value)\n        break;\n      case 'ArrowUp':\n        break;\n      case 'Backspace':\n        if (other.multiple) {\n          const old = [...untrack(value)];\n\n          old.splice(-1, 1);\n          onChange(old, untrack(kv)[untrack(value).length - 1]);\n        } else {\n          onChange(void 0, untrack(kv)[untrack(value)[0]]);\n        }\n        break;\n      case 'Enter':\n        openChange(!untrack(open));\n        break;\n      case 'Escape':\n        openChange(false);\n        break;\n      default:\n        break;\n    }\n  }\n  function preventDefault(e: Event) {\n    e.stopPropagation();\n    e.preventDefault();\n  }\n  function deleteValue(v: string | number, e: CustomEvent) {\n    preventDefault(e);\n    onChange(untrack(value).filter((old) => old !== v) as never, untrack(kv)[v]);\n  }\n  function focus(e: FocusEvent | MouseEvent) {\n    preventDefault(e);\n    openChange(true);\n  }\n  function blur(e: FocusEvent) {\n    preventDefault(e);\n    if (untrack(open)) {\n      openChange(false);\n    }\n  }\n\n  createEffect(() => {\n    batch(() => {\n      if (local.open !== untrack(open) && local.open !== void 0) {\n        setOpen(local.open);\n      }\n      if (local.value !== void 0 && local.value !== null) {\n        setValue(Array.isArray(local.value) ? local.value : [local.value]);\n      } else {\n        setValue([]);\n      }\n    });\n  });\n  onMount(() => {\n    if (local.value === void 0) {\n      const val = other.defaultValue;\n\n      setValue(val ? (Array.isArray(val) ? val : [val]) : []);\n    }\n  });\n  createEffect(() => {\n    if (local.label) {\n      setX(`.label {--x: ${tagsRef?.offsetLeft || 0}px; }`);\n    }\n  });\n  const prefix = createMemo(() =>\n    isFunction(local.prefixIcon) ? (local.prefixIcon() as JSX.Element) : local.prefixIcon,\n  );\n  const label = createMemo(() =>\n    isFunction(local.label) ? (local.label() as JSX.Element) : local.label,\n  );\n  const suffix = createMemo(() =>\n    isFunction(local.suffixIcon) ? (local.suffixIcon() as JSX.Element) : local.suffixIcon,\n  );\n\n  return (\n    <Dropdown\n      placement=\"left\"\n      css={style + x() + (local.css || '')}\n      trigger=\"none\"\n      items={options()}\n      value={value() as unknown as string}\n      onChange={onChange}\n      open={open()}\n      onOpenChange={openChange}\n      {...other}\n    >\n      <div\n        ref={ref}\n        class=\"select\"\n        tabindex={other.disabled ? -1 : 0}\n        onKeyDown={keyDown}\n        onFocus={focus}\n        onBlur={blur}\n        aria-disabled={other.disabled}\n      >\n        <Show when={prefix()}>\n          <span class=\"prefix\">{prefix()}</span>\n        </Show>\n        <Show when={label()}>\n          <label class=\"label\">{label()}</label>\n        </Show>\n        <div class=\"tags\" ref={tagsRef} onMouseDown={click}>\n          <Show\n            when={other.multiple}\n            fallback={\n              <Show\n                when={value().length}\n                fallback={\n                  <Show when={local.placeholder}>\n                    <span class=\"placeholder\">{local.placeholder}</span>\n                  </Show>\n                }\n              >\n                <span\n                  class=\"value\"\n                  classList={{\n                    opacity: !!open(),\n                  }}\n                >\n                  {kv()[value()[0]]?.[fieldNames().label] || value()[0]}\n                </span>\n              </Show>\n            }\n          >\n            <For\n              each={value()}\n              fallback={\n                <Show when={local.placeholder}>\n                  <span class=\"placeholder\">{local.placeholder}</span>\n                </Show>\n              }\n            >\n              {(v) => (\n                <n-tag\n                  class=\"tag\"\n                  classList={{\n                    opacity: !!open(),\n                  }}\n                  type={kv()[v]?.type || 'primary'}\n                  color={kv()[v]?.color}\n                  icon={kv()[v]?.icon}\n                  close-icon={!other.disabled && !kv()[v]?.disabled}\n                  onClose={deleteValue.bind(null, v)}\n                  disabled={other.disabled || kv()[v]?.disabled}\n                >\n                  {kv()[v]?.[fieldNames().label] || v}\n                </n-tag>\n              )}\n            </For>\n          </Show>\n        </div>\n        <Show when={suffix()}>\n          <span class=\"suffix\">{suffix()}</span>\n        </Show>\n      </div>\n    </Dropdown>\n  );\n}\n\n/** 通用API */\ninterface SelectBaseProps {\n  /** 占位符 */\n  placeholder?: string;\n  /** 选项 */\n  options?: (MenuOption | string | number)[];\n  /** 标题 */\n  label?: JSX.Element | (() => JSX.Element | (() => JSX.Element));\n  /** 前缀图标 */\n  prefixIcon?: JSX.Element | (() => JSX.Element | (() => JSX.Element));\n  /** 后缀图标 */\n  suffixIcon?: JSX.Element | (() => JSX.Element | (() => JSX.Element));\n  style?: Record<string, string | number>;\n}\n\n/** 单选 */\nexport interface SelectProps extends Omit<DropdownProps, 'items' | 'children'>, SelectBaseProps {\n  /** 值 */\n  value?: string | number;\n}\n\n/** 多选 */\nexport interface SelectMultipleProps\n  extends Omit<DropdownMultipleProps, 'items' | 'children'>,\n    SelectBaseProps {\n  /** 值\n   * @default []\n   */\n  value?: (string | number)[];\n}\nexport type SelectElement = CustomElement<SelectProps, 'onChange' | 'onOpenChange'>;\nexport type SelectMultipleElement = CustomElement<SelectMultipleProps, 'onChange' | 'onOpenChange'>;\n\ncustomElement<SelectProps>(\n  'n-select',\n  {\n    ...defaultProps,\n    options: [],\n    label: void 0,\n    placeholder: '请选择',\n    dropdownMatchSelectWidth: true,\n    prefixIcon: void 0,\n    suffixIcon: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        onChange(key: string | number, item: MenuOption) {\n          el.dispatchEvent(\n            new CustomEvent('change', {\n              detail: [key, item],\n            }),\n          );\n        },\n        onOpenChange(open: boolean | null) {\n          el.dispatchEvent(\n            new CustomEvent('openchange', {\n              detail: open,\n            }),\n          );\n        },\n      },\n      _,\n    );\n\n    createEffect(() => {\n      clearAttribute(el, ['options', 'css', 'fieldNames']);\n    });\n    return (\n      <>\n        <style textContent={inline} />\n        <Select {...props} />\n      </>\n    );\n  },\n);\nexport default Select;\n"],"names":["Select","props","ref","tagsRef","local","other","splitProps","open","setOpen","createSignal","value","setValue","x","setX","options","setOptions","kv","setKv","fieldNames","createMemo","Object","assign","FieldName","openChange","next","disabled","isFunction","onOpenChange","click","e","target","parentElement","parentNode","activeElement","untrack","onChange","val","item","Array","isArray","keyDown","key","multiple","old","splice","length","preventDefault","stopPropagation","deleteValue","v","filter","focus","blur","createEffect","batch","fieldDic","opts","getOptions","getKv","arr","optKv","i","len","_options","_children","children","onMount","defaultValue","label","offsetLeft","prefix","prefixIcon","suffix","suffixIcon","Dropdown","style","css","Show","placeholder","For","bind","type","color","icon","customElement","defaultProps","dropdownMatchSelectWidth","_","opt","el","element","mergeProps","dispatchEvent","CustomEvent","detail","clearAttribute","inline"],"mappings":"kGA6VA,+CAAA,+CAlVO,wBACoB,4CACG,2BAGY,+BACH,4BAChB,6BACA,sBAED,ipBAEf,2WAEP,SAASA,EAAOC,CAAkB,MAc5BC,EACAC,EAdJ,GAAM,CAACC,EAAOC,EAAM,CAAGC,GAAAA,YAAU,EAACL,EAAO,CACvC,MACA,QACA,WACA,OACA,eACA,QACA,aACA,aACA,cACA,UACA,UACD,EAGK,CAACM,EAAMC,EAAQ,CAAGC,GAAAA,cAAY,EAAiB,MAC/C,CAACC,EAAOC,EAAS,CAAGF,GAAAA,cAAY,EAAsB,EAAE,EACxD,CAACG,EAAGC,EAAK,CAAGJ,GAAAA,cAAY,EAAS,IACjC,CAACK,EAASC,EAAW,CAAGN,GAAAA,cAAY,EAAe,EAAE,EACrD,CAACO,EAAIC,EAAM,CAAGR,GAAAA,cAAY,EAAyC,CAAC,GAEpES,EAAaC,GAAAA,YAAU,EAAC,IAAMC,OAAOC,MAAM,CAAC,CAAC,EAAGC,WAAS,CAAEjB,EAAMa,UAAU,GAiCjF,SAASK,EAAWC,CAAoB,EACjCnB,EAAMoB,QAAQ,GACbC,GAAAA,SAAU,EAACtB,EAAMuB,YAAY,GAC/BvB,EAAMuB,YAAY,CAACH,GAEF,KAAK,IAApBpB,EAAMG,IAAI,EACZC,EAAQgB,GAGd,CACA,SAASI,EAAMC,CAAa,EAEvBA,EAAEC,MAAM,EAAqBC,gBAC7B7B,GAAK8B,YAAYA,YAAgCC,eAElDV,EAAW,CAACW,GAAAA,SAAO,EAAC3B,GAExB,CACA,SAAS4B,EAASC,CAAsD,CAAEC,CAAiB,EACrE,KAAK,IAArBjC,EAAMM,KAAK,EACbC,EAASyB,EAAOE,MAAMC,OAAO,CAACH,GAAOA,EAAM,CAACA,EAAI,CAAI,EAAE,EAEpDV,GAAAA,SAAU,EAACtB,EAAM+B,QAAQ,GAC3B/B,EAAM+B,QAAQ,CAACC,EAAKC,EAExB,CACA,SAASG,EAAQ,CAAEC,IAAAA,CAAG,CAAmB,EACvC,OAAQA,GACN,IAAK,YAIL,IAAK,UADH,KAGF,KAAK,YACH,GAAIpC,EAAMqC,QAAQ,CAAE,CAClB,IAAMC,EAAM,IAAIT,GAAAA,SAAO,EAACxB,GAAO,CAE/BiC,EAAIC,MAAM,CAAC,GAAI,GACfT,EAASQ,EAAKT,GAAAA,SAAO,EAAClB,EAAG,CAACkB,GAAAA,SAAO,EAACxB,GAAOmC,MAAM,CAAG,EAAE,CACtD,MACEV,EAAS,KAAK,EAAGD,GAAAA,SAAO,EAAClB,EAAG,CAACkB,GAAAA,SAAO,EAACxB,EAAM,CAAC,EAAE,CAAC,EAEjD,KACF,KAAK,QACHa,EAAW,CAACW,GAAAA,SAAO,EAAC3B,IACpB,KACF,KAAK,SACHgB,EAAW,CAAA,EAIf,CACF,CACA,SAASuB,EAAejB,CAAQ,EAC9BA,EAAEkB,eAAe,GACjBlB,EAAEiB,cAAc,EAClB,CACA,SAASE,EAAYC,CAAkB,CAAEpB,CAAc,EACrDiB,EAAejB,GACfM,EAASD,GAAAA,SAAO,EAACxB,GAAOwC,MAAM,CAAC,AAACP,GAAQA,IAAQM,GAAaf,GAAAA,SAAO,EAAClB,EAAG,CAACiC,EAAE,CAC7E,CACA,SAASE,EAAMtB,CAA0B,EACvCiB,EAAejB,GACfN,EAAW,CAAA,EACb,CACA,SAAS6B,EAAKvB,CAAa,EACzBiB,EAAejB,GACXK,GAAAA,SAAO,EAAC3B,IACVgB,EAAW,CAAA,EAEf,CAjFA8B,GAAAA,cAAY,EAAC,KACXC,GAAAA,OAAK,EAAC,KACJ,IAAMC,EAAWrC,IACXsC,EAAOC,GAAAA,SAAU,EAACrD,EAAMU,OAAO,CAAEyC,GAEvCxC,EAAWyC,GACXvC,EAAMyC,AA3BV,SAASA,EAAMC,CAAiB,CAAEJ,CAA0B,EAC1D,IAAMK,EAAoC,CAAC,EAE3C,IAAK,IAAIC,EAAI,EAAGC,EAAMH,EAAId,MAAM,CAAEgB,EAAIC,EAAKD,IAAK,CAC9C,IAAMxB,EAAOsB,CAAG,CAACE,EAAE,CACbE,EAAW1B,CAAI,CAACkB,EAASzC,OAAO,CAAC,AAEvC8C,CAAAA,CAAK,CAACvB,CAAI,CAACkB,EAAS7C,KAAK,CAAC,CAAE,CAAG2B,EAC3BC,MAAMC,OAAO,CAACwB,IAChB3C,OAAOC,MAAM,CAACuC,EAAOF,EAAMK,EAA0BR,IAEvD,IAAMS,EAAY3B,CAAI,CAACkB,EAASU,QAAQ,CAAC,AAEzCL,CAAAA,CAAK,CAACvB,CAAI,CAACkB,EAAS7C,KAAK,CAAC,CAAE,CAAG2B,EAC3BC,MAAMC,OAAO,CAACyB,IAChB5C,OAAOC,MAAM,CAACuC,EAAOF,EAAMM,EAA2BT,GAE1D,CACA,OAAOK,CACT,EAQgBJ,EAAMD,GACpB,EACF,GA2EAF,GAAAA,cAAY,EAAC,KACXC,GAAAA,OAAK,EAAC,KACAlD,EAAMG,IAAI,GAAK2B,GAAAA,SAAO,EAAC3B,IAASH,AAAe,KAAK,IAApBA,EAAMG,IAAI,EAC5CC,EAAQJ,EAAMG,IAAI,EAEhBH,AAAgB,KAAK,IAArBA,EAAMM,KAAK,EAAeN,AAAgB,OAAhBA,EAAMM,KAAK,CACvCC,EAAS2B,MAAMC,OAAO,CAACnC,EAAMM,KAAK,EAAIN,EAAMM,KAAK,CAAG,CAACN,EAAMM,KAAK,CAAC,EAEjEC,EAAS,EAAE,CAEf,EACF,GACAuD,GAAAA,SAAO,EAAC,KACN,GAAI9D,AAAgB,KAAK,IAArBA,EAAMM,KAAK,CAAa,CAC1B,IAAM0B,EAAM/B,EAAM8D,YAAY,CAE9BxD,EAASyB,EAAOE,MAAMC,OAAO,CAACH,GAAOA,EAAM,CAACA,EAAI,CAAI,EAAE,CACxD,CACF,GACAiB,GAAAA,cAAY,EAAC,KACPjD,EAAMgE,KAAK,EACbvD,EAAK,CAAC,aAAa,EAAEV,GAASkE,YAAc,EAAE,KAAK,CAAC,CAExD,GACA,IAAMC,EAASnD,GAAAA,YAAU,EAAC,IACxBO,GAAAA,SAAU,EAACtB,EAAMmE,UAAU,EAAKnE,EAAMmE,UAAU,GAAqBnE,EAAMmE,UAAU,EAEjFH,EAAQjD,GAAAA,YAAU,EAAC,IACvBO,GAAAA,SAAU,EAACtB,EAAMgE,KAAK,EAAKhE,EAAMgE,KAAK,GAAqBhE,EAAMgE,KAAK,EAElEI,EAASrD,GAAAA,YAAU,EAAC,IACxBO,GAAAA,SAAU,EAACtB,EAAMqE,UAAU,EAAKrE,EAAMqE,UAAU,GAAqBrE,EAAMqE,UAAU,EAGvF,4BACGC,SAAQ,qDAEFC,OAAK,CAAG/D,IAAOR,CAAAA,EAAMwE,GAAG,EAAI,EAAC,qCAE3B9D,wBACAJ,cACGyB,oBACJ5B,kBACQgB,GACVlB,8BAGGH,mBAckBC,wCATfiD,oCADCD,sCADEX,0CAHNtC,yCAQJ2E,MAAI,oBAAOP,mDACYA,gDAEvBO,MAAI,oBAAOT,mDACYA,gDAEqBxC,0CAAtBzB,yCACpB0E,MAAI,oBACGxE,EAAMqC,QAAQ,6CAEjBmC,MAAI,oBACGnE,IAAQmC,MAAM,6CAEjBgC,MAAI,oBAAOzE,EAAM0E,WAAW,oDACA1E,EAAM0E,WAAW,0DAU7C9D,GAAI,CAACN,GAAO,CAAC,EAAE,CAAC,EAAE,CAACQ,IAAakD,KAAK,CAAC,EAAI1D,GAAO,CAAC,EAAE,gDAH1C,CAAC,CAACH,uDAQlBwE,KAAG,oBACIrE,gDAEHmE,MAAI,oBAAOzE,EAAM0E,WAAW,oDACA1E,EAAM0E,WAAW,iBAI/C,AAAC7B,0DAUWD,EAAYgC,IAAI,CAAC,KAAM/B,kDAG/BjC,GAAI,CAACiC,EAAE,EAAE,CAAC/B,IAAakD,KAAK,CAAC,EAAInB,0BATvB,CAAC,CAAC1C,MAEPS,GAAI,CAACiC,EAAE,EAAEgC,MAAQ,YAChBjE,GAAI,CAACiC,EAAE,EAAEiC,QACVlE,GAAI,CAACiC,EAAE,EAAEkC,OACH,CAAC9E,EAAMoB,QAAQ,EAAI,CAACT,GAAI,CAACiC,EAAE,EAAExB,WAE/BpB,EAAMoB,QAAQ,EAAIT,GAAI,CAACiC,EAAE,EAAExB,kWAQ9CoD,MAAI,oBAAOL,mDACYA,qCA/DdnE,EAAMoB,QAAQ,CAAG,GAAK,IAIjBpB,EAAMoB,QAAQ,yJAgErC,CAmCA2D,GAAAA,eAAa,EACX,WACA,CACE,GAAGC,cAAY,CACfvE,QAAS,EAAE,CACXsD,MAAO,KAAK,EACZU,YAAa,MACbQ,yBAA0B,CAAA,EAC1Bf,WAAY,KAAK,EACjBE,WAAY,KAAK,CACnB,EACA,CAACc,EAAGC,KACF,IAAMC,EAAKD,EAAIE,OAAO,CAChBzF,EAAQ0F,GAAAA,YAAU,EACtB,CACExD,SAASM,CAAoB,CAAEJ,CAAgB,EAC7CoD,EAAGG,aAAa,CACd,IAAIC,YAAY,SAAU,CACxBC,OAAQ,CAACrD,EAAKJ,EAAK,AACrB,GAEJ,EACAV,aAAapB,CAAoB,EAC/BkF,EAAGG,aAAa,CACd,IAAIC,YAAY,aAAc,CAC5BC,OAAQvF,CACV,GAEJ,CACF,EACAgF,GAMF,MAHAlC,GAAAA,cAAY,EAAC,KACX0C,GAAAA,gBAAc,EAACN,EAAI,CAAC,UAAW,MAAO,aAAa,CACrD,yCAGwBO,QAAM,6BACzBhG,EAAWC,GAGlB,SAEF,EAAeD"}

package/lib/select/style.js

@@ -123,5 +123,4 @@
       opacity: 1;
     }
   }
-`;
-//# sourceMappingURL=style.js.map
+`;

package/lib/select/style.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/select/style.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const style = css`\n  .label {\n    position: absolute;\n    overflow: hidden;\n    border-radius: var(--border-radius);\n    padding: 0 4px;\n    text-overflow: ellipsis;\n    color: var(--text-secondary);\n    transition: transform var(--transition-duration);\n    line-height: inherit;\n    pointer-events: none;\n    transform-origin: left;\n    transform: translate3d(calc(var(--x, 0) - 14px), 0, 1px);\n    max-inline-size: 100%;\n    word-break: keep-all;\n  }\n\n  .value,\n  .placeholder {\n    max-inline-size: 100%;\n    padding: 0;\n    transition: var(--transition-duration) opacity;\n    pointer-events: none;\n    flex: 1;\n  }\n\n  .placeholder {\n    color: darkgray;\n    opacity: 0;\n  }\n\n  .prefix,\n  .suffix {\n    display: flex;\n    align-items: center;\n  }\n\n  .select {\n    position: relative;\n    display: flex;\n    flex-wrap: wrap;\n    border: 1px solid var(--border-color);\n    border-radius: var(--border-radius);\n    padding: 4px 10px;\n    font-size: var(--font-size);\n    color: var(--text-color);\n    background-color: var(--component-bg);\n    line-height: 1.5;\n    min-inline-size: 200px;\n    background-image: none;\n    box-sizing: border-box;\n    accent-color: var(--primary-color);\n    gap: 4px;\n    min-block-size: 28px;\n    cursor: pointer;\n    user-select: none;\n    transition: border-color var(--transition-duration) var(--transition-timing-function);\n\n    &:not(:has(.label)) {\n      & .placeholder {\n        opacity: 0.65;\n      }\n    }\n\n    &:has(.tag) {\n      &:not(:has(.prefix)) {\n        padding-inline-start: 4px;\n      }\n\n      &:not(:has(.suffix)) {\n        padding-inline-end: 4px;\n      }\n    }\n\n    &:hover:not([aria-disabled='true']) {\n      border-color: var(--primary-hover);\n      border-inline-end-width: 1px;\n    }\n\n    &:focus:not([aria-disabled='true']) {\n      border-color: var(--primary-hover);\n      border-inline-end-width: 1px;\n      outline: 0;\n      box-shadow: 0 0 0 2px var(--primary-outline);\n    }\n\n    &[aria-disabled='true'] {\n      border-color: var(--disable-border);\n      color: var(--disable-color);\n      background-color: var(--disable-bg);\n      cursor: not-allowed;\n    }\n\n    &:focus .label,\n    &:has(.label + .tags > .tag) .label,\n    &:has(.label + .tags > .value) .label {\n      line-height: 1;\n      background: var(--component-bg);\n      transform: translate3d(0, calc(-50% - 0.43em), 1px) scale(0.8);\n\n      & + .tags > .placeholder {\n        opacity: 0.65;\n      }\n    }\n  }\n\n  .value {\n    opacity: 1;\n  }\n\n  .tags {\n    flex: 1;\n    display: flex;\n    gap: 4px;\n    flex-wrap: wrap;\n  }\n\n  .opacity {\n    opacity: 0.5;\n    transition: opacity var(--transition-duration) var(--transition-timing-function);\n\n    &:hover {\n      opacity: 1;\n    }\n  }\n`;\n"],"names":["style","css"],"mappings":"kGAEaA,6CAAAA,qBAFO,eAEPA,EAAQC,GAAAA,KAAG,CAAA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6HzB,CAAC"}
+{"version":3,"sources":["components/select/style.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const style = css`\n  .label {\n    position: absolute;\n    overflow: hidden;\n    border-radius: var(--border-radius);\n    padding: 0 4px;\n    text-overflow: ellipsis;\n    color: var(--text-secondary);\n    transition: transform var(--transition-duration);\n    line-height: inherit;\n    pointer-events: none;\n    transform-origin: left;\n    transform: translate3d(calc(var(--x, 0) - 14px), 0, 1px);\n    max-inline-size: 100%;\n    word-break: keep-all;\n  }\n\n  .value,\n  .placeholder {\n    max-inline-size: 100%;\n    padding: 0;\n    transition: var(--transition-duration) opacity;\n    pointer-events: none;\n    flex: 1;\n  }\n\n  .placeholder {\n    color: darkgray;\n    opacity: 0;\n  }\n\n  .prefix,\n  .suffix {\n    display: flex;\n    align-items: center;\n  }\n\n  .select {\n    position: relative;\n    display: flex;\n    flex-wrap: wrap;\n    border: 1px solid var(--border-color);\n    border-radius: var(--border-radius);\n    padding: 4px 10px;\n    font-size: var(--font-size);\n    color: var(--text-color);\n    background-color: var(--component-bg);\n    line-height: 1.5;\n    min-inline-size: 200px;\n    background-image: none;\n    box-sizing: border-box;\n    accent-color: var(--primary-color);\n    gap: 4px;\n    min-block-size: 28px;\n    cursor: pointer;\n    user-select: none;\n    transition: border-color var(--transition-duration) var(--transition-timing-function);\n\n    &:not(:has(.label)) {\n      & .placeholder {\n        opacity: 0.65;\n      }\n    }\n\n    &:has(.tag) {\n      &:not(:has(.prefix)) {\n        padding-inline-start: 4px;\n      }\n\n      &:not(:has(.suffix)) {\n        padding-inline-end: 4px;\n      }\n    }\n\n    &:hover:not([aria-disabled='true']) {\n      border-color: var(--primary-hover);\n      border-inline-end-width: 1px;\n    }\n\n    &:focus:not([aria-disabled='true']) {\n      border-color: var(--primary-hover);\n      border-inline-end-width: 1px;\n      outline: 0;\n      box-shadow: 0 0 0 2px var(--primary-outline);\n    }\n\n    &[aria-disabled='true'] {\n      border-color: var(--disable-border);\n      color: var(--disable-color);\n      background-color: var(--disable-bg);\n      cursor: not-allowed;\n    }\n\n    &:focus .label,\n    &:has(.label + .tags > .tag) .label,\n    &:has(.label + .tags > .value) .label {\n      line-height: 1;\n      background: var(--component-bg);\n      transform: translate3d(0, calc(-50% - 0.43em), 1px) scale(0.8);\n\n      & + .tags > .placeholder {\n        opacity: 0.65;\n      }\n    }\n  }\n\n  .value {\n    opacity: 1;\n  }\n\n  .tags {\n    flex: 1;\n    display: flex;\n    gap: 4px;\n    flex-wrap: wrap;\n  }\n\n  .opacity {\n    opacity: 0.5;\n    transition: opacity var(--transition-duration) var(--transition-timing-function);\n\n    &:hover {\n      opacity: 1;\n    }\n  }\n`;\n"],"names":["style","css"],"mappings":"kGAEaA,6CAAAA,qBAFO,eAEPA,EAAQC,GAAAA,KAAG,CAAA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6HzB,CAAC"}

package/lib/skeleton/index.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return v}});const e=require("solid-js/web"),t=require("solid-js"),r=require("@moneko/css"),n=require("solid-element"),i=require("../basic-config"),a=function(e,t){if(e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var r=o(void 0);if(r&&r.has(e))return r.get(e);var n={__proto__:null},i=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&Object.prototype.hasOwnProperty.call(e,a)){var s=i?Object.getOwnPropertyDescriptor(e,a):null;s&&(s.get||s.set)?Object.defineProperty(n,a,s):n[a]=e[a]}return n.default=e,r&&r.set(e,n),n}(require("../theme"));function o(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,r=new WeakMap;return(o=function(e){return e?r:t})(e)}const s=(0,e.template)("<style> "),l=(0,e.template)("<style>"),c=(0,e.template)('<div class="avatar">'),d=(0,e.template)('<div class="title">'),u=(0,e.template)('<div><div class="body"><div class="paragraph">'),f=(0,e.template)("<div>"),p=(0,r.css)`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return b}});const e=require("solid-js/web"),t=require("solid-js"),r=require("@moneko/css"),n=require("solid-element"),i=require("../basic-config"),a=s(require("../theme"));function o(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,r=new WeakMap;return(o=function(e){return e?r:t})(e)}function s(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var r=o(t);if(r&&r.has(e))return r.get(e);var n={__proto__:null},i=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&Object.prototype.hasOwnProperty.call(e,a)){var s=i?Object.getOwnPropertyDescriptor(e,a):null;s&&(s.get||s.set)?Object.defineProperty(n,a,s):n[a]=e[a]}return n.default=e,r&&r.set(e,n),n}const l=(0,e.template)("<style> "),c=(0,e.template)("<style>"),d=(0,e.template)('<div class="avatar">'),u=(0,e.template)('<div class="title">'),f=(0,e.template)('<div><div class="body"><div class="paragraph">'),p=(0,e.template)("<div>"),g=(0,r.css)`
   :host {
     display: block;
     inline-size: 100%;
@@ -68,27 +68,4 @@
       background-position-x: -20%;
     }
   }
-`;function g(n){let{baseStyle:i,isDark:o}=a.default,g=(0,t.createMemo)(()=>Array(n.rows).fill(0)),v=(0,t.createMemo)(()=>o()?(0,r.css)`
-        :host {
-          --skeleton-bg: rgb(255 255 255 / 6%);
-          --skeleton-bg-active: linear-gradient(
-              100deg,
-              rgb(255 255 255 / 5%) 40%,
-              rgb(255 255 255 / 15%) 50%,
-              rgb(255 255 255 / 5%) 60%
-            )
-            transparent 180%/200% 100%;
-        }
-      `:(0,r.css)`
-      :host {
-        --skeleton-bg: rgb(0 0 0 / 6%);
-        --skeleton-bg-active: linear-gradient(
-            100deg,
-            rgb(0 0 0 / 5%) 40%,
-            rgb(0 0 0 / 15%) 50%,
-            rgb(0 0 0 / 5%) 60%
-          )
-          transparent 180%/200% 100%;
-      }
-    `);return[(()=>{let t=s(),r=t.firstChild;return(0,e.effect)(()=>r.data=i()),t})(),(()=>{let t=s(),r=t.firstChild;return(0,e.effect)(()=>r.data=v()),t})(),(()=>{let e=l();return e.textContent=p,e})(),(0,e.createComponent)(t.Show,{get when(){return n.css},get children(){let t=s(),i=t.firstChild;return(0,e.effect)(()=>i.data=(0,r.css)(n.css)),t}}),(()=>{let i=u(),a=i.firstChild,o=a.firstChild;return(0,e.insert)(i,(0,e.createComponent)(t.Show,{get when(){return n.avatar},get children(){let t=c();return(0,e.effect)(()=>t.classList.toggle("active",!!n.active)),t}}),a),(0,e.insert)(a,(0,e.createComponent)(t.Show,{get when(){return n.title},get children(){let t=d();return(0,e.effect)(()=>t.classList.toggle("active",!!n.active)),t}}),o),(0,e.insert)(o,(0,e.createComponent)(t.For,{get each(){return g()},children:()=>(()=>{let t=f();return(0,e.effect)(()=>t.classList.toggle("active",!!n.active)),t})()})),(0,e.effect)(()=>(0,e.className)(i,(0,r.cx)("skeleton",n.class))),i})()]}(0,n.customElement)("n-skeleton",{rows:3,active:void 0,avatar:void 0,title:void 0,css:void 0,class:void 0},(r,n)=>{let o=n.element,s=(0,t.mergeProps)({rows:o.rows,active:o.active,avatar:o.avatar,title:o.title,css:o.css},r);return(0,t.createEffect)(()=>{(0,i.clearAttribute)(o,["css"])}),[(()=>{let e=l();return e.textContent=a.block,e})(),(0,e.createComponent)(g,s)]});const v=g;
-//# sourceMappingURL=index.js.map
+`;function v(n){let{baseStyle:i,isDark:o}=a.default,s=(0,t.createMemo)(()=>Array(n.rows).fill(0)),v=(0,t.createMemo)(()=>{let e=o();return(0,r.css)({":host":{"--skeleton-bg":e?"rgb(255 255 255 / 6%)":"rgb(0 0 0 / 6%)","--skeleton-bg-active":e?"linear-gradient(100deg,rgb(255 255 255 / 5%) 40%,rgb(255 255 255 / 15%) 50%,rgb(255 255 255 / 5%) 60%) transparent 180%/200% 100%":"linear-gradient(100deg,rgb(0 0 0 / 5%) 40%,rgb(0 0 0 / 15%) 50%,rgb(0 0 0 / 5%) 60%) transparent 180%/200% 100%"}})});return[(()=>{let t=l(),r=t.firstChild;return(0,e.effect)(()=>r.data=i()),t})(),(()=>{let t=l(),r=t.firstChild;return(0,e.effect)(()=>r.data=v()),t})(),(()=>{let e=c();return e.textContent=g,e})(),(0,e.createComponent)(t.Show,{get when(){return n.css},get children(){let t=l(),i=t.firstChild;return(0,e.effect)(()=>i.data=(0,r.css)(n.css)),t}}),(()=>{let i=f(),a=i.firstChild,o=a.firstChild;return(0,e.insert)(i,(0,e.createComponent)(t.Show,{get when(){return n.avatar},get children(){let t=d();return(0,e.effect)(()=>t.classList.toggle("active",!!n.active)),t}}),a),(0,e.insert)(a,(0,e.createComponent)(t.Show,{get when(){return n.title},get children(){let t=u();return(0,e.effect)(()=>t.classList.toggle("active",!!n.active)),t}}),o),(0,e.insert)(o,(0,e.createComponent)(t.For,{get each(){return s()},children:()=>(()=>{let t=p();return(0,e.effect)(()=>t.classList.toggle("active",!!n.active)),t})()})),(0,e.effect)(()=>(0,e.className)(i,(0,r.cx)("skeleton",n.class))),i})()]}(0,n.customElement)("n-skeleton",{rows:3,active:void 0,avatar:void 0,title:void 0,css:void 0,class:void 0},(r,n)=>{let o=n.element,s=(0,t.mergeProps)({rows:o.rows,active:o.active,avatar:o.avatar,title:o.title,css:o.css},r);return(0,t.createEffect)(()=>{(0,i.clearAttribute)(o,["css"])}),[(()=>{let e=c();return e.textContent=a.block,e})(),(0,e.createComponent)(v,s)]});const b=v;

package/lib/skeleton/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/skeleton/index.tsx"],"sourcesContent":["import { createEffect, createMemo, For, mergeProps, Show } from 'solid-js';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport { clearAttribute } from '../basic-config';\nimport theme, { block } from '../theme';\n\nconst style = css`\n  :host {\n    display: block;\n    inline-size: 100%;\n  }\n\n  .skeleton {\n    display: flex;\n    inline-size: 100%;\n    gap: 16px;\n  }\n\n  .avatar,\n  .title,\n  .paragraph > div {\n    overflow: hidden;\n    border-radius: var(--border-radius);\n    background: var(--skeleton-bg);\n    transition: background-color var(--transition-duration) var(--transition-timing-function);\n  }\n\n  .avatar {\n    border-radius: 50%;\n    inline-size: 32px;\n    block-size: 32px;\n  }\n\n  .body {\n    flex: 1;\n  }\n\n  .title {\n    margin-block-end: 16px;\n    inline-size: 32%;\n    block-size: 32px;\n  }\n\n  .paragraph {\n    display: flex;\n    padding: 0;\n    flex-direction: column;\n    gap: 12px;\n\n    & > div {\n      inline-size: 100%;\n      block-size: 16px;\n      list-style: none;\n\n      &:last-of-type {\n        inline-size: 65%;\n      }\n    }\n  }\n\n  .active {\n    &::after {\n      display: block;\n      block-size: 100%;\n      animation: skeleton-effect 1.4s var(--transition-timing-function) infinite;\n      background: var(--skeleton-bg-active);\n      content: '';\n      transition: background-color var(--transition-duration) var(--transition-timing-function);\n    }\n  }\n\n  @keyframes skeleton-effect {\n    to {\n      background-position-x: -20%;\n    }\n  }\n`;\n\nexport interface SkeletonProps {\n  /** 自定义样式表 */\n  css?: string;\n  /** 自定义类名 */\n  class?: string;\n  /** 行\n   * @default 3\n   */\n  rows?: number;\n  /** 显示动画\n   * @default false\n   */\n  active?: boolean;\n  /** 显示头像\n   * @default false\n   */\n  avatar?: boolean;\n  /** 显示标题\n   * @default false\n   */\n  title?: boolean;\n}\n\nfunction Skeleton(props: SkeletonProps) {\n  const { baseStyle, isDark } = theme;\n  const rows = createMemo(() => Array(props.rows).fill(0));\n  const cssVar = createMemo(() => {\n    if (isDark()) {\n      return css`\n        :host {\n          --skeleton-bg: rgb(255 255 255 / 6%);\n          --skeleton-bg-active: linear-gradient(\n              100deg,\n              rgb(255 255 255 / 5%) 40%,\n              rgb(255 255 255 / 15%) 50%,\n              rgb(255 255 255 / 5%) 60%\n            )\n            transparent 180%/200% 100%;\n        }\n      `;\n    }\n\n    return css`\n      :host {\n        --skeleton-bg: rgb(0 0 0 / 6%);\n        --skeleton-bg-active: linear-gradient(\n            100deg,\n            rgb(0 0 0 / 5%) 40%,\n            rgb(0 0 0 / 15%) 50%,\n            rgb(0 0 0 / 5%) 60%\n          )\n          transparent 180%/200% 100%;\n      }\n    `;\n  });\n\n  return (\n    <>\n      <style textContent={baseStyle()} />\n      <style textContent={cssVar()} />\n      <style textContent={style} />\n      <Show when={props.css}>\n        <style textContent={css(props.css)} />\n      </Show>\n      <div class={cx('skeleton', props.class)}>\n        <Show when={props.avatar}>\n          <div\n            class=\"avatar\"\n            classList={{\n              active: props.active,\n            }}\n          />\n        </Show>\n        <div class=\"body\">\n          <Show when={props.title}>\n            <div\n              class=\"title\"\n              classList={{\n                active: props.active,\n              }}\n            />\n          </Show>\n          <div class=\"paragraph\">\n            <For each={rows()}>\n              {() => (\n                <div\n                  classList={{\n                    active: props.active,\n                  }}\n                />\n              )}\n            </For>\n          </div>\n        </div>\n      </div>\n    </>\n  );\n}\n\nexport type SkeletonElement = CustomElement<SkeletonProps>;\ncustomElement<SkeletonProps>(\n  'n-skeleton',\n  {\n    rows: 3,\n    active: void 0,\n    avatar: void 0,\n    title: void 0,\n    css: void 0,\n    class: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        rows: el.rows,\n        active: el.active,\n        avatar: el.avatar,\n        title: el.title,\n        css: el.css,\n      },\n      _,\n    );\n\n    createEffect(() => {\n      clearAttribute(el, ['css']);\n    });\n    return (\n      <>\n        <style textContent={block} />\n        <Skeleton {...props} />\n      </>\n    );\n  },\n);\nexport default Skeleton;\n"],"names":["style","css","Skeleton","props","baseStyle","isDark","theme","rows","createMemo","Array","fill","cssVar","Show","avatar","active","title","For","cx","class","customElement","_","opt","el","element","mergeProps","createEffect","clearAttribute","block"],"mappings":"kGAsNA,+CAAA,+CAtNgE,sBACxC,yBACM,2BAGC,yeACF,yXAEvBA,EAAQC,GAAAA,KAAG,CAAA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsElB,CAAC,CAyBD,SAASC,EAASC,CAAoB,EACpC,GAAM,CAAEC,UAAAA,CAAS,CAAEC,OAAAA,CAAM,CAAE,CAAGC,SAAK,CAC7BC,EAAOC,GAAAA,YAAU,EAAC,IAAMC,MAAMN,EAAMI,IAAI,EAAEG,IAAI,CAAC,IAC/CC,EAASH,GAAAA,YAAU,EAAC,IACxB,AAAIH,IACKJ,GAAAA,KAAG,CAAA,CAAC;;;;;;;;;;;MAWX,CAAC,CAGIA,GAAAA,KAAG,CAAA,CAAC;;;;;;;;;;;IAWX,CAAC,EAGH,oEAEwBG,wEACAO,gDACAX,8BACnBY,MAAI,oBAAOT,EAAMF,GAAG,wEACCA,GAAAA,KAAG,EAACE,EAAMF,GAAG,iGAGhCW,MAAI,oBAAOT,EAAMU,MAAM,gFAIVV,EAAMW,MAAM,gDAKvBF,MAAI,oBAAOT,EAAMY,KAAK,gFAITZ,EAAMW,MAAM,gDAKvBE,KAAG,oBAAOT,cACR,yEAGaJ,EAAMW,MAAM,+CAvBtBG,GAAAA,IAAE,EAAC,WAAYd,EAAMe,KAAK,UAiC5C,CAGAC,GAAAA,eAAa,EACX,aACA,CACEZ,KAAM,EACNO,OAAQ,KAAK,EACbD,OAAQ,KAAK,EACbE,MAAO,KAAK,EACZd,IAAK,KAAK,EACViB,MAAO,KAAK,CACd,EACA,CAACE,EAAGC,KACF,IAAMC,EAAKD,EAAIE,OAAO,CAChBpB,EAAQqB,GAAAA,YAAU,EACtB,CACEjB,KAAMe,EAAGf,IAAI,CACbO,OAAQQ,EAAGR,MAAM,CACjBD,OAAQS,EAAGT,MAAM,CACjBE,MAAOO,EAAGP,KAAK,CACfd,IAAKqB,EAAGrB,GAAG,AACb,EACAmB,GAMF,MAHAK,GAAAA,cAAY,EAAC,KACXC,GAAAA,gBAAc,EAACJ,EAAI,CAAC,MAAM,CAC5B,yCAGwBK,OAAK,6BACxBzB,EAAaC,GAGpB,SAEF,EAAeD"}
+{"version":3,"sources":["components/skeleton/index.tsx"],"sourcesContent":["import { createEffect, createMemo, For, mergeProps, Show } from 'solid-js';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport { clearAttribute } from '../basic-config';\nimport theme, { block } from '../theme';\n\nconst style = css`\n  :host {\n    display: block;\n    inline-size: 100%;\n  }\n\n  .skeleton {\n    display: flex;\n    inline-size: 100%;\n    gap: 16px;\n  }\n\n  .avatar,\n  .title,\n  .paragraph > div {\n    overflow: hidden;\n    border-radius: var(--border-radius);\n    background: var(--skeleton-bg);\n    transition: background-color var(--transition-duration) var(--transition-timing-function);\n  }\n\n  .avatar {\n    border-radius: 50%;\n    inline-size: 32px;\n    block-size: 32px;\n  }\n\n  .body {\n    flex: 1;\n  }\n\n  .title {\n    margin-block-end: 16px;\n    inline-size: 32%;\n    block-size: 32px;\n  }\n\n  .paragraph {\n    display: flex;\n    padding: 0;\n    flex-direction: column;\n    gap: 12px;\n\n    & > div {\n      inline-size: 100%;\n      block-size: 16px;\n      list-style: none;\n\n      &:last-of-type {\n        inline-size: 65%;\n      }\n    }\n  }\n\n  .active {\n    &::after {\n      display: block;\n      block-size: 100%;\n      animation: skeleton-effect 1.4s var(--transition-timing-function) infinite;\n      background: var(--skeleton-bg-active);\n      content: '';\n      transition: background-color var(--transition-duration) var(--transition-timing-function);\n    }\n  }\n\n  @keyframes skeleton-effect {\n    to {\n      background-position-x: -20%;\n    }\n  }\n`;\n\nexport interface SkeletonProps {\n  /** 自定义样式表 */\n  css?: string;\n  /** 自定义类名 */\n  class?: string;\n  /** 行\n   * @default 3\n   */\n  rows?: number;\n  /** 显示动画\n   * @default false\n   */\n  active?: boolean;\n  /** 显示头像\n   * @default false\n   */\n  avatar?: boolean;\n  /** 显示标题\n   * @default false\n   */\n  title?: boolean;\n}\n\nfunction Skeleton(props: SkeletonProps) {\n  const { baseStyle, isDark } = theme;\n  const rows = createMemo(() => Array(props.rows).fill(0));\n  const cssVar = createMemo(() => {\n    const dark = isDark();\n\n    return css({\n      ':host': {\n        '--skeleton-bg': dark ? 'rgb(255 255 255 / 6%)' : 'rgb(0 0 0 / 6%)',\n        '--skeleton-bg-active': dark\n          ? `linear-gradient(100deg,rgb(255 255 255 / 5%) 40%,rgb(255 255 255 / 15%) 50%,rgb(255 255 255 / 5%) 60%) transparent 180%/200% 100%`\n          : `linear-gradient(100deg,rgb(0 0 0 / 5%) 40%,rgb(0 0 0 / 15%) 50%,rgb(0 0 0 / 5%) 60%) transparent 180%/200% 100%`,\n      },\n    });\n  });\n\n  return (\n    <>\n      <style textContent={baseStyle()} />\n      <style textContent={cssVar()} />\n      <style textContent={style} />\n      <Show when={props.css}>\n        <style textContent={css(props.css)} />\n      </Show>\n      <div class={cx('skeleton', props.class)}>\n        <Show when={props.avatar}>\n          <div\n            class=\"avatar\"\n            classList={{\n              active: props.active,\n            }}\n          />\n        </Show>\n        <div class=\"body\">\n          <Show when={props.title}>\n            <div\n              class=\"title\"\n              classList={{\n                active: props.active,\n              }}\n            />\n          </Show>\n          <div class=\"paragraph\">\n            <For each={rows()}>\n              {() => (\n                <div\n                  classList={{\n                    active: props.active,\n                  }}\n                />\n              )}\n            </For>\n          </div>\n        </div>\n      </div>\n    </>\n  );\n}\n\nexport type SkeletonElement = CustomElement<SkeletonProps>;\ncustomElement<SkeletonProps>(\n  'n-skeleton',\n  {\n    rows: 3,\n    active: void 0,\n    avatar: void 0,\n    title: void 0,\n    css: void 0,\n    class: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        rows: el.rows,\n        active: el.active,\n        avatar: el.avatar,\n        title: el.title,\n        css: el.css,\n      },\n      _,\n    );\n\n    createEffect(() => {\n      clearAttribute(el, ['css']);\n    });\n    return (\n      <>\n        <style textContent={block} />\n        <Skeleton {...props} />\n      </>\n    );\n  },\n);\nexport default Skeleton;\n"],"names":["style","css","Skeleton","props","baseStyle","isDark","theme","rows","createMemo","Array","fill","cssVar","dark","Show","avatar","active","title","For","cx","class","customElement","_","opt","el","element","mergeProps","createEffect","clearAttribute","block"],"mappings":"kGAqMA,+CAAA,+CArMgE,sBACxC,yBACM,2BAGC,+BACF,q0BAEvBA,EAAQC,GAAAA,KAAG,CAAA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsElB,CAAC,CAyBD,SAASC,EAASC,CAAoB,EACpC,GAAM,CAAEC,UAAAA,CAAS,CAAEC,OAAAA,CAAM,CAAE,CAAGC,SAAK,CAC7BC,EAAOC,GAAAA,YAAU,EAAC,IAAMC,MAAMN,EAAMI,IAAI,EAAEG,IAAI,CAAC,IAC/CC,EAASH,GAAAA,YAAU,EAAC,KACxB,IAAMI,EAAOP,IAEb,MAAOJ,GAAAA,KAAG,EAAC,CACT,QAAS,CACP,gBAAiBW,EAAO,wBAA0B,kBAClD,uBAAwBA,EACpB,oIACA,iHACN,CACF,EACF,GAEA,oEAEwBR,wEACAO,gDACAX,8BACnBa,MAAI,oBAAOV,EAAMF,GAAG,wEACCA,GAAAA,KAAG,EAACE,EAAMF,GAAG,iGAGhCY,MAAI,oBAAOV,EAAMW,MAAM,gFAIVX,EAAMY,MAAM,gDAKvBF,MAAI,oBAAOV,EAAMa,KAAK,gFAITb,EAAMY,MAAM,gDAKvBE,KAAG,oBAAOV,cACR,yEAGaJ,EAAMY,MAAM,+CAvBtBG,GAAAA,IAAE,EAAC,WAAYf,EAAMgB,KAAK,UAiC5C,CAGAC,GAAAA,eAAa,EACX,aACA,CACEb,KAAM,EACNQ,OAAQ,KAAK,EACbD,OAAQ,KAAK,EACbE,MAAO,KAAK,EACZf,IAAK,KAAK,EACVkB,MAAO,KAAK,CACd,EACA,CAACE,EAAGC,KACF,IAAMC,EAAKD,EAAIE,OAAO,CAChBrB,EAAQsB,GAAAA,YAAU,EACtB,CACElB,KAAMgB,EAAGhB,IAAI,CACbQ,OAAQQ,EAAGR,MAAM,CACjBD,OAAQS,EAAGT,MAAM,CACjBE,MAAOO,EAAGP,KAAK,CACff,IAAKsB,EAAGtB,GAAG,AACb,EACAoB,GAMF,MAHAK,GAAAA,cAAY,EAAC,KACXC,GAAAA,gBAAc,EAACJ,EAAI,CAAC,MAAM,CAC5B,yCAGwBK,OAAK,6BACxB1B,EAAaC,GAGpB,SAEF,EAAeD"}

package/lib/spin/index.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return d}});const e=require("solid-js/web"),t=require("solid-js"),n=require("@moneko/css"),r=require("solid-element"),i=require("../basic-config"),o=function(e,t){if(e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=s(void 0);if(n&&n.has(e))return n.get(e);var r={__proto__:null},i=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var o in e)if("default"!==o&&Object.prototype.hasOwnProperty.call(e,o)){var l=i?Object.getOwnPropertyDescriptor(e,o):null;l&&(l.get||l.set)?Object.defineProperty(r,o,l):r[o]=e[o]}return r.default=e,n&&n.set(e,r),r}(require("../theme"));function s(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(s=function(e){return e?n:t})(e)}const l=(0,e.template)("<style> "),c=(0,e.template)("<style>"),a=(0,e.template)('<div><div class="content">'),u=(0,n.css)`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return d}});const e=require("solid-js/web"),t=require("solid-js"),n=require("@moneko/css"),r=require("solid-element"),i=require("../basic-config"),o=l(require("../theme"));function s(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(s=function(e){return e?n:t})(e)}function l(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=s(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},i=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var o in e)if("default"!==o&&Object.prototype.hasOwnProperty.call(e,o)){var l=i?Object.getOwnPropertyDescriptor(e,o):null;l&&(l.get||l.set)?Object.defineProperty(r,o,l):r[o]=e[o]}return r.default=e,n&&n.set(e,r),r}const c=(0,e.template)("<style> "),a=(0,e.template)("<style>"),u=(0,e.template)('<div><div class="content">'),p=(0,n.css)`
   :host {
     display: inline-block;
     box-sizing: border-box;
@@ -61,5 +61,4 @@
       transform: rotate(360deg);
     }
   }
-`;function p(r){let{baseStyle:i}=o.default;return[(()=>{let t=l(),n=t.firstChild;return(0,e.effect)(()=>n.data=i()),t})(),(()=>{let e=c();return e.textContent=u,e})(),(0,e.createComponent)(t.Show,{get when(){return r.css},get children(){let t=l(),i=t.firstChild;return(0,e.effect)(()=>i.data=(0,n.css)(r.css)),t}}),(()=>{let t=a(),i=t.firstChild;return(0,e.insert)(i,()=>r.children),(0,e.effect)(i=>{let o=(0,n.cx)("spin",r.class),s=!!r.spin;return o!==i._v$&&(0,e.className)(t,i._v$=o),s!==i._v$2&&t.classList.toggle("spining",i._v$2=s),i},{_v$:void 0,_v$2:void 0}),t})()]}(0,r.customElement)("n-spin",{class:void 0,css:void 0,spin:void 0,children:void 0},(n,r)=>{let s=r.element,l=[...(r.element.childNodes||[]).values()],[,a]=(0,t.splitProps)(n,["children"]);return(0,t.createEffect)(()=>{(0,i.clearAttribute)(s,["css"]),s.replaceChildren()}),[(()=>{let e=c();return e.textContent=o.inline,e})(),(0,e.createComponent)(p,(0,e.mergeProps)(a,{children:l}))]});const d=p;
-//# sourceMappingURL=index.js.map
+`;function f(r){let{baseStyle:i}=o.default;return[(()=>{let t=c(),n=t.firstChild;return(0,e.effect)(()=>n.data=i()),t})(),(()=>{let e=a();return e.textContent=p,e})(),(0,e.createComponent)(t.Show,{get when(){return r.css},get children(){let t=c(),i=t.firstChild;return(0,e.effect)(()=>i.data=(0,n.css)(r.css)),t}}),(()=>{let t=u(),i=t.firstChild;return(0,e.insert)(i,()=>r.children),(0,e.effect)(i=>{let o=(0,n.cx)("spin",r.class),s=!!r.spin;return o!==i._v$&&(0,e.className)(t,i._v$=o),s!==i._v$2&&t.classList.toggle("spining",i._v$2=s),i},{_v$:void 0,_v$2:void 0}),t})()]}(0,r.customElement)("n-spin",{class:void 0,css:void 0,spin:void 0,children:void 0},(n,r)=>{let s=r.element,l=[...(r.element.childNodes||[]).values()],[,c]=(0,t.splitProps)(n,["children"]);return(0,t.createEffect)(()=>{(0,i.clearAttribute)(s,["css"]),s.replaceChildren()}),[(()=>{let e=a();return e.textContent=o.inline,e})(),(0,e.createComponent)(f,(0,e.mergeProps)(c,{children:l}))]});const d=f;

package/lib/spin/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/spin/index.tsx"],"sourcesContent":["import { createEffect, Show, splitProps } from 'solid-js';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport { clearAttribute } from '../basic-config';\nimport theme, { inline } from '../theme';\n\nconst style = css`\n  :host {\n    display: inline-block;\n    box-sizing: border-box;\n  }\n\n  .spin {\n    inline-size: fit-content;\n    inline-size: 100%;\n    block-size: 100%;\n    min-inline-size: 16px;\n    min-block-size: 16px;\n    position: relative;\n    box-sizing: border-box;\n  }\n\n  .content {\n    display: flex;\n    opacity: 1;\n    transition: opacity var(--transition-duration);\n  }\n\n  .spining {\n    cursor: not-allowed;\n\n    .content {\n      opacity: 0.3;\n      pointer-events: none;\n      user-select: none;\n      filter: blur(4px);\n    }\n\n    &::before {\n      position: absolute;\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      margin: auto;\n      border: 1px solid;\n      border-color: var(--text-secondary) transparent;\n      border-radius: 50%;\n      font-size: large;\n      text-align: center;\n      inline-size: 16px;\n      block-size: 16px;\n      inset-block: 0;\n      inset-inline: 0;\n      box-sizing: border-box;\n      line-height: 1;\n      content: '';\n      animation: spin-rotate-effect 1s infinite;\n    }\n  }\n\n  @keyframes spin-rotate-effect {\n    0% {\n      transform: rotate(0deg);\n    }\n\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n`;\n\nexport interface SpinProps {\n  /** 自定义样式表 */\n  css?: string;\n  /** 自定义类名 */\n  class?: string;\n  /** 加载状态 */\n  spin?: boolean;\n  /** 内容 */\n  children?: JSX.Element | JSX.Element[];\n}\n\nfunction Spin(props: SpinProps) {\n  const { baseStyle } = theme;\n\n  return (\n    <>\n      <style textContent={baseStyle()} />\n      <style textContent={style} />\n      <Show when={props.css}>\n        <style textContent={css(props.css)} />\n      </Show>\n      <div\n        class={cx('spin', props.class)}\n        classList={{\n          spining: props.spin,\n        }}\n      >\n        <div class=\"content\">{props.children}</div>\n      </div>\n    </>\n  );\n}\n\nexport type SpinElement = CustomElement<SpinProps>;\n\ncustomElement<SpinProps>(\n  'n-spin',\n  { class: void 0, css: void 0, spin: void 0, children: void 0 },\n  (_, opt) => {\n    const el = opt.element;\n    const childNodes = (opt.element.childNodes as NodeList) || [];\n    const nodes = [...childNodes.values()];\n    const [, props] = splitProps(_, ['children']);\n\n    createEffect(() => {\n      clearAttribute(el, ['css']);\n      el.replaceChildren();\n    });\n    return (\n      <>\n        <style textContent={inline} />\n        <Spin {...props}>{nodes}</Spin>\n      </>\n    );\n  },\n);\n\nexport default Spin;\n"],"names":["style","css","Spin","props","baseStyle","theme","Show","children","cx","class","spin","customElement","_","opt","el","element","nodes","childNodes","values","splitProps","createEffect","clearAttribute","replaceChildren","inline"],"mappings":"kGAkIA,+CAAA,+CAlI+C,sBACvB,yBACM,2BAGC,yeACD,0PAExBA,EAAQC,GAAAA,KAAG,CAAA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+DlB,CAAC,CAaD,SAASC,EAAKC,CAAgB,EAC5B,GAAM,CAAEC,UAAAA,CAAS,CAAE,CAAGC,SAAK,CAE3B,oEAEwBD,gDACAJ,8BACnBM,MAAI,oBAAOH,EAAMF,GAAG,wEACCA,GAAAA,KAAG,EAACE,EAAMF,GAAG,gEAQXE,EAAMI,QAAQ,yBAL7BC,GAAAA,IAAE,EAAC,OAAQL,EAAMM,KAAK,MAElBN,EAAMO,IAAI,oIAO7B,CAIAC,GAAAA,eAAa,EACX,SACA,CAAEF,MAAO,KAAK,EAAGR,IAAK,KAAK,EAAGS,KAAM,KAAK,EAAGH,SAAU,KAAK,CAAE,EAC7D,CAACK,EAAGC,KACF,IAAMC,EAAKD,EAAIE,OAAO,CAEhBC,EAAQ,IAAIC,AADC,CAAA,AAACJ,EAAIE,OAAO,CAACE,UAAU,EAAiB,EAAE,AAAD,EAC/BC,MAAM,GAAG,CAChC,EAAGf,EAAM,CAAGgB,GAAAA,YAAU,EAACP,EAAG,CAAC,WAAW,EAM5C,MAJAQ,GAAAA,cAAY,EAAC,KACXC,GAAAA,gBAAc,EAACP,EAAI,CAAC,MAAM,EAC1BA,EAAGQ,eAAe,EACpB,yCAGwBC,QAAM,6BACzBrB,mBAASC,YAAQa,KAGxB,SAGF,EAAed"}
+{"version":3,"sources":["components/spin/index.tsx"],"sourcesContent":["import { createEffect, Show, splitProps } from 'solid-js';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport { clearAttribute } from '../basic-config';\nimport theme, { inline } from '../theme';\n\nconst style = css`\n  :host {\n    display: inline-block;\n    box-sizing: border-box;\n  }\n\n  .spin {\n    inline-size: fit-content;\n    inline-size: 100%;\n    block-size: 100%;\n    min-inline-size: 16px;\n    min-block-size: 16px;\n    position: relative;\n    box-sizing: border-box;\n  }\n\n  .content {\n    display: flex;\n    opacity: 1;\n    transition: opacity var(--transition-duration);\n  }\n\n  .spining {\n    cursor: not-allowed;\n\n    .content {\n      opacity: 0.3;\n      pointer-events: none;\n      user-select: none;\n      filter: blur(4px);\n    }\n\n    &::before {\n      position: absolute;\n      display: flex;\n      justify-content: center;\n      align-items: center;\n      margin: auto;\n      border: 1px solid;\n      border-color: var(--text-secondary) transparent;\n      border-radius: 50%;\n      font-size: large;\n      text-align: center;\n      inline-size: 16px;\n      block-size: 16px;\n      inset-block: 0;\n      inset-inline: 0;\n      box-sizing: border-box;\n      line-height: 1;\n      content: '';\n      animation: spin-rotate-effect 1s infinite;\n    }\n  }\n\n  @keyframes spin-rotate-effect {\n    0% {\n      transform: rotate(0deg);\n    }\n\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n`;\n\nexport interface SpinProps {\n  /** 自定义样式表 */\n  css?: string;\n  /** 自定义类名 */\n  class?: string;\n  /** 加载状态 */\n  spin?: boolean;\n  /** 内容 */\n  children?: JSX.Element | JSX.Element[];\n}\n\nfunction Spin(props: SpinProps) {\n  const { baseStyle } = theme;\n\n  return (\n    <>\n      <style textContent={baseStyle()} />\n      <style textContent={style} />\n      <Show when={props.css}>\n        <style textContent={css(props.css)} />\n      </Show>\n      <div\n        class={cx('spin', props.class)}\n        classList={{\n          spining: props.spin,\n        }}\n      >\n        <div class=\"content\">{props.children}</div>\n      </div>\n    </>\n  );\n}\n\nexport type SpinElement = CustomElement<SpinProps>;\n\ncustomElement<SpinProps>(\n  'n-spin',\n  { class: void 0, css: void 0, spin: void 0, children: void 0 },\n  (_, opt) => {\n    const el = opt.element;\n    const childNodes = (opt.element.childNodes as NodeList) || [];\n    const nodes = [...childNodes.values()];\n    const [, props] = splitProps(_, ['children']);\n\n    createEffect(() => {\n      clearAttribute(el, ['css']);\n      el.replaceChildren();\n    });\n    return (\n      <>\n        <style textContent={inline} />\n        <Spin {...props}>{nodes}</Spin>\n      </>\n    );\n  },\n);\n\nexport default Spin;\n"],"names":["style","css","Spin","props","baseStyle","theme","Show","children","cx","class","spin","customElement","_","opt","el","element","nodes","childNodes","values","splitProps","createEffect","clearAttribute","replaceChildren","inline"],"mappings":"kGAkIA,+CAAA,+CAlI+C,sBACvB,yBACM,2BAGC,+BACD,ssBAExBA,EAAQC,GAAAA,KAAG,CAAA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+DlB,CAAC,CAaD,SAASC,EAAKC,CAAgB,EAC5B,GAAM,CAAEC,UAAAA,CAAS,CAAE,CAAGC,SAAK,CAE3B,oEAEwBD,gDACAJ,8BACnBM,MAAI,oBAAOH,EAAMF,GAAG,wEACCA,GAAAA,KAAG,EAACE,EAAMF,GAAG,gEAQXE,EAAMI,QAAQ,yBAL7BC,GAAAA,IAAE,EAAC,OAAQL,EAAMM,KAAK,MAElBN,EAAMO,IAAI,oIAO7B,CAIAC,GAAAA,eAAa,EACX,SACA,CAAEF,MAAO,KAAK,EAAGR,IAAK,KAAK,EAAGS,KAAM,KAAK,EAAGH,SAAU,KAAK,CAAE,EAC7D,CAACK,EAAGC,KACF,IAAMC,EAAKD,EAAIE,OAAO,CAEhBC,EAAQ,IAAIC,AADC,CAAA,AAACJ,EAAIE,OAAO,CAACE,UAAU,EAAiB,EAAE,AAAD,EAC/BC,MAAM,GAAG,CAChC,EAAGf,EAAM,CAAGgB,GAAAA,YAAU,EAACP,EAAG,CAAC,WAAW,EAM5C,MAJAQ,GAAAA,cAAY,EAAC,KACXC,GAAAA,gBAAc,EAACP,EAAI,CAAC,MAAM,EAC1BA,EAAGQ,eAAe,EACpB,yCAGwBC,QAAM,6BACzBrB,mBAASC,YAAQa,KAGxB,SAGF,EAAed"}

package/lib/switch/index.js

@@ -1,2 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return v}});const e=require("solid-js/web"),t=require("solid-js"),n=require("@moneko/css"),r=require("solid-element"),i=require("../basic-config"),c=function(e,t){if(e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=d(void 0);if(n&&n.has(e))return n.get(e);var r={__proto__:null},i=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var c in e)if("default"!==c&&Object.prototype.hasOwnProperty.call(e,c)){var o=i?Object.getOwnPropertyDescriptor(e,c):null;o&&(o.get||o.set)?Object.defineProperty(r,c,o):r[c]=e[c]}return r.default=e,n&&n.set(e,r),r}(require("../theme")),o=require("./style");function d(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(d=function(e){return e?n:t})(e)}const s=(0,e.template)("<style> "),l=(0,e.template)("<style>"),a=(0,e.template)("<span>");function u(r){let{baseStyle:i}=c.default,[d,u]=(0,t.createSignal)(!1);function v(){r.disabled||r.loading||(u(e=>!e),r.onChange?.(d()))}function f({key:e}){"Enter"===e&&v()}return(0,t.createEffect)(()=>{u(!!r.checked)}),[(()=>{let t=s(),n=t.firstChild;return(0,e.effect)(()=>n.data=i()),t})(),(()=>{let e=l();return e.textContent=o.style,e})(),(0,e.createComponent)(t.Show,{get when(){return r.css},get children(){let t=s(),i=t.firstChild;return(0,e.effect)(()=>i.data=(0,n.css)(r.css)),t}}),(()=>{let t=a();return(0,e.addEventListener)(t,"keyup",f,!0),(0,e.addEventListener)(t,"click",v,!0),(0,e.effect)(i=>{let c=(0,n.cx)("switch",r.class),o=!!d(),s=!!r.loading,l=r.checkedText,a=r.unCheckedText,u=r.disabled,v=r.disabled||r.loading?-1:0;return c!==i._v$&&(0,e.className)(t,i._v$=c),o!==i._v$2&&t.classList.toggle("checked",i._v$2=o),s!==i._v$3&&t.classList.toggle("loading",i._v$3=s),l!==i._v$4&&(0,e.setAttribute)(t,"text-on",i._v$4=l),a!==i._v$5&&(0,e.setAttribute)(t,"text-off",i._v$5=a),u!==i._v$6&&(0,e.setAttribute)(t,"aria-disabled",i._v$6=u),v!==i._v$7&&(0,e.setAttribute)(t,"tabindex",i._v$7=v),i},{_v$:void 0,_v$2:void 0,_v$3:void 0,_v$4:void 0,_v$5:void 0,_v$6:void 0,_v$7:void 0}),t})()]}(0,r.customElement)("n-switch",{class:void 0,css:void 0,checked:void 0,disabled:void 0,checkedText:void 0,unCheckedText:void 0,loading:!1,onChange:void 0},(n,r)=>{let o=r.element,d=(0,t.mergeProps)({css:o.css,checked:o.checked,disabled:o.disabled,checkedText:o.checkedText,unCheckedText:o.unCheckedText,loading:o.loading,onChange(e){o.dispatchEvent(new CustomEvent("change",{detail:e}))}},n);return(0,t.createEffect)(()=>{(0,i.clearAttribute)(o,["css"])}),[(()=>{let e=l();return e.textContent=c.inline,e})(),(0,e.createComponent)(u,d)]});const v=u;(0,e.delegateEvents)(["click","keyup"]);
-//# sourceMappingURL=index.js.map
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return f}});const e=require("solid-js/web"),t=require("solid-js"),n=require("@moneko/css"),r=require("solid-element"),i=require("../basic-config"),c=d(require("../theme")),o=require("./style");function s(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(s=function(e){return e?n:t})(e)}function d(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=s(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},i=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var c in e)if("default"!==c&&Object.prototype.hasOwnProperty.call(e,c)){var o=i?Object.getOwnPropertyDescriptor(e,c):null;o&&(o.get||o.set)?Object.defineProperty(r,c,o):r[c]=e[c]}return r.default=e,n&&n.set(e,r),r}const l=(0,e.template)("<style> "),a=(0,e.template)("<style>"),u=(0,e.template)("<span>");function v(r){let{baseStyle:i}=c.default,[s,d]=(0,t.createSignal)(!1);function v(){r.disabled||r.loading||(d(e=>!e),r.onChange?.(s()))}function f({key:e}){"Enter"===e&&v()}return(0,t.createEffect)(()=>{d(!!r.checked)}),[(()=>{let t=l(),n=t.firstChild;return(0,e.effect)(()=>n.data=i()),t})(),(()=>{let e=a();return e.textContent=o.style,e})(),(0,e.createComponent)(t.Show,{get when(){return r.css},get children(){let t=l(),i=t.firstChild;return(0,e.effect)(()=>i.data=(0,n.css)(r.css)),t}}),(()=>{let t=u();return(0,e.addEventListener)(t,"keyup",f,!0),(0,e.addEventListener)(t,"click",v,!0),(0,e.effect)(i=>{let c=(0,n.cx)("switch",r.class),o=!!s(),d=!!r.loading,l=r.checkedText,a=r.unCheckedText,u=r.disabled,v=r.disabled||r.loading?-1:0;return c!==i._v$&&(0,e.className)(t,i._v$=c),o!==i._v$2&&t.classList.toggle("checked",i._v$2=o),d!==i._v$3&&t.classList.toggle("loading",i._v$3=d),l!==i._v$4&&(0,e.setAttribute)(t,"text-on",i._v$4=l),a!==i._v$5&&(0,e.setAttribute)(t,"text-off",i._v$5=a),u!==i._v$6&&(0,e.setAttribute)(t,"aria-disabled",i._v$6=u),v!==i._v$7&&(0,e.setAttribute)(t,"tabindex",i._v$7=v),i},{_v$:void 0,_v$2:void 0,_v$3:void 0,_v$4:void 0,_v$5:void 0,_v$6:void 0,_v$7:void 0}),t})()]}(0,r.customElement)("n-switch",{class:void 0,css:void 0,checked:void 0,disabled:void 0,checkedText:void 0,unCheckedText:void 0,loading:!1,onChange:void 0},(n,r)=>{let o=r.element,s=(0,t.mergeProps)({css:o.css,checked:o.checked,disabled:o.disabled,checkedText:o.checkedText,unCheckedText:o.unCheckedText,loading:o.loading,onChange(e){o.dispatchEvent(new CustomEvent("change",{detail:e}))}},n);return(0,t.createEffect)(()=>{(0,i.clearAttribute)(o,["css"])}),[(()=>{let e=a();return e.textContent=c.inline,e})(),(0,e.createComponent)(v,s)]});const f=v;(0,e.delegateEvents)(["click","keyup"]);

package/lib/switch/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/switch/index.tsx"],"sourcesContent":["import { createEffect, createSignal, mergeProps, Show } from 'solid-js';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport { clearAttribute } from '../basic-config';\nimport theme, { inline } from '../theme';\n\nimport { style } from './style';\n\nexport interface SwitchProps {\n  /** 自定义类名 */\n  class?: string;\n  /** 自定义样式表 */\n  css?: string;\n  /** 值 */\n  checked?: boolean;\n  /** 只读 */\n  disabled?: boolean;\n  /** 设置 为 true 时的文案 */\n  checkedText?: string;\n  /** 设置 为 false 时的文案 */\n  unCheckedText?: string;\n  /** 加载状态 */\n  loading?: boolean;\n  /** 值修改时的回调方法 */\n  onChange?: (val: boolean) => void;\n}\n\nexport type SwitchElement = CustomElement<SwitchProps>;\n\nfunction Switch(props: SwitchProps) {\n  const { baseStyle } = theme;\n  const [value, setValue] = createSignal(false);\n\n  function change() {\n    if (!props.disabled && !props.loading) {\n      setValue((prev) => !prev);\n      props.onChange?.(value());\n    }\n  }\n\n  function onKeyUp({ key }: { key: string }) {\n    if (key === 'Enter') {\n      change();\n    }\n  }\n\n  createEffect(() => {\n    setValue(!!props.checked);\n  });\n\n  return (\n    <>\n      <style textContent={baseStyle()} />\n      <style textContent={style} />\n      <Show when={props.css}>\n        <style textContent={css(props.css)} />\n      </Show>\n      <span\n        class={cx('switch', props.class)}\n        classList={{\n          checked: value(),\n          loading: props.loading,\n        }}\n        text-on={props.checkedText}\n        text-off={props.unCheckedText}\n        aria-disabled={props.disabled}\n        onClick={change}\n        onKeyUp={onKeyUp}\n        tabindex={props.disabled || props.loading ? -1 : 0}\n      />\n    </>\n  );\n}\n\ncustomElement<SwitchProps>(\n  'n-switch',\n  {\n    class: void 0,\n    css: void 0,\n    checked: void 0,\n    disabled: void 0,\n    checkedText: void 0,\n    unCheckedText: void 0,\n    loading: false,\n    onChange: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        css: el.css,\n        checked: el.checked,\n        disabled: el.disabled,\n        checkedText: el.checkedText,\n        unCheckedText: el.unCheckedText,\n        loading: el.loading,\n        onChange(val: boolean) {\n          el.dispatchEvent(\n            new CustomEvent('change', {\n              detail: val,\n            }),\n          );\n        },\n      },\n      _,\n    );\n\n    createEffect(() => {\n      clearAttribute(el, ['css']);\n    });\n    return (\n      <>\n        <style textContent={inline} />\n        <Switch {...props} />\n      </>\n    );\n  },\n);\nexport default Switch;\n"],"names":["Switch","props","baseStyle","theme","value","setValue","createSignal","change","disabled","loading","prev","onChange","onKeyUp","key","createEffect","checked","style","Show","css","cx","class","checkedText","unCheckedText","customElement","_","opt","el","element","mergeProps","val","dispatchEvent","CustomEvent","detail","clearAttribute","inline"],"mappings":"kGAwHA,+CAAA,+CAxH6D,sBACrC,yBACM,2BAGC,yeACD,uBAER,oOAuBtB,SAASA,EAAOC,CAAkB,EAChC,GAAM,CAAEC,UAAAA,CAAS,CAAE,CAAGC,SAAK,CACrB,CAACC,EAAOC,EAAS,CAAGC,GAAAA,cAAY,EAAC,CAAA,GAEvC,SAASC,IACFN,EAAMO,QAAQ,EAAKP,EAAMQ,OAAO,GACnCJ,EAAS,AAACK,GAAS,CAACA,GACpBT,EAAMU,QAAQ,GAAGP,KAErB,CAEA,SAASQ,EAAQ,CAAEC,IAAAA,CAAG,CAAmB,EAC3B,UAARA,GACFN,GAEJ,CAMA,MAJAO,GAAAA,cAAY,EAAC,KACXT,EAAS,CAAC,CAACJ,EAAMc,OAAO,CAC1B,iEAIwBb,gDACAc,OAAK,6BACxBC,MAAI,oBAAOhB,EAAMiB,GAAG,wEACCA,GAAAA,KAAG,EAACjB,EAAMiB,GAAG,+DAYxBN,uCADAL,6BARFY,GAAAA,IAAE,EAAC,SAAUlB,EAAMmB,KAAK,MAEpBhB,QACAH,EAAMQ,OAAO,GAEfR,EAAMoB,WAAW,GAChBpB,EAAMqB,aAAa,GACdrB,EAAMO,QAAQ,GAGnBP,EAAMO,QAAQ,EAAIP,EAAMQ,OAAO,CAAG,GAAK,gdAIzD,CAEAc,GAAAA,eAAa,EACX,WACA,CACEH,MAAO,KAAK,EACZF,IAAK,KAAK,EACVH,QAAS,KAAK,EACdP,SAAU,KAAK,EACfa,YAAa,KAAK,EAClBC,cAAe,KAAK,EACpBb,QAAS,CAAA,EACTE,SAAU,KAAK,CACjB,EACA,CAACa,EAAGC,KACF,IAAMC,EAAKD,EAAIE,OAAO,CAChB1B,EAAQ2B,GAAAA,YAAU,EACtB,CACEV,IAAKQ,EAAGR,GAAG,CACXH,QAASW,EAAGX,OAAO,CACnBP,SAAUkB,EAAGlB,QAAQ,CACrBa,YAAaK,EAAGL,WAAW,CAC3BC,cAAeI,EAAGJ,aAAa,CAC/Bb,QAASiB,EAAGjB,OAAO,CACnBE,SAASkB,CAAY,EACnBH,EAAGI,aAAa,CACd,IAAIC,YAAY,SAAU,CACxBC,OAAQH,CACV,GAEJ,CACF,EACAL,GAMF,MAHAV,GAAAA,cAAY,EAAC,KACXmB,GAAAA,gBAAc,EAACP,EAAI,CAAC,MAAM,CAC5B,yCAGwBQ,QAAM,6BACzBlC,EAAWC,GAGlB,SAEF,EAAeD"}
+{"version":3,"sources":["components/switch/index.tsx"],"sourcesContent":["import { createEffect, createSignal, mergeProps, Show } from 'solid-js';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { CustomElement } from '..';\nimport { clearAttribute } from '../basic-config';\nimport theme, { inline } from '../theme';\n\nimport { style } from './style';\n\nexport interface SwitchProps {\n  /** 自定义类名 */\n  class?: string;\n  /** 自定义样式表 */\n  css?: string;\n  /** 值 */\n  checked?: boolean;\n  /** 只读 */\n  disabled?: boolean;\n  /** 设置 为 true 时的文案 */\n  checkedText?: string;\n  /** 设置 为 false 时的文案 */\n  unCheckedText?: string;\n  /** 加载状态 */\n  loading?: boolean;\n  /** 值修改时的回调方法 */\n  onChange?: (val: boolean) => void;\n}\n\nexport type SwitchElement = CustomElement<SwitchProps>;\n\nfunction Switch(props: SwitchProps) {\n  const { baseStyle } = theme;\n  const [value, setValue] = createSignal(false);\n\n  function change() {\n    if (!props.disabled && !props.loading) {\n      setValue((prev) => !prev);\n      props.onChange?.(value());\n    }\n  }\n\n  function onKeyUp({ key }: { key: string }) {\n    if (key === 'Enter') {\n      change();\n    }\n  }\n\n  createEffect(() => {\n    setValue(!!props.checked);\n  });\n\n  return (\n    <>\n      <style textContent={baseStyle()} />\n      <style textContent={style} />\n      <Show when={props.css}>\n        <style textContent={css(props.css)} />\n      </Show>\n      <span\n        class={cx('switch', props.class)}\n        classList={{\n          checked: value(),\n          loading: props.loading,\n        }}\n        text-on={props.checkedText}\n        text-off={props.unCheckedText}\n        aria-disabled={props.disabled}\n        onClick={change}\n        onKeyUp={onKeyUp}\n        tabindex={props.disabled || props.loading ? -1 : 0}\n      />\n    </>\n  );\n}\n\ncustomElement<SwitchProps>(\n  'n-switch',\n  {\n    class: void 0,\n    css: void 0,\n    checked: void 0,\n    disabled: void 0,\n    checkedText: void 0,\n    unCheckedText: void 0,\n    loading: false,\n    onChange: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        css: el.css,\n        checked: el.checked,\n        disabled: el.disabled,\n        checkedText: el.checkedText,\n        unCheckedText: el.unCheckedText,\n        loading: el.loading,\n        onChange(val: boolean) {\n          el.dispatchEvent(\n            new CustomEvent('change', {\n              detail: val,\n            }),\n          );\n        },\n      },\n      _,\n    );\n\n    createEffect(() => {\n      clearAttribute(el, ['css']);\n    });\n    return (\n      <>\n        <style textContent={inline} />\n        <Switch {...props} />\n      </>\n    );\n  },\n);\nexport default Switch;\n"],"names":["Switch","props","baseStyle","theme","value","setValue","createSignal","change","disabled","loading","prev","onChange","onKeyUp","key","createEffect","checked","style","Show","css","cx","class","checkedText","unCheckedText","customElement","_","opt","el","element","mergeProps","val","dispatchEvent","CustomEvent","detail","clearAttribute","inline"],"mappings":"kGAwHA,+CAAA,+CAxH6D,sBACrC,yBACM,2BAGC,+BACD,uBAER,grBAuBtB,SAASA,EAAOC,CAAkB,EAChC,GAAM,CAAEC,UAAAA,CAAS,CAAE,CAAGC,SAAK,CACrB,CAACC,EAAOC,EAAS,CAAGC,GAAAA,cAAY,EAAC,CAAA,GAEvC,SAASC,IACFN,EAAMO,QAAQ,EAAKP,EAAMQ,OAAO,GACnCJ,EAAS,AAACK,GAAS,CAACA,GACpBT,EAAMU,QAAQ,GAAGP,KAErB,CAEA,SAASQ,EAAQ,CAAEC,IAAAA,CAAG,CAAmB,EAC3B,UAARA,GACFN,GAEJ,CAMA,MAJAO,GAAAA,cAAY,EAAC,KACXT,EAAS,CAAC,CAACJ,EAAMc,OAAO,CAC1B,iEAIwBb,gDACAc,OAAK,6BACxBC,MAAI,oBAAOhB,EAAMiB,GAAG,wEACCA,GAAAA,KAAG,EAACjB,EAAMiB,GAAG,+DAYxBN,uCADAL,6BARFY,GAAAA,IAAE,EAAC,SAAUlB,EAAMmB,KAAK,MAEpBhB,QACAH,EAAMQ,OAAO,GAEfR,EAAMoB,WAAW,GAChBpB,EAAMqB,aAAa,GACdrB,EAAMO,QAAQ,GAGnBP,EAAMO,QAAQ,EAAIP,EAAMQ,OAAO,CAAG,GAAK,gdAIzD,CAEAc,GAAAA,eAAa,EACX,WACA,CACEH,MAAO,KAAK,EACZF,IAAK,KAAK,EACVH,QAAS,KAAK,EACdP,SAAU,KAAK,EACfa,YAAa,KAAK,EAClBC,cAAe,KAAK,EACpBb,QAAS,CAAA,EACTE,SAAU,KAAK,CACjB,EACA,CAACa,EAAGC,KACF,IAAMC,EAAKD,EAAIE,OAAO,CAChB1B,EAAQ2B,GAAAA,YAAU,EACtB,CACEV,IAAKQ,EAAGR,GAAG,CACXH,QAASW,EAAGX,OAAO,CACnBP,SAAUkB,EAAGlB,QAAQ,CACrBa,YAAaK,EAAGL,WAAW,CAC3BC,cAAeI,EAAGJ,aAAa,CAC/Bb,QAASiB,EAAGjB,OAAO,CACnBE,SAASkB,CAAY,EACnBH,EAAGI,aAAa,CACd,IAAIC,YAAY,SAAU,CACxBC,OAAQH,CACV,GAEJ,CACF,EACAL,GAMF,MAHAV,GAAAA,cAAY,EAAC,KACXmB,GAAAA,gBAAc,EAACP,EAAI,CAAC,MAAM,CAC5B,yCAGwBQ,QAAM,6BACzBlC,EAAWC,GAGlB,SAEF,EAAeD"}

package/lib/switch/style.js

@@ -134,5 +134,4 @@
       transform: rotate(360deg);
     }
   }
-`;
-//# sourceMappingURL=style.js.map
+`;

package/lib/switch/style.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/switch/style.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const style = css`\n  .switch {\n    position: relative;\n    display: inline-block;\n    border-radius: 12px;\n    padding: 2px;\n    font-size: 12px;\n    background-color: var(--primary-border);\n    opacity: 1;\n    outline: 0;\n    box-shadow:\n      inset 0 0 0 0 var(--primary-color),\n      0 0 0 0 var(--primary-hover),\n      0 0 0 0 var(--primary-border);\n    transition:\n      0.4s box-shadow,\n      var(--transition-duration) background-color,\n      var(--transition-duration) opacity;\n    cursor: pointer;\n    inline-size: fit-content;\n    min-inline-size: 44px;\n    block-size: 22px;\n    line-height: 18px;\n    user-select: none;\n    box-sizing: border-box;\n\n    &::before {\n      color: var(--primary-secondary);\n      padding-inline: 20px 8px;\n      transition-duration: var(--transition-duration);\n      transition-property: color, padding, background-color;\n      content: attr(text-off) '';\n    }\n\n    &::after {\n      position: absolute;\n      margin: auto;\n      border: 1.5px solid #fff;\n      border-radius: 12px;\n      background-color: #fff;\n      outline: 2.05px solid #fff;\n      box-shadow: 0 2px 4px 1px var(--primary-shadow);\n      transition:\n        0.6s transform ease,\n        var(--transition-duration) padding ease,\n        var(--transition-duration) inset-inline-start ease,\n        var(--transition-duration) background-color 0.1s,\n        var(--transition-duration) border-color;\n      outline-offset: -0.05px;\n      inset-block: 3px;\n      block-size: 14px;\n      min-inline-size: 14px;\n      content: '';\n      inset-inline-start: 4px;\n      box-sizing: border-box;\n    }\n\n    &:not([aria-disabled]),\n    &[aria-disabled='false'] {\n      &:not(.loading) {\n        &:focus {\n          box-shadow:\n            inset 0 0 0 0 var(--primary-color),\n            0 0 0 1px var(--primary-hover),\n            0 0 1px 3px var(--primary-border);\n\n          &.checked {\n            box-shadow:\n              inset 0 0 3px 12px var(--primary-color),\n              0 0 0 1px var(--primary-hover),\n              0 0 1px 3px var(--primary-border);\n          }\n        }\n\n        &:hover {\n          background-color: var(--primary-secondary-bg);\n        }\n\n        &:active {\n          &::after {\n            padding-inline: 10px;\n            background-color: var(--primary-hover);\n          }\n\n          &.checked {\n            &::after {\n              transform: translateX(-10px);\n            }\n          }\n        }\n      }\n    }\n\n    &.loading,\n    &[aria-disabled]:not([aria-disabled='false']) {\n      color: var(--disable-color);\n      background-color: var(--disable-bg);\n      opacity: 0.8;\n      cursor: not-allowed;\n    }\n  }\n\n  .checked {\n    box-shadow:\n      inset 0 0 3px 12px var(--primary-color),\n      0 0 0 0 var(--primary-hover),\n      0 0 0 0 var(--primary-border);\n\n    &::before {\n      color: #fff;\n      padding-inline: 8px 20px;\n      content: attr(text-on) '';\n    }\n\n    &::after {\n      inset-inline-start: calc(100% - 18px);\n    }\n  }\n\n  .loading {\n    &::after {\n      border-block-start-color: var(--primary-color);\n      border-block-end-color: var(--primary-color);\n      animation: switch-loading 1.5s infinite linear;\n    }\n  }\n\n  @keyframes switch-loading {\n    form {\n      transform: rotate(0deg);\n    }\n\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n`;\n"],"names":["style","css"],"mappings":"kGAEaA,6CAAAA,qBAFO,eAEPA,EAAQC,GAAAA,KAAG,CAAA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwIzB,CAAC"}
+{"version":3,"sources":["components/switch/style.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const style = css`\n  .switch {\n    position: relative;\n    display: inline-block;\n    border-radius: 12px;\n    padding: 2px;\n    font-size: 12px;\n    background-color: var(--primary-border);\n    opacity: 1;\n    outline: 0;\n    box-shadow:\n      inset 0 0 0 0 var(--primary-color),\n      0 0 0 0 var(--primary-hover),\n      0 0 0 0 var(--primary-border);\n    transition:\n      0.4s box-shadow,\n      var(--transition-duration) background-color,\n      var(--transition-duration) opacity;\n    cursor: pointer;\n    inline-size: fit-content;\n    min-inline-size: 44px;\n    block-size: 22px;\n    line-height: 18px;\n    user-select: none;\n    box-sizing: border-box;\n\n    &::before {\n      color: var(--primary-secondary);\n      padding-inline: 20px 8px;\n      transition-duration: var(--transition-duration);\n      transition-property: color, padding, background-color;\n      content: attr(text-off) '';\n    }\n\n    &::after {\n      position: absolute;\n      margin: auto;\n      border: 1.5px solid #fff;\n      border-radius: 12px;\n      background-color: #fff;\n      outline: 2.05px solid #fff;\n      box-shadow: 0 2px 4px 1px var(--primary-shadow);\n      transition:\n        0.6s transform ease,\n        var(--transition-duration) padding ease,\n        var(--transition-duration) inset-inline-start ease,\n        var(--transition-duration) background-color 0.1s,\n        var(--transition-duration) border-color;\n      outline-offset: -0.05px;\n      inset-block: 3px;\n      block-size: 14px;\n      min-inline-size: 14px;\n      content: '';\n      inset-inline-start: 4px;\n      box-sizing: border-box;\n    }\n\n    &:not([aria-disabled]),\n    &[aria-disabled='false'] {\n      &:not(.loading) {\n        &:focus {\n          box-shadow:\n            inset 0 0 0 0 var(--primary-color),\n            0 0 0 1px var(--primary-hover),\n            0 0 1px 3px var(--primary-border);\n\n          &.checked {\n            box-shadow:\n              inset 0 0 3px 12px var(--primary-color),\n              0 0 0 1px var(--primary-hover),\n              0 0 1px 3px var(--primary-border);\n          }\n        }\n\n        &:hover {\n          background-color: var(--primary-secondary-bg);\n        }\n\n        &:active {\n          &::after {\n            padding-inline: 10px;\n            background-color: var(--primary-hover);\n          }\n\n          &.checked {\n            &::after {\n              transform: translateX(-10px);\n            }\n          }\n        }\n      }\n    }\n\n    &.loading,\n    &[aria-disabled]:not([aria-disabled='false']) {\n      color: var(--disable-color);\n      background-color: var(--disable-bg);\n      opacity: 0.8;\n      cursor: not-allowed;\n    }\n  }\n\n  .checked {\n    box-shadow:\n      inset 0 0 3px 12px var(--primary-color),\n      0 0 0 0 var(--primary-hover),\n      0 0 0 0 var(--primary-border);\n\n    &::before {\n      color: #fff;\n      padding-inline: 8px 20px;\n      content: attr(text-on) '';\n    }\n\n    &::after {\n      inset-inline-start: calc(100% - 18px);\n    }\n  }\n\n  .loading {\n    &::after {\n      border-block-start-color: var(--primary-color);\n      border-block-end-color: var(--primary-color);\n      animation: switch-loading 1.5s infinite linear;\n    }\n  }\n\n  @keyframes switch-loading {\n    form {\n      transform: rotate(0deg);\n    }\n\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n`;\n"],"names":["style","css"],"mappings":"kGAEaA,6CAAAA,qBAFO,eAEPA,EAAQC,GAAAA,KAAG,CAAA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwIzB,CAAC"}

package/lib/table/index.js

@@ -1,2 +1 @@
-"use strict";var e,t,r,n;Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return z}});const a=require("solid-js/web"),l=require("solid-js"),i=f(require("@moneko/common/lib/isFunction")),o=f(require("@moneko/common/lib/isObject")),s=f(require("@moneko/common/lib/isString")),c=f(require("@moneko/common/lib/isUndefined")),u=require("@moneko/css"),p=require("solid-element"),d=require("../basic-config"),m=function(e,t){if(e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var r=h(void 0);if(r&&r.has(e))return r.get(e);var n={__proto__:null},a=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var l in e)if("default"!==l&&Object.prototype.hasOwnProperty.call(e,l)){var i=a?Object.getOwnPropertyDescriptor(e,l):null;i&&(i.get||i.set)?Object.defineProperty(n,l,i):n[l]=e[l]}return n.default=e,r&&r.set(e,n),n}(require("../theme")),g=require("./styles");function f(e){return e&&e.__esModule?e:{default:e}}function h(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,r=new WeakMap;return(h=function(e){return e?r:t})(e)}require("../pagination");const y=(0,a.template)("<span>"),b=(0,a.template)("<style> "),v=(0,a.template)("<style>"),w=(0,a.template)('<caption class="table-title"><slot name="title">'),_=(0,a.template)('<th class="table-cell">'),C=(0,a.template)('<tfoot class="table-foot"><tr>'),P=(0,a.template)("<table><thead><tr></tr></thead><tbody>"),S=(0,a.template)('<n-pagination class="table-pagination">',!0,!1),O=(0,a.template)("<th>"),$=(0,a.template)("<tr>"),j=(0,a.template)('<span class="empty-val">'),k=(0,a.template)("<td>"),x={page:1,pageSize:20,total:0,totalText:void 0,size:void 0};function q(e){let{baseStyle:t}=m.default,[r,n]=(0,l.splitProps)(e,["class","css","loading","summary","summaryText","columns","data","emptyVal","title","align","char","charoff","valign","pagination","size"]),[p]=(0,l.splitProps)(r,["align","char","charoff","valign"]),[d,f]=(0,l.createSignal)(!1),[h,q]=(0,l.createSignal)(1),[z,M]=(0,l.createSignal)(20),[T,F]=(0,l.createSignal)(0);function E(e){return{width:e.width,align:e.align,valign:e.valign,char:e.char,charoff:e.charoff,colspan:e.colspan,rowspan:e.rowspan}}(0,l.createEffect)(()=>{(0,l.batch)(()=>{r.pagination&&(q(r.pagination.page||1),M(r.pagination.pageSize||20),F(r.pagination.total||0))})});let V=(0,l.createMemo)(()=>Object.assign(x,r.pagination)),W=(0,l.createMemo)(()=>{let e=[],t=!1;for(let n in r.columns)if(Object.prototype.hasOwnProperty.call(r.columns,n)){let l=r.columns[n],i=Object.assign({key:n,originKey:n,label:l.toString()},(0,o.default)(l)&&{label:"order"===l.type&&"序号"||n,...l});"order"===i.type&&(t=!0,i.render=function(e,t,r){return(()=>{let e=y();return(0,a.insert)(e,()=>(h()-1)*z()+r+1),e})()}),e.push(i)}return(0,l.untrack)(d)!==t&&f(t),e});function D(e){r.pagination&&(q(e.detail[0]),M(e.detail[1]),r.pagination.onChange?.(...e.detail))}return[(()=>{let e=b(),r=e.firstChild;return(0,a.effect)(()=>r.data=t()),e})(),(()=>{let e=v();return e.textContent=g.styles,e})(),(0,a.createComponent)(l.Show,{get when(){return r.css},get children(){let e=b(),t=e.firstChild;return(0,a.effect)(()=>t.data=(0,u.css)(r.css)),e}}),(()=>{let e=P(),t=e.firstChild,o=t.firstChild,m=t.nextSibling;return(0,a.spread)(e,(0,a.mergeProps)(n,{get class(){return(0,u.cx)("table",r.size)},part:"table"}),!1,!0),(0,a.insert)(e,(0,a.createComponent)(l.Show,{get when(){return r.title},get children(){let e=w(),t=e.firstChild;return t._$owner=(0,a.getOwner)(),(0,a.insert)(t,()=>r.title),e}}),t),(0,a.spread)(t,(0,a.mergeProps)(p,{class:"table-head"}),!1,!0),(0,a.insert)(o,(0,a.createComponent)(l.For,{get each(){return W()},children:e=>{let t=E(e);return(()=>{let r=O();return(0,a.spread)(r,(0,a.mergeProps)(t,{class:"table-cell"}),!1,!0),(0,a.insert)(r,()=>e.label),r})()}})),(0,a.spread)(m,(0,a.mergeProps)(p,{class:"table-body"}),!1,!0),(0,a.insert)(m,(0,a.createComponent)(l.For,{get each(){return r.data},children:(e,t)=>(()=>{let n=$();return(0,a.insert)(n,(0,a.createComponent)(l.For,{get each(){return W()},children:n=>{let o=E(n),s=(0,l.createMemo)(()=>{if("order"===n.type){let e=V();return(e.page-1)*e.pageSize+t()+1}let l=e[n.key];return(0,c.default)(l)||null===l?(()=>{let e=j();return(0,a.insert)(e,()=>r.emptyVal),e})():l});return(()=>{let r=k();return(0,a.spread)(r,(0,a.mergeProps)(o,{class:"table-cell"}),!1,!0),(0,a.insert)(r,(0,a.createComponent)(l.Show,{get when(){return(0,i.default)(n.render)},get fallback(){return(0,a.createComponent)(s,{})},get children(){return n.render(e[n.key],e,t())}})),r})()}})),n})()})),(0,a.insert)(e,(0,a.createComponent)(l.Show,{get when(){return r.summary?.length},get children(){let e=C(),t=e.firstChild;return(0,a.spread)(e,p,!1,!0),(0,a.insert)(t,(0,a.createComponent)(l.Show,{get when(){return d()},get children(){let e=_();return(0,a.spread)(e,(0,a.mergeProps)(()=>E(W()[0])),!1,!0),(0,a.insert)(e,()=>r.summaryText),e}}),null),(0,a.insert)(t,(0,a.createComponent)(l.For,{get each(){return W().filter(e=>!e.type||!["order"].includes(e.type))},children:e=>{let t=E(e),n=(0,l.createMemo)(()=>{if(r.data?.length&&r.summary?.includes(e.originKey)){var t,n;return t=r.data,n=e.key,t.reduce(function(e,t){let r=t[n];return(0,s.default)(r)||(0,c.default)(r)||null===r?e:e+t[n]},0)}return null});return(()=>{let e=k();return(0,a.spread)(e,(0,a.mergeProps)(t,{class:"table-cell"}),!1,!0),(0,a.insert)(e,n),e})()}}),null),e}}),null),e})(),(0,a.createComponent)(l.Show,{get when(){return r.pagination},get children(){let e=S();return(0,a.addEventListener)(e,"change",D),e._$owner=(0,a.getOwner)(),(0,a.effect)(t=>{let n=h(),a=z(),l=T(),i=V().totalText,o=V().size||r.size;return n!==t._v$&&(e.page=t._v$=n),a!==t._v$2&&(e.pageSize=t._v$2=a),l!==t._v$3&&(e.total=t._v$3=l),i!==t._v$4&&(e.totalText=t._v$4=i),o!==t._v$5&&(e.size=t._v$5=o),t},{_v$:void 0,_v$2:void 0,_v$3:void 0,_v$4:void 0,_v$5:void 0}),e}})]}(r=e||(e={})).left="left",r.right="right",r.center="center",r.justify="justify",r.char="char",(n=t||(t={})).top="top",n.middle="middle",n.bottom="bottom",n.baseline="baseline",(0,p.customElement)("n-table",{class:void 0,css:void 0,loading:!1,columns:{},data:[],emptyVal:"-",title:void 0,char:void 0,charoff:void 0,align:"left",valign:"middle",summary:void 0,summaryText:"合计",pagination:void 0,size:void 0},(e,t)=>{let r=t.element,n=(0,l.mergeProps)({css:r.css,columns:r.columns,data:r.data,pagination:r.pagination,summary:r.summary,summaryText:r.summaryText},e,{title:!!r.querySelector("[slot='title']")||e.title});return(0,l.createEffect)(()=>{(0,d.clearAttribute)(r,["css","columns","data","pagination","summary"])}),[(()=>{let e=v();return e.textContent=m.block,e})(),(0,a.createComponent)(q,n)]});const z=q;
-//# sourceMappingURL=index.js.map
+"use strict";var e,t;Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return q}});const r=require("solid-js/web"),n=require("solid-js"),a=m(require("@moneko/common/lib/isFunction")),l=m(require("@moneko/common/lib/isObject")),i=m(require("@moneko/common/lib/isString")),o=m(require("@moneko/common/lib/isUndefined")),s=require("@moneko/css"),c=require("solid-element"),u=require("../basic-config"),p=f(require("../theme")),d=require("./styles");function m(e){return e&&e.__esModule?e:{default:e}}function g(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,r=new WeakMap;return(g=function(e){return e?r:t})(e)}function f(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var r=g(t);if(r&&r.has(e))return r.get(e);var n={__proto__:null},a=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var l in e)if("default"!==l&&Object.prototype.hasOwnProperty.call(e,l)){var i=a?Object.getOwnPropertyDescriptor(e,l):null;i&&(i.get||i.set)?Object.defineProperty(n,l,i):n[l]=e[l]}return n.default=e,r&&r.set(e,n),n}require("../pagination");const h=(0,r.template)("<span>"),y=(0,r.template)("<style> "),b=(0,r.template)("<style>"),v=(0,r.template)('<caption class="table-title"><slot name="title">'),w=(0,r.template)('<th class="table-cell">'),_=(0,r.template)('<tfoot class="table-foot"><tr>'),C=(0,r.template)("<table><thead><tr></tr></thead><tbody>"),P=(0,r.template)('<n-pagination class="table-pagination">',!0,!1),S=(0,r.template)("<th>"),O=(0,r.template)("<tr>"),$=(0,r.template)('<span class="empty-val">'),j=(0,r.template)("<td>"),k={page:1,pageSize:20,total:0,totalText:void 0,size:void 0};function x(e){let{baseStyle:t}=p.default,[c,u]=(0,n.splitProps)(e,["class","css","loading","summary","summaryText","columns","data","emptyVal","title","align","char","charoff","valign","pagination","size"]),[m]=(0,n.splitProps)(c,["align","char","charoff","valign"]),[g,f]=(0,n.createSignal)(!1),[x,q]=(0,n.createSignal)(1),[z,M]=(0,n.createSignal)(20),[T,F]=(0,n.createSignal)(0);function E(e){return{width:e.width,align:e.align,valign:e.valign,char:e.char,charoff:e.charoff,colspan:e.colspan,rowspan:e.rowspan}}(0,n.createEffect)(()=>{(0,n.batch)(()=>{c.pagination&&(q(c.pagination.page||1),M(c.pagination.pageSize||20),F(c.pagination.total||0))})});let V=(0,n.createMemo)(()=>Object.assign(k,c.pagination)),W=(0,n.createMemo)(()=>{let e=[],t=!1;for(let n in c.columns)if(Object.prototype.hasOwnProperty.call(c.columns,n)){let a=c.columns[n],i=Object.assign({key:n,originKey:n,label:a.toString()},(0,l.default)(a)&&{label:"order"===a.type&&"序号"||n,...a});"order"===i.type&&(t=!0,i.render=function(e,t,n){return(()=>{let e=h();return(0,r.insert)(e,()=>(x()-1)*z()+n+1),e})()}),e.push(i)}return(0,n.untrack)(g)!==t&&f(t),e});function D(e){c.pagination&&(q(e.detail[0]),M(e.detail[1]),c.pagination.onChange?.(...e.detail))}return[(()=>{let e=y(),n=e.firstChild;return(0,r.effect)(()=>n.data=t()),e})(),(()=>{let e=b();return e.textContent=d.styles,e})(),(0,r.createComponent)(n.Show,{get when(){return c.css},get children(){let e=y(),t=e.firstChild;return(0,r.effect)(()=>t.data=(0,s.css)(c.css)),e}}),(()=>{let e=C(),t=e.firstChild,l=t.firstChild,p=t.nextSibling;return(0,r.spread)(e,(0,r.mergeProps)(u,{get class(){return(0,s.cx)("table",c.size)},part:"table"}),!1,!0),(0,r.insert)(e,(0,r.createComponent)(n.Show,{get when(){return c.title},get children(){let e=v(),t=e.firstChild;return t._$owner=(0,r.getOwner)(),(0,r.insert)(t,()=>c.title),e}}),t),(0,r.spread)(t,(0,r.mergeProps)(m,{class:"table-head"}),!1,!0),(0,r.insert)(l,(0,r.createComponent)(n.For,{get each(){return W()},children:e=>{let t=E(e);return(()=>{let n=S();return(0,r.spread)(n,(0,r.mergeProps)(t,{class:"table-cell"}),!1,!0),(0,r.insert)(n,()=>e.label),n})()}})),(0,r.spread)(p,(0,r.mergeProps)(m,{class:"table-body"}),!1,!0),(0,r.insert)(p,(0,r.createComponent)(n.For,{get each(){return c.data},children:(e,t)=>(()=>{let l=O();return(0,r.insert)(l,(0,r.createComponent)(n.For,{get each(){return W()},children:l=>{let i=E(l),s=(0,n.createMemo)(()=>{if("order"===l.type){let e=V();return(e.page-1)*e.pageSize+t()+1}let n=e[l.key];return(0,o.default)(n)||null===n?(()=>{let e=$();return(0,r.insert)(e,()=>c.emptyVal),e})():n});return(()=>{let o=j();return(0,r.spread)(o,(0,r.mergeProps)(i,{class:"table-cell"}),!1,!0),(0,r.insert)(o,(0,r.createComponent)(n.Show,{get when(){return(0,a.default)(l.render)},get fallback(){return(0,r.createComponent)(s,{})},get children(){return l.render(e[l.key],e,t())}})),o})()}})),l})()})),(0,r.insert)(e,(0,r.createComponent)(n.Show,{get when(){return c.summary?.length},get children(){let e=_(),t=e.firstChild;return(0,r.spread)(e,m,!1,!0),(0,r.insert)(t,(0,r.createComponent)(n.Show,{get when(){return g()},get children(){let e=w();return(0,r.spread)(e,(0,r.mergeProps)(()=>E(W()[0])),!1,!0),(0,r.insert)(e,()=>c.summaryText),e}}),null),(0,r.insert)(t,(0,r.createComponent)(n.For,{get each(){return W().filter(e=>!e.type||!["order"].includes(e.type))},children:e=>{let t=E(e),a=(0,n.createMemo)(()=>{if(c.data?.length&&c.summary?.includes(e.originKey)){var t,r;return t=c.data,r=e.key,t.reduce(function(e,t){let n=t[r];return(0,i.default)(n)||(0,o.default)(n)||null===n?e:e+t[r]},0)}return null});return(()=>{let e=j();return(0,r.spread)(e,(0,r.mergeProps)(t,{class:"table-cell"}),!1,!0),(0,r.insert)(e,a),e})()}}),null),e}}),null),e})(),(0,r.createComponent)(n.Show,{get when(){return c.pagination},get children(){let e=P();return(0,r.addEventListener)(e,"change",D),e._$owner=(0,r.getOwner)(),(0,r.effect)(t=>{let r=x(),n=z(),a=T(),l=V().totalText,i=V().size||c.size;return r!==t._v$&&(e.page=t._v$=r),n!==t._v$2&&(e.pageSize=t._v$2=n),a!==t._v$3&&(e.total=t._v$3=a),l!==t._v$4&&(e.totalText=t._v$4=l),i!==t._v$5&&(e.size=t._v$5=i),t},{_v$:void 0,_v$2:void 0,_v$3:void 0,_v$4:void 0,_v$5:void 0}),e}})]}!function(e){e.left="left",e.right="right",e.center="center",e.justify="justify",e.char="char"}(e||(e={})),function(e){e.top="top",e.middle="middle",e.bottom="bottom",e.baseline="baseline"}(t||(t={})),(0,c.customElement)("n-table",{class:void 0,css:void 0,loading:!1,columns:{},data:[],emptyVal:"-",title:void 0,char:void 0,charoff:void 0,align:"left",valign:"middle",summary:void 0,summaryText:"合计",pagination:void 0,size:void 0},(e,t)=>{let a=t.element,l=(0,n.mergeProps)({css:a.css,columns:a.columns,data:a.data,pagination:a.pagination,summary:a.summary,summaryText:a.summaryText},e,{title:!!a.querySelector("[slot='title']")||e.title});return(0,n.createEffect)(()=>{(0,u.clearAttribute)(a,["css","columns","data","pagination","summary"])}),[(()=>{let e=b();return e.textContent=p.block,e})(),(0,r.createComponent)(x,l)]});const q=x;

package/lib/table/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/table/index.tsx"],"sourcesContent":["import {\n  batch,\n  createEffect,\n  createMemo,\n  createSignal,\n  For,\n  mergeProps,\n  Show,\n  splitProps,\n  untrack,\n} from 'solid-js';\nimport { isFunction, isObject, isString, isUndefined } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { BasicConfig, CustomElement, PaginationProps } from '..';\nimport { clearAttribute } from '../basic-config';\nimport theme, { block } from '../theme';\n\nimport { styles } from './styles';\n\nimport '../pagination';\n\ntype Col = Column<Record<string, Any>>;\nconst defaultPagination = { page: 1, pageSize: 20, total: 0, totalText: void 0, size: void 0 };\n\nfunction Table(_: TableProps) {\n  const { baseStyle } = theme;\n  const [local, other] = splitProps(_, [\n    'class',\n    'css',\n    'loading',\n    'summary',\n    'summaryText',\n    'columns',\n    'data',\n    'emptyVal',\n    'title',\n    'align',\n    'char',\n    'charoff',\n    'valign',\n    'pagination',\n    'size',\n  ]);\n  const [layout] = splitProps(local, ['align', 'char', 'charoff', 'valign']);\n  const [hasOrder, setHasOrder] = createSignal(false);\n  const [page, setPage] = createSignal(1);\n  const [pageSize, setPageSize] = createSignal(20);\n  const [total, setTotal] = createSignal(0);\n\n  createEffect(() => {\n    batch(() => {\n      if (local.pagination) {\n        setPage(local.pagination.page || 1);\n        setPageSize(local.pagination.pageSize || 20);\n        setTotal(local.pagination.total || 0);\n      }\n    });\n  });\n\n  function getLayout(col: Col) {\n    return {\n      width: col.width,\n      align: col.align,\n      valign: col.valign,\n      char: col.char,\n      charoff: col.charoff,\n      colspan: col.colspan,\n      rowspan: col.rowspan,\n    };\n  }\n  function sum(arr: Required<TableProps>['data'], key: string) {\n    return arr.reduce(function (prev, curr) {\n      const next = curr[key];\n\n      if (isString(next) || isUndefined(next) || next === null) {\n        return prev;\n      }\n      return prev + curr[key];\n    }, 0);\n  }\n  const pagination = createMemo(() => Object.assign(defaultPagination, local.pagination));\n  const columns = createMemo(() => {\n    const cols: Required<Col>[] = [];\n    let _hasOrder = false;\n\n    for (const key in local.columns) {\n      if (Object.prototype.hasOwnProperty.call(local.columns, key)) {\n        const col = local.columns[key];\n        const _col: Col = Object.assign(\n          { key, originKey: key, label: col.toString() },\n          isObject(col) && {\n            label: (col.type === 'order' && '序号') || key,\n            ...col,\n          },\n        );\n\n        if (_col.type === 'order') {\n          _hasOrder = true;\n          _col.render = function (_val: unknown, _row: unknown, i: number) {\n            return <span>{(page() - 1) * pageSize() + i + 1}</span>;\n          };\n        }\n        cols.push(_col as Required<Col>);\n      }\n    }\n    if (untrack(hasOrder) !== _hasOrder) {\n      setHasOrder(_hasOrder);\n    }\n    return cols;\n  });\n\n  function handlePageChange(e: CustomEvent<[page: number, pageSize: number]>) {\n    if (local.pagination) {\n      setPage(e.detail[0]);\n      setPageSize(e.detail[1]);\n      local.pagination.onChange?.(...e.detail);\n    }\n  }\n\n  return (\n    <>\n      <style textContent={baseStyle()} />\n      <style textContent={styles} />\n      <Show when={local.css}>\n        <style textContent={css(local.css)} />\n      </Show>\n      <table {...other} class={cx('table', local.size)} part=\"table\">\n        <Show when={local.title}>\n          <caption class=\"table-title\">\n            <slot name=\"title\">{local.title}</slot>\n          </caption>\n        </Show>\n        <thead {...layout} class=\"table-head\">\n          <tr>\n            <For each={columns()}>\n              {(col) => {\n                const _layout = getLayout(col);\n\n                return (\n                  <th {..._layout} class=\"table-cell\">\n                    {col.label}\n                  </th>\n                );\n              }}\n            </For>\n          </tr>\n        </thead>\n        <tbody {...layout} class=\"table-body\">\n          <For each={local.data}>\n            {(row, i) => {\n              return (\n                <tr>\n                  <For each={columns()}>\n                    {(col) => {\n                      const _layout = getLayout(col);\n                      const Row = createMemo(() => {\n                        if (col.type === 'order') {\n                          const _pagination = pagination();\n\n                          return (_pagination.page - 1) * _pagination.pageSize + i() + 1;\n                        }\n                        const val = row[col.key];\n                        const isEmpty = isUndefined(val) || val === null;\n\n                        if (isEmpty) {\n                          return <span class=\"empty-val\">{local.emptyVal}</span>;\n                        }\n                        return val;\n                      });\n\n                      return (\n                        <td {..._layout} class=\"table-cell\">\n                          <Show when={isFunction(col.render)} fallback={<Row />}>\n                            {col.render(row[col.key], row, i())}\n                          </Show>\n                        </td>\n                      );\n                    }}\n                  </For>\n                </tr>\n              );\n            }}\n          </For>\n        </tbody>\n        <Show when={local.summary?.length}>\n          <tfoot class=\"table-foot\" {...layout}>\n            <tr>\n              <Show when={hasOrder()}>\n                <th class=\"table-cell\" {...getLayout(columns()[0])}>\n                  {local.summaryText}\n                </th>\n              </Show>\n              <For each={columns().filter((c) => !c.type || !['order'].includes(c.type))}>\n                {(col) => {\n                  const _layout = getLayout(col);\n                  const val = createMemo(() => {\n                    if (local.data?.length && local.summary?.includes(col.originKey)) {\n                      return sum(local.data, col.key);\n                    }\n                    return null;\n                  });\n\n                  return (\n                    <td {..._layout} class=\"table-cell\">\n                      {val()}\n                    </td>\n                  );\n                }}\n              </For>\n            </tr>\n          </tfoot>\n        </Show>\n      </table>\n      <Show when={local.pagination}>\n        <n-pagination\n          class=\"table-pagination\"\n          page={page()}\n          page-size={pageSize()}\n          total={total()}\n          total-text={pagination().totalText}\n          size={pagination().size || local.size}\n          onChange={handlePageChange}\n        />\n      </Show>\n    </>\n  );\n}\n\n/** API\n * @since 2.1.0\n */\nexport interface TableProps<T extends Record<string, Any> = Record<string, Any>> extends Cell {\n  /** 自定义类名 */\n  class?: string;\n  /** 自定义类名 */\n  css?: string;\n  /** 加载中 */\n  loading?: boolean;\n  /** 单元格值为 null 或 undefined 时的回填\n   * @default '-'\n   */\n  emptyVal?: string;\n  /** 栏配置 */\n  columns?: Record<string, Column<T> | string>;\n  /** 数据源 */\n  data?: T[];\n  /** 表格标题, 支持直接赋值给 'title' 属性, 或者通过[slot=\"title\"]插槽 */\n  title?: JSX.Element | 'slot';\n  /** 汇总行 */\n  summary?: (keyof T)[];\n  /** 汇总行描述\n   * @default '合计'\n   */\n  summaryText?: JSX.Element;\n  /** 分页器\n   * @default false\n   */\n  pagination?: PaginationProps | false;\n  /** 尺寸\n   * @default 'normal'\n   */\n  size?: BasicConfig['size'];\n  children?: JSX.Element;\n}\n/** 栏 */\ninterface Column<T extends Record<string, Any>> extends Cell {\n  /** 自定义取值的 key */\n  key?: keyof T;\n  /** 原始 key */\n  originKey?: keyof T;\n  /** 单元格表头标题 */\n  label?: JSX.Element;\n  /** 自定义渲染单元格 */\n  render?(item: T[keyof T], row: T, index: number): JSX.Element;\n  /** 单元格横跨的列数 */\n  colspan?: number;\n  /** 单元格横跨的行数 */\n  rowspan?: number;\n  /** 设置为 'order' 时则当作序号行 */\n  type?: 'order';\n  /** 单元格宽 */\n  width?: number;\n}\n\n/** 单元格布局排列 */\ninterface Cell {\n  /** 单元格内容的水平对齐方式\n   * @default 'left'\n   */\n  align?: keyof typeof Align;\n  /** 规定根据哪个字符来进行文本对齐 */\n  char?: string;\n  /** 规定第一个对齐字符的偏移量 */\n  charoff?: number;\n  /** 单元格内容的垂直对齐方式\n   * @default 'middle'\n   */\n  valign?: keyof typeof Valign;\n}\n/** 水平对齐方式 */\nenum Align {\n  /** 左对齐 */\n  left = 'left',\n  /** 右对齐 */\n  right = 'right',\n  /** 居中对齐 */\n  center = 'center',\n  /** 对行进行伸展，这样每行都可以有相等的长度 */\n  justify = 'justify',\n  /** 将内容对准指定字符 */\n  char = 'char',\n}\n/** 垂直对齐方式 */\nenum Valign {\n  /** 上对齐 */\n  top = 'top',\n  /** 居中对齐 */\n  middle = 'middle',\n  /** 下对齐 */\n  bottom = 'bottom',\n  /** 与基线对齐 */\n  baseline = 'baseline',\n}\nexport type TableElement = CustomElement<TableProps>;\n\ncustomElement<TableProps>(\n  'n-table',\n  {\n    class: void 0,\n    css: void 0,\n    loading: false,\n    columns: {},\n    data: [],\n    emptyVal: '-',\n    title: void 0,\n    char: void 0,\n    charoff: void 0,\n    align: Align.left,\n    valign: Valign.middle,\n    summary: void 0,\n    summaryText: '合计',\n    pagination: void 0,\n    size: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        css: el.css,\n        columns: el.columns,\n        data: el.data,\n        pagination: el.pagination,\n        summary: el.summary,\n        summaryText: el.summaryText,\n      },\n      _,\n      {\n        title: !!el.querySelector(\"[slot='title']\") || _.title,\n      },\n    );\n\n    createEffect(() => {\n      clearAttribute(el, ['css', 'columns', 'data', 'pagination', 'summary']);\n    });\n    return (\n      <>\n        <style textContent={block} />\n        <Table {...props} />\n      </>\n    );\n  },\n);\nexport default Table;\n"],"names":["Align","Valign","defaultPagination","page","pageSize","total","totalText","size","Table","_","baseStyle","theme","local","other","splitProps","layout","hasOrder","setHasOrder","createSignal","setPage","setPageSize","setTotal","getLayout","col","width","align","valign","char","charoff","colspan","rowspan","createEffect","batch","pagination","createMemo","Object","assign","columns","cols","_hasOrder","key","prototype","hasOwnProperty","call","_col","originKey","label","toString","isObject","type","render","_val","_row","i","push","untrack","handlePageChange","e","detail","onChange","styles","Show","css","cx","title","For","_layout","data","row","Row","_pagination","val","isUndefined","emptyVal","isFunction","summary","length","summaryText","filter","c","includes","arr","reduce","prev","curr","next","isString","customElement","class","loading","opt","el","element","props","mergeProps","querySelector","clearAttribute","block"],"mappings":"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"}
+{"version":3,"sources":["components/table/index.tsx"],"sourcesContent":["import {\n  batch,\n  createEffect,\n  createMemo,\n  createSignal,\n  For,\n  mergeProps,\n  Show,\n  splitProps,\n  untrack,\n} from 'solid-js';\nimport { isFunction, isObject, isString, isUndefined } from '@moneko/common';\nimport { css, cx } from '@moneko/css';\nimport { customElement } from 'solid-element';\n\nimport type { BasicConfig, CustomElement, PaginationProps } from '..';\nimport { clearAttribute } from '../basic-config';\nimport theme, { block } from '../theme';\n\nimport { styles } from './styles';\n\nimport '../pagination';\n\ntype Col = Column<Record<string, Any>>;\nconst defaultPagination = { page: 1, pageSize: 20, total: 0, totalText: void 0, size: void 0 };\n\nfunction Table(_: TableProps) {\n  const { baseStyle } = theme;\n  const [local, other] = splitProps(_, [\n    'class',\n    'css',\n    'loading',\n    'summary',\n    'summaryText',\n    'columns',\n    'data',\n    'emptyVal',\n    'title',\n    'align',\n    'char',\n    'charoff',\n    'valign',\n    'pagination',\n    'size',\n  ]);\n  const [layout] = splitProps(local, ['align', 'char', 'charoff', 'valign']);\n  const [hasOrder, setHasOrder] = createSignal(false);\n  const [page, setPage] = createSignal(1);\n  const [pageSize, setPageSize] = createSignal(20);\n  const [total, setTotal] = createSignal(0);\n\n  createEffect(() => {\n    batch(() => {\n      if (local.pagination) {\n        setPage(local.pagination.page || 1);\n        setPageSize(local.pagination.pageSize || 20);\n        setTotal(local.pagination.total || 0);\n      }\n    });\n  });\n\n  function getLayout(col: Col) {\n    return {\n      width: col.width,\n      align: col.align,\n      valign: col.valign,\n      char: col.char,\n      charoff: col.charoff,\n      colspan: col.colspan,\n      rowspan: col.rowspan,\n    };\n  }\n  function sum(arr: Required<TableProps>['data'], key: string) {\n    return arr.reduce(function (prev, curr) {\n      const next = curr[key];\n\n      if (isString(next) || isUndefined(next) || next === null) {\n        return prev;\n      }\n      return prev + curr[key];\n    }, 0);\n  }\n  const pagination = createMemo(() => Object.assign(defaultPagination, local.pagination));\n  const columns = createMemo(() => {\n    const cols: Required<Col>[] = [];\n    let _hasOrder = false;\n\n    for (const key in local.columns) {\n      if (Object.prototype.hasOwnProperty.call(local.columns, key)) {\n        const col = local.columns[key];\n        const _col: Col = Object.assign(\n          { key, originKey: key, label: col.toString() },\n          isObject(col) && {\n            label: (col.type === 'order' && '序号') || key,\n            ...col,\n          },\n        );\n\n        if (_col.type === 'order') {\n          _hasOrder = true;\n          _col.render = function (_val: unknown, _row: unknown, i: number) {\n            return <span>{(page() - 1) * pageSize() + i + 1}</span>;\n          };\n        }\n        cols.push(_col as Required<Col>);\n      }\n    }\n    if (untrack(hasOrder) !== _hasOrder) {\n      setHasOrder(_hasOrder);\n    }\n    return cols;\n  });\n\n  function handlePageChange(e: CustomEvent<[page: number, pageSize: number]>) {\n    if (local.pagination) {\n      setPage(e.detail[0]);\n      setPageSize(e.detail[1]);\n      local.pagination.onChange?.(...e.detail);\n    }\n  }\n\n  return (\n    <>\n      <style textContent={baseStyle()} />\n      <style textContent={styles} />\n      <Show when={local.css}>\n        <style textContent={css(local.css)} />\n      </Show>\n      <table {...other} class={cx('table', local.size)} part=\"table\">\n        <Show when={local.title}>\n          <caption class=\"table-title\">\n            <slot name=\"title\">{local.title}</slot>\n          </caption>\n        </Show>\n        <thead {...layout} class=\"table-head\">\n          <tr>\n            <For each={columns()}>\n              {(col) => {\n                const _layout = getLayout(col);\n\n                return (\n                  <th {..._layout} class=\"table-cell\">\n                    {col.label}\n                  </th>\n                );\n              }}\n            </For>\n          </tr>\n        </thead>\n        <tbody {...layout} class=\"table-body\">\n          <For each={local.data}>\n            {(row, i) => {\n              return (\n                <tr>\n                  <For each={columns()}>\n                    {(col) => {\n                      const _layout = getLayout(col);\n                      const Row = createMemo(() => {\n                        if (col.type === 'order') {\n                          const _pagination = pagination();\n\n                          return (_pagination.page - 1) * _pagination.pageSize + i() + 1;\n                        }\n                        const val = row[col.key];\n                        const isEmpty = isUndefined(val) || val === null;\n\n                        if (isEmpty) {\n                          return <span class=\"empty-val\">{local.emptyVal}</span>;\n                        }\n                        return val;\n                      });\n\n                      return (\n                        <td {..._layout} class=\"table-cell\">\n                          <Show when={isFunction(col.render)} fallback={<Row />}>\n                            {col.render(row[col.key], row, i())}\n                          </Show>\n                        </td>\n                      );\n                    }}\n                  </For>\n                </tr>\n              );\n            }}\n          </For>\n        </tbody>\n        <Show when={local.summary?.length}>\n          <tfoot class=\"table-foot\" {...layout}>\n            <tr>\n              <Show when={hasOrder()}>\n                <th class=\"table-cell\" {...getLayout(columns()[0])}>\n                  {local.summaryText}\n                </th>\n              </Show>\n              <For each={columns().filter((c) => !c.type || !['order'].includes(c.type))}>\n                {(col) => {\n                  const _layout = getLayout(col);\n                  const val = createMemo(() => {\n                    if (local.data?.length && local.summary?.includes(col.originKey)) {\n                      return sum(local.data, col.key);\n                    }\n                    return null;\n                  });\n\n                  return (\n                    <td {..._layout} class=\"table-cell\">\n                      {val()}\n                    </td>\n                  );\n                }}\n              </For>\n            </tr>\n          </tfoot>\n        </Show>\n      </table>\n      <Show when={local.pagination}>\n        <n-pagination\n          class=\"table-pagination\"\n          page={page()}\n          page-size={pageSize()}\n          total={total()}\n          total-text={pagination().totalText}\n          size={pagination().size || local.size}\n          onChange={handlePageChange}\n        />\n      </Show>\n    </>\n  );\n}\n\n/** API\n * @since 2.1.0\n */\nexport interface TableProps<T extends Record<string, Any> = Record<string, Any>> extends Cell {\n  /** 自定义类名 */\n  class?: string;\n  /** 自定义类名 */\n  css?: string;\n  /** 加载中 */\n  loading?: boolean;\n  /** 单元格值为 null 或 undefined 时的回填\n   * @default '-'\n   */\n  emptyVal?: string;\n  /** 栏配置 */\n  columns?: Record<string, Column<T> | string>;\n  /** 数据源 */\n  data?: T[];\n  /** 表格标题, 支持直接赋值给 'title' 属性, 或者通过[slot=\"title\"]插槽 */\n  title?: JSX.Element | 'slot';\n  /** 汇总行 */\n  summary?: (keyof T)[];\n  /** 汇总行描述\n   * @default '合计'\n   */\n  summaryText?: JSX.Element;\n  /** 分页器\n   * @default false\n   */\n  pagination?: PaginationProps | false;\n  /** 尺寸\n   * @default 'normal'\n   */\n  size?: BasicConfig['size'];\n  children?: JSX.Element;\n}\n/** 栏 */\ninterface Column<T extends Record<string, Any>> extends Cell {\n  /** 自定义取值的 key */\n  key?: keyof T;\n  /** 原始 key */\n  originKey?: keyof T;\n  /** 单元格表头标题 */\n  label?: JSX.Element;\n  /** 自定义渲染单元格 */\n  render?(item: T[keyof T], row: T, index: number): JSX.Element;\n  /** 单元格横跨的列数 */\n  colspan?: number;\n  /** 单元格横跨的行数 */\n  rowspan?: number;\n  /** 设置为 'order' 时则当作序号行 */\n  type?: 'order';\n  /** 单元格宽 */\n  width?: number;\n}\n\n/** 单元格布局排列 */\ninterface Cell {\n  /** 单元格内容的水平对齐方式\n   * @default 'left'\n   */\n  align?: keyof typeof Align;\n  /** 规定根据哪个字符来进行文本对齐 */\n  char?: string;\n  /** 规定第一个对齐字符的偏移量 */\n  charoff?: number;\n  /** 单元格内容的垂直对齐方式\n   * @default 'middle'\n   */\n  valign?: keyof typeof Valign;\n}\n/** 水平对齐方式 */\nenum Align {\n  /** 左对齐 */\n  left = 'left',\n  /** 右对齐 */\n  right = 'right',\n  /** 居中对齐 */\n  center = 'center',\n  /** 对行进行伸展，这样每行都可以有相等的长度 */\n  justify = 'justify',\n  /** 将内容对准指定字符 */\n  char = 'char',\n}\n/** 垂直对齐方式 */\nenum Valign {\n  /** 上对齐 */\n  top = 'top',\n  /** 居中对齐 */\n  middle = 'middle',\n  /** 下对齐 */\n  bottom = 'bottom',\n  /** 与基线对齐 */\n  baseline = 'baseline',\n}\nexport type TableElement = CustomElement<TableProps>;\n\ncustomElement<TableProps>(\n  'n-table',\n  {\n    class: void 0,\n    css: void 0,\n    loading: false,\n    columns: {},\n    data: [],\n    emptyVal: '-',\n    title: void 0,\n    char: void 0,\n    charoff: void 0,\n    align: Align.left,\n    valign: Valign.middle,\n    summary: void 0,\n    summaryText: '合计',\n    pagination: void 0,\n    size: void 0,\n  },\n  (_, opt) => {\n    const el = opt.element;\n    const props = mergeProps(\n      {\n        css: el.css,\n        columns: el.columns,\n        data: el.data,\n        pagination: el.pagination,\n        summary: el.summary,\n        summaryText: el.summaryText,\n      },\n      _,\n      {\n        title: !!el.querySelector(\"[slot='title']\") || _.title,\n      },\n    );\n\n    createEffect(() => {\n      clearAttribute(el, ['css', 'columns', 'data', 'pagination', 'summary']);\n    });\n    return (\n      <>\n        <style textContent={block} />\n        <Table {...props} />\n      </>\n    );\n  },\n);\nexport default Table;\n"],"names":["defaultPagination","page","pageSize","total","totalText","size","Table","_","baseStyle","theme","local","other","splitProps","layout","hasOrder","setHasOrder","createSignal","setPage","setPageSize","setTotal","getLayout","col","width","align","valign","char","charoff","colspan","rowspan","createEffect","batch","pagination","createMemo","Object","assign","columns","cols","_hasOrder","key","prototype","hasOwnProperty","call","_col","originKey","label","toString","isObject","type","render","_val","_row","i","push","untrack","handlePageChange","e","detail","onChange","styles","Show","css","cx","title","For","_layout","data","row","Row","_pagination","val","isUndefined","emptyVal","isFunction","summary","length","summaryText","filter","c","includes","arr","reduce","prev","curr","next","isString","Align","Valign","customElement","class","loading","opt","el","element","props","mergeProps","querySelector","clearAttribute","block"],"mappings":"0GAsXA,+CAAA,+CA5WO,wBACqD,8CAAA,4CAAA,4CAAA,6CACpC,yBACM,2BAGC,+BACF,uBAEN,kpBAEhB,ogBAGDA,EAAoB,CAAEC,KAAM,EAAGC,SAAU,GAAIC,MAAO,EAAGC,UAAW,KAAK,EAAGC,KAAM,KAAK,CAAE,EAE7F,SAASC,EAAMC,CAAa,EAC1B,GAAM,CAAEC,UAAAA,CAAS,CAAE,CAAGC,SAAK,CACrB,CAACC,EAAOC,EAAM,CAAGC,GAAAA,YAAU,EAACL,EAAG,CACnC,QACA,MACA,UACA,UACA,cACA,UACA,OACA,WACA,QACA,QACA,OACA,UACA,SACA,aACA,OACD,EACK,CAACM,EAAO,CAAGD,GAAAA,YAAU,EAACF,EAAO,CAAC,QAAS,OAAQ,UAAW,SAAS,EACnE,CAACI,EAAUC,EAAY,CAAGC,GAAAA,cAAY,EAAC,CAAA,GACvC,CAACf,EAAMgB,EAAQ,CAAGD,GAAAA,cAAY,EAAC,GAC/B,CAACd,EAAUgB,EAAY,CAAGF,GAAAA,cAAY,EAAC,IACvC,CAACb,EAAOgB,EAAS,CAAGH,GAAAA,cAAY,EAAC,GAYvC,SAASI,EAAUC,CAAQ,EACzB,MAAO,CACLC,MAAOD,EAAIC,KAAK,CAChBC,MAAOF,EAAIE,KAAK,CAChBC,OAAQH,EAAIG,MAAM,CAClBC,KAAMJ,EAAII,IAAI,CACdC,QAASL,EAAIK,OAAO,CACpBC,QAASN,EAAIM,OAAO,CACpBC,QAASP,EAAIO,OAAO,AACtB,CACF,CApBAC,GAAAA,cAAY,EAAC,KACXC,GAAAA,OAAK,EAAC,KACApB,EAAMqB,UAAU,GAClBd,EAAQP,EAAMqB,UAAU,CAAC9B,IAAI,EAAI,GACjCiB,EAAYR,EAAMqB,UAAU,CAAC7B,QAAQ,EAAI,IACzCiB,EAAST,EAAMqB,UAAU,CAAC5B,KAAK,EAAI,GAEvC,EACF,GAuBA,IAAM4B,EAAaC,GAAAA,YAAU,EAAC,IAAMC,OAAOC,MAAM,CAAClC,EAAmBU,EAAMqB,UAAU,GAC/EI,EAAUH,GAAAA,YAAU,EAAC,KACzB,IAAMI,EAAwB,EAAE,CAC5BC,EAAY,CAAA,EAEhB,IAAK,IAAMC,KAAO5B,EAAMyB,OAAO,CAC7B,GAAIF,OAAOM,SAAS,CAACC,cAAc,CAACC,IAAI,CAAC/B,EAAMyB,OAAO,CAAEG,GAAM,CAC5D,IAAMjB,EAAMX,EAAMyB,OAAO,CAACG,EAAI,CACxBI,EAAYT,OAAOC,MAAM,CAC7B,CAAEI,IAAAA,EAAKK,UAAWL,EAAKM,MAAOvB,EAAIwB,QAAQ,EAAG,EAC7CC,GAAAA,SAAQ,EAACzB,IAAQ,CACfuB,MAAO,AAAc,UAAbvB,EAAI0B,IAAI,EAAgB,MAAST,EACzC,GAAGjB,CAAG,AACR,EAGgB,CAAA,UAAdqB,EAAKK,IAAI,GACXV,EAAY,CAAA,EACZK,EAAKM,MAAM,CAAG,SAAUC,CAAa,CAAEC,CAAa,CAAEC,CAAS,EAC7D,+CAAc,AAAClD,CAAAA,IAAS,CAAA,EAAKC,IAAaiD,EAAI,QAChD,GAEFf,EAAKgB,IAAI,CAACV,EACZ,CAKF,MAHIW,GAAAA,SAAO,EAACvC,KAAcuB,GACxBtB,EAAYsB,GAEPD,CACT,GAEA,SAASkB,EAAiBC,CAAgD,EACpE7C,EAAMqB,UAAU,GAClBd,EAAQsC,EAAEC,MAAM,CAAC,EAAE,EACnBtC,EAAYqC,EAAEC,MAAM,CAAC,EAAE,EACvB9C,EAAMqB,UAAU,CAAC0B,QAAQ,MAAMF,EAAEC,MAAM,EAE3C,CAEA,oEAEwBhD,gDACAkD,QAAM,6BACzBC,MAAI,oBAAOjD,EAAMkD,GAAG,wEACCA,GAAAA,KAAG,EAAClD,EAAMkD,GAAG,4GAExBjD,qBAAckD,GAAAA,IAAE,EAAC,QAASnD,EAAML,IAAI,QAAQ,sDACpDsD,MAAI,oBAAOjD,EAAMoD,KAAK,+FAECpD,EAAMoD,KAAK,0CAGxBjD,SAAc,2DAEpBkD,KAAG,oBAAO5B,cACR,AAACd,IACA,IAAM2C,EAAU5C,EAAUC,GAE1B,4DACU2C,SAAe,yCACpB3C,EAAIuB,KAAK,OAGhB,qCAIK/B,SAAc,2DACtBkD,KAAG,oBAAOrD,EAAMuD,IAAI,WAClB,CAACC,EAAKf,+DAGAY,KAAG,oBAAO5B,cACR,AAACd,IACA,IAAM2C,EAAU5C,EAAUC,GACpB8C,EAAMnC,GAAAA,YAAU,EAAC,KACrB,GAAIX,AAAa,UAAbA,EAAI0B,IAAI,CAAc,CACxB,IAAMqB,EAAcrC,IAEpB,MAAO,AAACqC,CAAAA,EAAYnE,IAAI,CAAG,CAAA,EAAKmE,EAAYlE,QAAQ,CAAGiD,IAAM,CAC/D,CACA,IAAMkB,EAAMH,CAAG,CAAC7C,EAAIiB,GAAG,CAAC,OAGxB,AAFgBgC,GAAAA,SAAW,EAACD,IAAQA,AAAQ,OAARA,2CAGF3D,EAAM6D,QAAQ,QAEzCF,CACT,GAEA,4DACUL,SAAe,2DACpBL,MAAI,mBAAOa,GAAAA,SAAU,EAACnD,EAAI2B,MAAM,8CAAcmB,6BAC5C9C,EAAI2B,MAAM,CAACkB,CAAG,CAAC7C,EAAIiB,GAAG,CAAC,CAAE4B,EAAKf,cAIvC,mDAOXQ,MAAI,oBAAOjD,EAAM+D,OAAO,EAAEC,qEACK7D,8CAEzB8C,MAAI,oBAAO7C,wEACiBM,EAAUe,GAAS,CAAC,EAAE,6BAC9CzB,EAAMiE,WAAW,kDAGrBZ,KAAG,oBAAO5B,IAAUyC,MAAM,CAAC,AAACC,GAAM,CAACA,EAAE9B,IAAI,EAAI,CAAC,CAAC,QAAQ,CAAC+B,QAAQ,CAACD,EAAE9B,IAAI,aACrE,AAAC1B,IACA,IAAM2C,EAAU5C,EAAUC,GACpBgD,EAAMrC,GAAAA,YAAU,EAAC,KACrB,GAAItB,EAAMuD,IAAI,EAAES,QAAUhE,EAAM+D,OAAO,EAAEK,SAASzD,EAAIsB,SAAS,EAAG,KA9HvEoC,EAAmCzC,EA+H5B,OA/HPyC,EA+HkBrE,EAAMuD,IAAI,CA/HO3B,EA+HLjB,EAAIiB,GAAG,CA9HzCyC,EAAIC,MAAM,CAAC,SAAUC,CAAI,CAAEC,CAAI,EACpC,IAAMC,EAAOD,CAAI,CAAC5C,EAAI,OAEtB,AAAI8C,GAAAA,SAAQ,EAACD,IAASb,GAAAA,SAAW,EAACa,IAASA,AAAS,OAATA,EAClCF,EAEFA,EAAOC,CAAI,CAAC5C,EAAI,AACzB,EAAG,EAwHa,CACA,OAAO,IACT,GAEA,4DACU0B,SAAe,qCACpBK,QAGP,iDAMTV,MAAI,oBAAOjD,EAAMqB,UAAU,mEAQduB,qDALJrD,MACKC,MACJC,MACK4B,IAAa3B,SAAS,GAC5B2B,IAAa1B,IAAI,EAAIK,EAAML,IAAI,4OAM/C,WA0EKgF,sFAAAA,IAAAA,gBAaAC,0EAAAA,IAAAA,OAYLC,GAAAA,eAAa,EACX,UACA,CACEC,MAAO,KAAK,EACZ5B,IAAK,KAAK,EACV6B,QAAS,CAAA,EACTtD,QAAS,CAAC,EACV8B,KAAM,EAAE,CACRM,SAAU,IACVT,MAAO,KAAK,EACZrC,KAAM,KAAK,EACXC,QAAS,KAAK,EACdH,KAAK,QACLC,MAAM,UACNiD,QAAS,KAAK,EACdE,YAAa,KACb5C,WAAY,KAAK,EACjB1B,KAAM,KAAK,CACb,EACA,CAACE,EAAGmF,KACF,IAAMC,EAAKD,EAAIE,OAAO,CAChBC,EAAQC,GAAAA,YAAU,EACtB,CACElC,IAAK+B,EAAG/B,GAAG,CACXzB,QAASwD,EAAGxD,OAAO,CACnB8B,KAAM0B,EAAG1B,IAAI,CACblC,WAAY4D,EAAG5D,UAAU,CACzB0C,QAASkB,EAAGlB,OAAO,CACnBE,YAAagB,EAAGhB,WAAW,AAC7B,EACApE,EACA,CACEuD,MAAO,CAAC,CAAC6B,EAAGI,aAAa,CAAC,mBAAqBxF,EAAEuD,KAAK,AACxD,GAMF,MAHAjC,GAAAA,cAAY,EAAC,KACXmE,GAAAA,gBAAc,EAACL,EAAI,CAAC,MAAO,UAAW,OAAQ,aAAc,UAAU,CACxE,yCAGwBM,OAAK,6BACxB3F,EAAUuF,GAGjB,SAEF,EAAevF"}

package/lib/table/styles.js

@@ -118,5 +118,4 @@
     margin-block-start: 16px;
     margin-inline-start: auto;
   }
-`;
-//# sourceMappingURL=styles.js.map
+`;

package/lib/table/styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../components/table/styles.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const styles = css`\n  :host {\n    --table-heading-bg: var(--border-color);\n    --distance-horizontal: 16px;\n    --distance-vertical: 8px;\n  }\n\n  .table-cell {\n    padding: var(--distance-vertical) var(--distance-horizontal);\n\n    n-button::part(button) {\n      padding: 0;\n      min-block-size: unset;\n    }\n  }\n\n  .small {\n    --distance-horizontal: 12px;\n    --distance-vertical: 6px;\n  }\n\n  .large {\n    --distance-horizontal: 20px;\n    --distance-vertical: 10px;\n  }\n\n  .table {\n    border-collapse: collapse;\n    display: table;\n    border-block-end: 1px solid var(--table-heading-bg);\n    inline-size: 100%;\n    max-inline-size: 100%;\n    border-spacing: 0;\n    transition-property: border-color;\n    word-break: break-all;\n\n    &:has(.table-foot) {\n      border-block-end: none;\n    }\n\n    .table-title {\n      padding-block: var(--distance-vertical);\n      font-weight: bold;\n      text-align: start;\n    }\n\n    th {\n      font-weight: 500;\n      color: var(--text-heading);\n      background-color: var(--table-heading-bg);\n      transition-property: background-color, color;\n    }\n\n    .table-head {\n      .table-cell {\n        min-inline-size: 54px;\n\n        &:has(+ .table-cell) {\n          position: relative;\n\n          &::after {\n            position: absolute;\n            z-index: 1;\n            display: block;\n            margin: auto;\n            background-color: var(--text-secondary);\n            inset-block: 0;\n            inset-inline-end: 0;\n            content: '';\n            block-size: 16px;\n            inline-size: 1px;\n            opacity: 0.5;\n          }\n        }\n      }\n    }\n\n    :not(tfoot) {\n      tr:first-child th:first-child {\n        border-start-start-radius: var(--border-radius);\n      }\n\n      tr:first-child th:last-child {\n        border-start-end-radius: var(--border-radius);\n      }\n    }\n\n    .table-body {\n      tr:nth-child(2n) {\n        background-color: var(--primary-details-bg);\n      }\n\n      tr:hover {\n        background-color: var(--primary-selection);\n      }\n    }\n\n    .table-foot {\n      background-color: var(--primary-selection);\n\n      tr:last-child th:first-child {\n        border-end-start-radius: var(--border-radius);\n      }\n\n      tr:last-child td:last-child {\n        border-end-end-radius: var(--border-radius);\n      }\n    }\n\n    .empty-val {\n      opacity: 0.5;\n    }\n  }\n\n  .table-pagination {\n    display: block;\n    inline-size: fit-content;\n    margin-block-start: 16px;\n    margin-inline-start: auto;\n  }\n`;\n"],"names":["styles","css"],"mappings":"kGAEaA,8CAAAA,qBAFO,eAEPA,EAASC,GAAAA,KAAG,CAAA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwH1B,CAAC"}
+{"version":3,"sources":["components/table/styles.ts"],"sourcesContent":["import { css } from '@moneko/css';\n\nexport const styles = css`\n  :host {\n    --table-heading-bg: var(--border-color);\n    --distance-horizontal: 16px;\n    --distance-vertical: 8px;\n  }\n\n  .table-cell {\n    padding: var(--distance-vertical) var(--distance-horizontal);\n\n    n-button::part(button) {\n      padding: 0;\n      min-block-size: unset;\n    }\n  }\n\n  .small {\n    --distance-horizontal: 12px;\n    --distance-vertical: 6px;\n  }\n\n  .large {\n    --distance-horizontal: 20px;\n    --distance-vertical: 10px;\n  }\n\n  .table {\n    border-collapse: collapse;\n    display: table;\n    border-block-end: 1px solid var(--table-heading-bg);\n    inline-size: 100%;\n    max-inline-size: 100%;\n    border-spacing: 0;\n    transition-property: border-color;\n    word-break: break-all;\n\n    &:has(.table-foot) {\n      border-block-end: none;\n    }\n\n    .table-title {\n      padding-block: var(--distance-vertical);\n      font-weight: bold;\n      text-align: start;\n    }\n\n    th {\n      font-weight: 500;\n      color: var(--text-heading);\n      background-color: var(--table-heading-bg);\n      transition-property: background-color, color;\n    }\n\n    .table-head {\n      .table-cell {\n        min-inline-size: 54px;\n\n        &:has(+ .table-cell) {\n          position: relative;\n\n          &::after {\n            position: absolute;\n            z-index: 1;\n            display: block;\n            margin: auto;\n            background-color: var(--text-secondary);\n            inset-block: 0;\n            inset-inline-end: 0;\n            content: '';\n            block-size: 16px;\n            inline-size: 1px;\n            opacity: 0.5;\n          }\n        }\n      }\n    }\n\n    :not(tfoot) {\n      tr:first-child th:first-child {\n        border-start-start-radius: var(--border-radius);\n      }\n\n      tr:first-child th:last-child {\n        border-start-end-radius: var(--border-radius);\n      }\n    }\n\n    .table-body {\n      tr:nth-child(2n) {\n        background-color: var(--primary-details-bg);\n      }\n\n      tr:hover {\n        background-color: var(--primary-selection);\n      }\n    }\n\n    .table-foot {\n      background-color: var(--primary-selection);\n\n      tr:last-child th:first-child {\n        border-end-start-radius: var(--border-radius);\n      }\n\n      tr:last-child td:last-child {\n        border-end-end-radius: var(--border-radius);\n      }\n    }\n\n    .empty-val {\n      opacity: 0.5;\n    }\n  }\n\n  .table-pagination {\n    display: block;\n    inline-size: fit-content;\n    margin-block-start: 16px;\n    margin-inline-start: auto;\n  }\n`;\n"],"names":["styles","css"],"mappings":"kGAEaA,8CAAAA,qBAFO,eAEPA,EAASC,GAAAA,KAAG,CAAA,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwH1B,CAAC"}

package/lib/tabs/index.js

@@ -1,12 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return $}});const e=require("solid-js/web"),t=require("solid-js"),r=d(require("@moneko/common/lib/isFunction")),n=d(require("@moneko/common/lib/passiveSupported")),l=require("@moneko/css"),i=require("solid-element"),a=require("../basic-config"),o=d(require("../get-options")),s=function(e,t){if(e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var r=u(void 0);if(r&&r.has(e))return r.get(e);var n={__proto__:null},l=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var i in e)if("default"!==i&&Object.prototype.hasOwnProperty.call(e,i)){var a=l?Object.getOwnPropertyDescriptor(e,i):null;a&&(a.get||a.set)?Object.defineProperty(n,i,a):n[i]=e[i]}return n.default=e,r&&r.set(e,n),n}(require("../theme")),c=require("./style");function d(e){return e&&e.__esModule?e:{default:e}}function u(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,r=new WeakMap;return(u=function(e){return e?r:t})(e)}require("../button");const f=(0,e.template)("<style> "),v=(0,e.template)("<style>"),p=(0,e.template)(`<n-button class="tab add">＋`,!0,!1),m=(0,e.template)('<div><div class="items">'),g=(0,e.template)('<div class="content">'),h=(0,e.template)(`<span class="remove">⛌`),b=(0,e.template)("<n-button>",!0,!1);function _(i){let d,u,_;let{baseStyle:$,isDark:w}=s.default,[y,C]=(0,t.createSignal)(),[L,x]=(0,t.createSignal)(""),[E,k]=(0,t.createSignal)({left:!1,right:!1}),M=(0,t.createMemo)(()=>w()?(0,l.css)`
-        :host {
-          --tab-current-bg: var(--component-bg);
-          --tab-bg: rgb(255 255 255 / 4%);
-        }
-      `:(0,l.css)`
-      :host {
-        --tab-bg: var(--primary-details-bg);
-        --tab-current-bg: var(--component-bg);
-      }
-    `),O=(0,t.createMemo)(()=>Object.assign({},a.FieldName,i.fieldNames)),j=(0,t.createMemo)(()=>(0,o.default)(i.items,O())),q=(0,t.createMemo)(()=>j().find(e=>e[O().value]===y()));function S(e,t){if(!i.disabled&&!e.disabled){let n=e[O().value];void 0===i.value&&C(n),(0,r.default)(i.onChange)&&i.onChange(n,e,t)}}function P(e,t){"Enter"===t.key&&S(e,t)}function W(e,t,n){n.stopPropagation(),n.preventDefault(),(0,r.default)(i.onEdit)&&i.onEdit(e,t,n)}function T(e){if(_){let r=d.offsetWidth,l=u?.offsetWidth||0,i=_.scrollWidth;if(i>r-l){let t=0;e&&(n.default||(e.stopPropagation(),e.preventDefault()),t=0!==e.deltaX?e.deltaX:e.deltaY);let r=_.scrollLeft+t;_.scrollTo({left:r}),k({left:r>0,right:i>r+_.offsetWidth})}else k({left:!1,right:!1});let a=(0,t.untrack)(q)?.ref;x(`.tabs {--w: ${a.offsetWidth}px;--left: ${a.offsetLeft-_.scrollLeft+_.offsetLeft}px;--s:${_.scrollLeft}px}`)}}(0,t.createEffect)(()=>{let e=(0,t.untrack)(y);void 0!==i.value?e=i.value:void 0!==i.defaultValue?e=i.defaultValue:j()[0]&&(e=j()[0][O().value]),e!==(0,t.untrack)(y)&&C(e)}),(0,t.createEffect)(()=>{let e,r;let n=q()?.ref;n?e=setTimeout(()=>{clearTimeout(e),_&&(k({left:!1,right:!1}),_.scrollTo({left:n.offsetLeft-_.offsetLeft,behavior:"smooth"})),x(`.tabs {--w: ${n.offsetWidth}px;--left: ${n.offsetLeft-_.scrollLeft+_.offsetLeft}px;--s:${_.scrollLeft}px}`),r=setTimeout(()=>{clearTimeout(r),T()},300)},0):x(""),(0,t.onCleanup)(()=>{clearTimeout(e),clearTimeout(r)})});let[N,D]=(0,t.createSignal)("slide-in");(0,t.createEffect)(()=>(i.animated&&D("slide-in"),q()?.content));let F=(0,t.createMemo)(()=>(0,r.default)(i.extra?.left)?i.extra.left():i.extra?.left),V=(0,t.createMemo)(()=>(0,r.default)(i.extra?.right)?i.extra.right():i.extra?.right),A=(0,t.createMemo)(()=>{let e=q()?.content;return(0,r.default)(e)?e():e});function X(){i.animated&&D("")}return(0,t.onMount)(()=>{d?.addEventListener("wheel",T,{passive:n.default})}),(0,t.onCleanup)(()=>{d?.removeEventListener("wheel",T,!1)}),[(()=>{let t=f(),r=t.firstChild;return(0,e.effect)(()=>r.data=$()),t})(),(()=>{let t=f(),r=t.firstChild;return(0,e.effect)(()=>r.data=M()),t})(),(()=>{let e=v();return e.textContent=c.style,e})(),(()=>{let t=f(),r=t.firstChild;return(0,e.effect)(()=>r.data=L()),t})(),(0,e.createComponent)(t.Show,{get when(){return i.css},get children(){let t=f(),r=t.firstChild;return(0,e.effect)(()=>r.data=(0,l.css)(i.css)),t}}),(()=>{let r=m(),n=d,a=r.firstChild,o=_;return"function"==typeof n?(0,e.use)(n,r):d=r,(0,e.insert)(r,(0,e.createComponent)(t.Show,{get when(){return F()},get children(){return F()}}),a),"function"==typeof o?(0,e.use)(o,a):_=a,(0,e.insert)(a,(0,e.createComponent)(t.For,{get each(){return j()},children:(r,n)=>{let a=(0,t.createMemo)(()=>i.disabled||r.disabled),{icon:o,value:s,label:d}=O(),u=(0,t.createMemo)(()=>void 0!==y()&&r[s]===y());return(()=>{let i=b(),s=j()[n()].ref;return"function"==typeof s?(0,e.use)(s,i):j()[n()].ref=i,(0,e.addEventListener)(i,"click",S.bind(null,r),!0),(0,e.addEventListener)(i,"keyup",P.bind(null,r),!0),i.link=!0,i.css=c.btnCss,i._$owner=(0,e.getOwner)(),(0,e.insert)(i,()=>r[d],null),(0,e.insert)(i,(0,e.createComponent)(t.Show,{get when(){return r.closable},get children(){let t=h();return(0,e.addEventListener)(t,"click",W.bind(null,"remove",r),!0),t}}),null),(0,e.effect)(t=>{let s=u()?"primary":"default",c=(0,l.cx)("tab",r.class),d=!!u(),f=!!(u()&&0===n()),v=a()?-1:0,p=a(),m=r[o];return s!==t._v$6&&(i.type=t._v$6=s),c!==t._v$7&&(0,e.className)(i,t._v$7=c),d!==t._v$8&&i.classList.toggle("active",t._v$8=d),f!==t._v$9&&i.classList.toggle("first-active",t._v$9=f),v!==t._v$10&&(i.tabindex=t._v$10=v),p!==t._v$11&&(i.disabled=t._v$11=p),m!==t._v$12&&(i.icon=t._v$12=m),t},{_v$6:void 0,_v$7:void 0,_v$8:void 0,_v$9:void 0,_v$10:void 0,_v$11:void 0,_v$12:void 0}),i})()}})),(0,e.insert)(r,(0,e.createComponent)(t.Show,{get when(){return i.add},get children(){let t=p(),r=u;return(0,e.addEventListener)(t,"click",W.bind(null,"add",void 0),!0),"function"==typeof r?(0,e.use)(r,t):u=t,t.link=!0,t.css=c.addCss,t._$owner=(0,e.getOwner)(),t}}),null),(0,e.insert)(r,(0,e.createComponent)(t.Show,{get when(){return V()},get children(){return V()}}),null),(0,e.effect)(t=>{let n=(0,l.cx)("tabs",i.type,i.class),o=!!i.centered,s=i.disabled,c=!!E().left,d=!!E().right;return n!==t._v$&&(0,e.className)(r,t._v$=n),o!==t._v$2&&r.classList.toggle("centered",t._v$2=o),s!==t._v$3&&(0,e.setAttribute)(r,"aria-disabled",t._v$3=s),c!==t._v$4&&a.classList.toggle("warp-left",t._v$4=c),d!==t._v$5&&a.classList.toggle("warp-right",t._v$5=d),t},{_v$:void 0,_v$2:void 0,_v$3:void 0,_v$4:void 0,_v$5:void 0}),r})(),(0,e.createComponent)(t.Show,{get when(){return q()?.content},get children(){let t=g();return(0,e.addEventListener)(t,"animationend",X),(0,e.insert)(t,A),(0,e.effect)(r=>(0,e.classList)(t,{[N()]:i.animated},r)),t}})]}(0,i.customElement)("n-tabs",{class:void 0,css:void 0,disabled:void 0,value:void 0,defaultValue:void 0,centered:void 0,items:[],type:"line",fieldNames:void 0,add:void 0,extra:void 0,animated:void 0},(r,n)=>{let l=n.element,i=(0,t.mergeProps)({onChange(e,t,r){l.dispatchEvent(new CustomEvent("change",{detail:[e,t,r]}))},onEdit(e,t,r){l.dispatchEvent(new CustomEvent("edit",{detail:[e,t,r]}))}},r);return(0,t.createEffect)(()=>{(0,a.clearAttribute)(l,["css","fieldNames","items","extra"])}),[(()=>{let e=v();return e.textContent=s.block,e})(),(0,e.createComponent)(_,i)]});const $=_;(0,e.delegateEvents)(["click","keyup"]);
-//# sourceMappingURL=index.js.map
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return w}});const e=require("solid-js/web"),t=require("solid-js"),r=c(require("@moneko/common/lib/isFunction")),n=c(require("@moneko/common/lib/passiveSupported")),l=require("@moneko/css"),i=require("solid-element"),a=require("../basic-config"),o=c(require("../get-options")),s=f(require("../theme")),d=require("./style");function c(e){return e&&e.__esModule?e:{default:e}}function u(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,r=new WeakMap;return(u=function(e){return e?r:t})(e)}function f(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var r=u(t);if(r&&r.has(e))return r.get(e);var n={__proto__:null},l=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var i in e)if("default"!==i&&Object.prototype.hasOwnProperty.call(e,i)){var a=l?Object.getOwnPropertyDescriptor(e,i):null;a&&(a.get||a.set)?Object.defineProperty(n,i,a):n[i]=e[i]}return n.default=e,r&&r.set(e,n),n}require("../button");const v=(0,e.template)("<style> "),p=(0,e.template)("<style>"),m=(0,e.template)(`<n-button class="tab add">＋`,!0,!1),g=(0,e.template)('<div><div class="items">'),h=(0,e.template)('<div class="content">'),b=(0,e.template)(`<span class="remove">⛌`),_=(0,e.template)("<n-button>",!0,!1);function $(i){let c,u,f;let{baseStyle:$,isDark:w}=s.default,[y,C]=(0,t.createSignal)(),[L,x]=(0,t.createSignal)(""),[E,k]=(0,t.createSignal)({left:!1,right:!1}),M=(0,t.createMemo)(()=>{let e=w();return(0,l.css)({":host":{"--tab-bg":e?"rgb(255 255 255 / 4%)":"var(--primary-details-bg)","--tab-current-bg":"var(--component-bg)"}})}),O=(0,t.createMemo)(()=>Object.assign({},a.FieldName,i.fieldNames)),j=(0,t.createMemo)(()=>(0,o.default)(i.items,O())),q=(0,t.createMemo)(()=>j().find(e=>e[O().value]===y()));function S(e,t){if(!i.disabled&&!e.disabled){let n=e[O().value];void 0===i.value&&C(n),(0,r.default)(i.onChange)&&i.onChange(n,e,t)}}function P(e,t){"Enter"===t.key&&S(e,t)}function W(e,t,n){n.stopPropagation(),n.preventDefault(),(0,r.default)(i.onEdit)&&i.onEdit(e,t,n)}function T(e){if(f){let r=c.offsetWidth,l=u?.offsetWidth||0,i=f.scrollWidth;if(i>r-l){let t=0;e&&(n.default||(e.stopPropagation(),e.preventDefault()),t=0!==e.deltaX?e.deltaX:e.deltaY);let r=f.scrollLeft+t;f.scrollTo({left:r}),k({left:r>0,right:i>r+f.offsetWidth})}else k({left:!1,right:!1});let a=(0,t.untrack)(q)?.ref;x(`.tabs {--w: ${a.offsetWidth}px;--left: ${a.offsetLeft-f.scrollLeft+f.offsetLeft}px;--s:${f.scrollLeft}px}`)}}(0,t.createEffect)(()=>{let e=(0,t.untrack)(y);void 0!==i.value?e=i.value:void 0!==i.defaultValue?e=i.defaultValue:j()[0]&&(e=j()[0][O().value]),e!==(0,t.untrack)(y)&&C(e)}),(0,t.createEffect)(()=>{let e,r;let n=q()?.ref;n?e=setTimeout(()=>{clearTimeout(e),f&&(k({left:!1,right:!1}),f.scrollTo({left:n.offsetLeft-f.offsetLeft,behavior:"smooth"})),x(`.tabs {--w: ${n.offsetWidth}px;--left: ${n.offsetLeft-f.scrollLeft+f.offsetLeft}px;--s:${f.scrollLeft}px}`),r=setTimeout(()=>{clearTimeout(r),T()},300)},0):x(""),(0,t.onCleanup)(()=>{clearTimeout(e),clearTimeout(r)})});let[N,D]=(0,t.createSignal)("slide-in");(0,t.createEffect)(()=>(i.animated&&D("slide-in"),q()?.content));let F=(0,t.createMemo)(()=>(0,r.default)(i.extra?.left)?i.extra.left():i.extra?.left),V=(0,t.createMemo)(()=>(0,r.default)(i.extra?.right)?i.extra.right():i.extra?.right),A=(0,t.createMemo)(()=>{let e=q()?.content;return(0,r.default)(e)?e():e});function X(){i.animated&&D("")}return(0,t.onMount)(()=>{c?.addEventListener("wheel",T,{passive:n.default})}),(0,t.onCleanup)(()=>{c?.removeEventListener("wheel",T,!1)}),[(()=>{let t=v(),r=t.firstChild;return(0,e.effect)(()=>r.data=$()),t})(),(()=>{let t=v(),r=t.firstChild;return(0,e.effect)(()=>r.data=M()),t})(),(()=>{let e=p();return e.textContent=d.style,e})(),(()=>{let t=v(),r=t.firstChild;return(0,e.effect)(()=>r.data=L()),t})(),(0,e.createComponent)(t.Show,{get when(){return i.css},get children(){let t=v(),r=t.firstChild;return(0,e.effect)(()=>r.data=(0,l.css)(i.css)),t}}),(()=>{let r=g(),n=c,a=r.firstChild,o=f;return"function"==typeof n?(0,e.use)(n,r):c=r,(0,e.insert)(r,(0,e.createComponent)(t.Show,{get when(){return F()},get children(){return F()}}),a),"function"==typeof o?(0,e.use)(o,a):f=a,(0,e.insert)(a,(0,e.createComponent)(t.For,{get each(){return j()},children:(r,n)=>{let a=(0,t.createMemo)(()=>i.disabled||r.disabled),{icon:o,value:s,label:c}=O(),u=(0,t.createMemo)(()=>void 0!==y()&&r[s]===y());return(()=>{let i=_(),s=j()[n()].ref;return"function"==typeof s?(0,e.use)(s,i):j()[n()].ref=i,(0,e.addEventListener)(i,"click",S.bind(null,r),!0),(0,e.addEventListener)(i,"keyup",P.bind(null,r),!0),i.link=!0,i.css=d.btnCss,i._$owner=(0,e.getOwner)(),(0,e.insert)(i,()=>r[c],null),(0,e.insert)(i,(0,e.createComponent)(t.Show,{get when(){return r.closable},get children(){let t=b();return(0,e.addEventListener)(t,"click",W.bind(null,"remove",r),!0),t}}),null),(0,e.effect)(t=>{let s=u()?"primary":"default",d=(0,l.cx)("tab",r.class),c=!!u(),f=!!(u()&&0===n()),v=a()?-1:0,p=a(),m=r[o];return s!==t._v$6&&(i.type=t._v$6=s),d!==t._v$7&&(0,e.className)(i,t._v$7=d),c!==t._v$8&&i.classList.toggle("active",t._v$8=c),f!==t._v$9&&i.classList.toggle("first-active",t._v$9=f),v!==t._v$10&&(i.tabindex=t._v$10=v),p!==t._v$11&&(i.disabled=t._v$11=p),m!==t._v$12&&(i.icon=t._v$12=m),t},{_v$6:void 0,_v$7:void 0,_v$8:void 0,_v$9:void 0,_v$10:void 0,_v$11:void 0,_v$12:void 0}),i})()}})),(0,e.insert)(r,(0,e.createComponent)(t.Show,{get when(){return i.add},get children(){let t=m(),r=u;return(0,e.addEventListener)(t,"click",W.bind(null,"add",void 0),!0),"function"==typeof r?(0,e.use)(r,t):u=t,t.link=!0,t.css=d.addCss,t._$owner=(0,e.getOwner)(),t}}),null),(0,e.insert)(r,(0,e.createComponent)(t.Show,{get when(){return V()},get children(){return V()}}),null),(0,e.effect)(t=>{let n=(0,l.cx)("tabs",i.type,i.class),o=!!i.centered,s=i.disabled,d=!!E().left,c=!!E().right;return n!==t._v$&&(0,e.className)(r,t._v$=n),o!==t._v$2&&r.classList.toggle("centered",t._v$2=o),s!==t._v$3&&(0,e.setAttribute)(r,"aria-disabled",t._v$3=s),d!==t._v$4&&a.classList.toggle("warp-left",t._v$4=d),c!==t._v$5&&a.classList.toggle("warp-right",t._v$5=c),t},{_v$:void 0,_v$2:void 0,_v$3:void 0,_v$4:void 0,_v$5:void 0}),r})(),(0,e.createComponent)(t.Show,{get when(){return q()?.content},get children(){let t=h();return(0,e.addEventListener)(t,"animationend",X),(0,e.insert)(t,A),(0,e.effect)(r=>(0,e.classList)(t,{[N()]:i.animated},r)),t}})]}(0,i.customElement)("n-tabs",{class:void 0,css:void 0,disabled:void 0,value:void 0,defaultValue:void 0,centered:void 0,items:[],type:"line",fieldNames:void 0,add:void 0,extra:void 0,animated:void 0},(r,n)=>{let l=n.element,i=(0,t.mergeProps)({onChange(e,t,r){l.dispatchEvent(new CustomEvent("change",{detail:[e,t,r]}))},onEdit(e,t,r){l.dispatchEvent(new CustomEvent("edit",{detail:[e,t,r]}))}},r);return(0,t.createEffect)(()=>{(0,a.clearAttribute)(l,["css","fieldNames","items","extra"])}),[(()=>{let e=p();return e.textContent=s.block,e})(),(0,e.createComponent)($,i)]});const w=$;(0,e.delegateEvents)(["click","keyup"]);