@iziui/react 0.0.91-rc → 0.0.93-rc

package/dist/chunks/{useMenu-DuX7EGHi.js.map → useMenu-DLaxCUF_.js.map}

@@ -1 +1 @@
-{"version":3,"file":"useMenu-DuX7EGHi.js","sources":["../../../../toolkit/src/debounce/debounce.ts","../../src/navigation/Menu/Menu.tsx","../../src/navigation/Menu/useMenu.ts"],"sourcesContent":["class Debounce {\n  private timeout: NodeJS.Timeout | undefined;\n  public delay(func: (a?: any) => void, milliseconds = 500) {\n    if (!milliseconds) {\n      func();\n      return;\n    }\n\n    clearTimeout(this.timeout);\n    this.timeout = setTimeout(() => { func(); }, milliseconds);\n  }\n}\n\nexport const debounce = new Debounce();\n","import {\n  useMemo,\n  useState,\n  useEffect,\n  Children,\n  forwardRef,\n  type ReactElement,\n  type CSSProperties,\n  type HTMLAttributes,\n  cloneElement\n} from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils';\n\nimport { uuid } from '@iziui/toolkit/uuid';\nimport { debounce } from '@iziui/toolkit/debounce';\n\nimport useListenerResized from '@/hooks/useListenerResized';\nimport { Card, CardContent } from '@/display/Card';\n\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/Menu.scss';\n\ntype Direction = 'left' | 'right' | 'center';\ntype AnimationClass = 'open' | 'close';\ntype State = 'visible' | 'invisible';\ntype Coordinates = { top?: number; right?: number; bottom?: number; left?: number; };\ntype Config = { animation: AnimationClass, state: State; width: CSSProperties['width'] };\n\nexport interface MenuProps extends HTMLAttributes<HTMLDivElement> {\n  open: boolean;\n  autoClose?: boolean;\n  maxHeight?: CSSProperties['maxHeight'];\n  direction?: Direction;\n  anchorEl: HTMLElement | null;\n  width?: CSSProperties['width'];\n  children: React.JSX.Element | React.JSX.Element[];\n  onClose: (e?: React.MouseEvent<HTMLButtonElement>) => void;\n}\n\nconst Menu = forwardRef<HTMLDivElement, MenuProps>(function Menu({\n  open,\n  width,\n  children,\n  anchorEl,\n  direction = 'left',\n  maxHeight,\n  autoClose,\n  onClose,\n  ...props\n}: MenuProps, ref) {\n  const [coordinate, setCoordinate] = useState<Coordinates>();\n  const [config, setConfig] = useState<Config>({ state: 'invisible', animation: 'close', width: 'auto' });\n\n  const GAP = 16;\n  const ANIMATION_DURATION = 150;\n\n  const arrayChildren = Children.toArray(children) as ReactElement<any>[];\n\n  const id = useMemo(() => uuid(), []);\n\n  const classes = joinClass(\n    `${prefix}-menu`,\n    `${prefix}-menu--${config?.animation}`,\n    props.className\n  );\n\n  useListenerResized(() => changePosition(), [anchorEl]);\n\n  useEffect(() => { changePosition(); }, [anchorEl]);\n\n  // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n  useEffect(() => { open ? handleOpen() : handleClose(); }, [open]);\n\n  const changePosition = () => {\n    if (!anchorEl) { return; }\n\n    setTimeout(() => {\n      let coordinates: Coordinates = {};\n\n      const { offsetWidth, offsetHeight, offsetLeft, offsetTop } = anchorEl;\n\n      setConfig(prev => ({ ...prev, width: offsetWidth }));\n\n      const top = offsetTop + offsetHeight + (GAP / 2);\n\n      const el = document.getElementById(id) as HTMLElement;\n\n      if (direction === 'center') { coordinates = { top, right: offsetWidth }; }\n\n      if (direction === 'left') { coordinates = { top, left: offsetLeft }; }\n\n      if (direction === 'right') { coordinates = { top, left: offsetLeft - (el.offsetWidth - offsetWidth) }; }\n\n      setCoordinate(coordinates);\n    }, 0);\n  };\n\n  const handleOpen = () => {\n    setConfig(prev => ({ ...prev, state: 'visible' }));\n\n    setTimeout(() => { setConfig(prev => ({ ...prev, animation: 'open' })); }, 10);\n  };\n\n  const handleClose = () => {\n    setConfig(prev => ({ ...prev, animation: 'close' }));\n\n    setTimeout(() => {\n      setConfig(prev => ({ ...prev, state: 'invisible' }));\n      onClose();\n    }, ANIMATION_DURATION);\n  };\n\n  const renderChildren = () => {\n    return arrayChildren.map((child, index) => {\n      return cloneElement(child, {\n        'tabIndex': index + 1,\n        key: `button-${index}`,\n        onClick: (e: React.MouseEvent<HTMLButtonElement>) => {\n          debounce.delay(() => {\n\n            if (autoClose) { handleClose(); }\n\n            if (child.props.onClick) { child.props.onClick(e); }\n          }, 0);\n        },\n      });\n    });\n  };\n\n  return (\n    <>\n      <div\n        id={id}\n        ref={ref}\n        {...props}\n        style={{\n          width: width || config.width,\n          top: coordinate?.top,\n          left: coordinate?.left,\n          display: config?.state === 'visible' ? 'block' : 'none',\n          transition: `all ${ANIMATION_DURATION}ms ease-in`,\n          zIndex: 50,\n          ...props.style\n        }}\n        className={classes}\n      >\n        {\n          open && (\n            <Card className={`${prefix}-menu__card`}>\n              <CardContent\n                className={`${prefix}-menu__card__content`}\n                sx={{ py: 1 }}\n                style={{ display: 'flex', flexDirection: 'column', maxHeight }}\n              >\n                {renderChildren()}\n              </CardContent>\n            </Card>\n          )\n        }\n      </div>\n      {open && <div className={`${prefix}-menu__overlay`} onClick={handleClose} />}\n    </>\n  );\n});\n\nexport default createComponent(Menu);\n","import { useState } from 'react';\n\ntype UseMenu = [\n  boolean,\n  HTMLElement | null,\n  (event?: React.MouseEvent<HTMLButtonElement>) => void,\n];\n\nexport default function useMenu(): UseMenu {\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);\n\n  const open = Boolean(anchorEl);\n\n  const handleOpen = (event?: React.MouseEvent<HTMLElement, MouseEvent>) => {\n    setAnchorEl(event ? event.currentTarget : null);\n  };\n\n  const handleClose = () => { setAnchorEl(null); };\n\n  const handleToggle = (event?: React.MouseEvent<HTMLElement, MouseEvent>) => {\n    if (open) {\n      handleClose();\n      return;\n    }\n\n    handleOpen(event);\n  };\n\n  return [open, anchorEl, handleToggle];\n}\n"],"names":["Debounce","func","milliseconds","debounce","Menu","forwardRef","open","width","children","anchorEl","direction","maxHeight","autoClose","onClose","props","ref","coordinate","setCoordinate","useState","config","setConfig","GAP","ANIMATION_DURATION","arrayChildren","Children","id","useMemo","uuid","classes","joinClass","prefix","useListenerResized","changePosition","useEffect","handleOpen","handleClose","coordinates","offsetWidth","offsetHeight","offsetLeft","offsetTop","prev","top","el","renderChildren","child","index","cloneElement","e","jsxs","Fragment","jsx","Card","CardContent","Menu$1","createComponent","useMenu","setAnchorEl","event"],"mappings":"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"}
+{"version":3,"file":"useMenu-DLaxCUF_.js","sources":["../../../../toolkit/src/debounce/debounce.ts","../../src/navigation/Menu/Menu.tsx","../../src/navigation/Menu/useMenu.ts"],"sourcesContent":["class Debounce {\n  private timeout: NodeJS.Timeout | undefined;\n  public delay(func: (a?: any) => void, milliseconds = 500) {\n    if (!milliseconds) {\n      func();\n      return;\n    }\n\n    clearTimeout(this.timeout);\n    this.timeout = setTimeout(() => { func(); }, milliseconds);\n  }\n}\n\nexport const debounce = new Debounce();\n","import {\n  useMemo,\n  useState,\n  useEffect,\n  Children,\n  forwardRef,\n  type ReactElement,\n  type CSSProperties,\n  type HTMLAttributes,\n  cloneElement\n} from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils';\n\nimport { uuid } from '@iziui/toolkit/uuid';\nimport { debounce } from '@iziui/toolkit/debounce';\n\nimport useListenerResized from '@/hooks/useListenerResized';\nimport { Card, CardContent } from '@/display/Card';\n\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/Menu.scss';\n\ntype Direction = 'left' | 'right' | 'center';\ntype AnimationClass = 'open' | 'close';\ntype State = 'visible' | 'invisible';\ntype Coordinates = { top?: number; right?: number; bottom?: number; left?: number; };\ntype Config = { animation: AnimationClass, state: State; width: CSSProperties['width'] };\n\nexport interface MenuProps extends HTMLAttributes<HTMLDivElement> {\n  open: boolean;\n  autoClose?: boolean;\n  maxHeight?: CSSProperties['maxHeight'];\n  direction?: Direction;\n  anchorEl: HTMLElement | null;\n  width?: CSSProperties['width'];\n  children: React.JSX.Element | React.JSX.Element[];\n  onClose: (e?: React.MouseEvent<HTMLButtonElement>) => void;\n}\n\nconst Menu = forwardRef<HTMLDivElement, MenuProps>(function Menu({\n  open,\n  width,\n  children,\n  anchorEl,\n  direction = 'left',\n  maxHeight,\n  autoClose,\n  onClose,\n  ...props\n}: MenuProps, ref) {\n  const [coordinate, setCoordinate] = useState<Coordinates>();\n  const [config, setConfig] = useState<Config>({ state: 'invisible', animation: 'close', width: 'auto' });\n\n  const GAP = 16;\n  const ANIMATION_DURATION = 150;\n\n  const arrayChildren = Children.toArray(children) as ReactElement<any>[];\n\n  const id = useMemo(() => uuid(), []);\n\n  const classes = joinClass(\n    `${prefix}-menu`,\n    `${prefix}-menu--${config?.animation}`,\n    props.className\n  );\n\n  useListenerResized(() => changePosition(), [anchorEl]);\n\n  useEffect(() => { changePosition(); }, [anchorEl]);\n\n  // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n  useEffect(() => { open ? handleOpen() : handleClose(); }, [open]);\n\n  const changePosition = () => {\n    if (!anchorEl) { return; }\n\n    setTimeout(() => {\n      let coordinates: Coordinates = {};\n\n      const { offsetWidth, offsetHeight, offsetLeft, offsetTop } = anchorEl;\n\n      setConfig(prev => ({ ...prev, width: offsetWidth }));\n\n      const top = offsetTop + offsetHeight + (GAP / 2);\n\n      const el = document.getElementById(id) as HTMLElement;\n\n      if (direction === 'center') { coordinates = { top, right: offsetWidth }; }\n\n      if (direction === 'left') { coordinates = { top, left: offsetLeft }; }\n\n      if (direction === 'right') { coordinates = { top, left: offsetLeft - (el.offsetWidth - offsetWidth) }; }\n\n      setCoordinate(coordinates);\n    }, 0);\n  };\n\n  const handleOpen = () => {\n    setConfig(prev => ({ ...prev, state: 'visible' }));\n\n    setTimeout(() => { setConfig(prev => ({ ...prev, animation: 'open' })); }, 10);\n  };\n\n  const handleClose = () => {\n    setConfig(prev => ({ ...prev, animation: 'close' }));\n\n    setTimeout(() => {\n      setConfig(prev => ({ ...prev, state: 'invisible' }));\n      onClose();\n    }, ANIMATION_DURATION);\n  };\n\n  const renderChildren = () => {\n    return arrayChildren.map((child, index) => {\n      return cloneElement(child, {\n        'tabIndex': index + 1,\n        key: `button-${index}`,\n        onClick: (e: React.MouseEvent<HTMLButtonElement>) => {\n          debounce.delay(() => {\n\n            if (autoClose) { handleClose(); }\n\n            if (child.props.onClick) { child.props.onClick(e); }\n          }, 0);\n        },\n      });\n    });\n  };\n\n  return (\n    <>\n      <div\n        id={id}\n        ref={ref}\n        {...props}\n        style={{\n          width: width || config.width,\n          top: coordinate?.top,\n          left: coordinate?.left,\n          display: config?.state === 'visible' ? 'block' : 'none',\n          transition: `all ${ANIMATION_DURATION}ms ease-in`,\n          zIndex: 50,\n          ...props.style\n        }}\n        className={classes}\n      >\n        {\n          open && (\n            <Card className={`${prefix}-menu__card`}>\n              <CardContent\n                className={`${prefix}-menu__card__content`}\n                sx={{ py: 1 }}\n                style={{ display: 'flex', flexDirection: 'column', maxHeight }}\n              >\n                {renderChildren()}\n              </CardContent>\n            </Card>\n          )\n        }\n      </div>\n      {open && <div className={`${prefix}-menu__overlay`} onClick={handleClose} />}\n    </>\n  );\n});\n\nexport default createComponent(Menu);\n","import { useState } from 'react';\n\ntype UseMenu = [\n  boolean,\n  HTMLElement | null,\n  (event?: React.MouseEvent<HTMLButtonElement>) => void,\n];\n\nexport default function useMenu(): UseMenu {\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);\n\n  const open = Boolean(anchorEl);\n\n  const handleOpen = (event?: React.MouseEvent<HTMLElement, MouseEvent>) => {\n    setAnchorEl(event ? event.currentTarget : null);\n  };\n\n  const handleClose = () => { setAnchorEl(null); };\n\n  const handleToggle = (event?: React.MouseEvent<HTMLElement, MouseEvent>) => {\n    if (open) {\n      handleClose();\n      return;\n    }\n\n    handleOpen(event);\n  };\n\n  return [open, anchorEl, handleToggle];\n}\n"],"names":["Debounce","func","milliseconds","debounce","Menu","forwardRef","open","width","children","anchorEl","direction","maxHeight","autoClose","onClose","props","ref","coordinate","setCoordinate","useState","config","setConfig","GAP","ANIMATION_DURATION","arrayChildren","Children","id","useMemo","uuid","classes","joinClass","prefix","useListenerResized","changePosition","useEffect","handleOpen","handleClose","coordinates","offsetWidth","offsetHeight","offsetLeft","offsetTop","prev","top","el","renderChildren","child","index","cloneElement","e","jsxs","Fragment","jsx","Card","CardContent","Menu$1","createComponent","useMenu","setAnchorEl","event"],"mappings":"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"}

package/dist/chunks/useTabs-DaDm5Ou4.cjs

@@ -0,0 +1,2 @@
+"use strict";const f=require("react/jsx-runtime"),c=require("react"),a=require("./index-DYxwT4uW.cjs"),h=require("./joinClass-Jk3EszKD.cjs"),E=require("./uuid-omnJ9TjZ.cjs"),v=require("./createComponent-B2C4sTOb.cjs"),N=require("./useListenerResized-AwpsZLcP.cjs"),w=require("./Slide-D4aLHjYS.cjs");function I(e,r){if(r>e)throw new Error(`Current tab index (${r}) is greater than the number of tabs (${e})`)}function R({children:e,color:r="primary",current:n=0,onChange:u,...o}){const l=c.Children.toArray(e),[i,b]=c.useState(n),m=c.useRef([]),x=h.joinClass(`${a.prefix}-tabs`,`${a.prefix}-tabs--${r}`,o.className),p=h.joinClass(`${a.prefix}-tabs__marker`,`${a.prefix}-tabs__marker--${r}`),$=c.useMemo(()=>`marker-${E.uuid()}`,[]);N.useListenerResized(()=>C(),[i]),c.useEffect(()=>{I(l.length-1,i)},[]),c.useEffect(()=>{const t=l.findIndex(d=>!d.props.disabled),s=l[n].props.disabled;b(s?t:n)},[n]),c.useEffect(()=>{C(),j(i)},[i]);const T=t=>{u&&u(t),b(t)},j=t=>{m.current&&m.current[t].scrollIntoView({behavior:"smooth",block:"nearest",inline:"center"})},k=(t,s)=>{!m.current||!s||(m.current[t]=s)},C=()=>{const t=document.querySelector(`#tab-${$}-${i}`),s=document.getElementById($),d=t.offsetWidth,_=t.offsetLeft;s.style.width=`${d}px`,s.style.left=`${_}px`},y=()=>l.map((t,s)=>{const d=`tab-${$}-${s}`,_=i===s;return f.jsx("div",{ref:q=>k(s,q),style:{width:"100%"},children:c.cloneElement(t,{id:d,tabIndex:s+1,"aria-checked":_,onClick:()=>T(s)})},d)});return f.jsxs("div",{...o,className:x,children:[y(),f.jsx("div",{id:$,className:p})]})}const B=v.createComponent(R);function S({icon:e,label:r,disabled:n,color:u="primary",...o}){const{"aria-checked":l}=o,i=h.joinClass(`${a.prefix}-tabs__button`,n&&`${a.prefix}-tabs__button--disabled`,l&&`${a.prefix}-tabs__button--active-${u}`,o.className),b=()=>e&&c.cloneElement(e,{className:h.joinClass(`${a.prefix}-tabs__button__icon`)});return f.jsxs("button",{type:"button",disabled:n,className:i,...o,children:[b(),r]})}function L({children:e,value:r,current:n,...u}){return r===n&&f.jsx(w.Slide,{enter:!0,direction:"left",children:f.jsx("div",{...u,children:e})})}function g(e){const[r,n]=c.useState(e);return c.useEffect(()=>{n(e)},[e]),[o=>{n(o)},r]}exports.TabButton=S;exports.TabContent=L;exports.Tabs_default=B;exports.useTabs=g;
+//# sourceMappingURL=useTabs-DaDm5Ou4.cjs.map

package/dist/chunks/useTabs-DaDm5Ou4.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTabs-DaDm5Ou4.cjs","sources":["../../src/navigation/Tabs/Tabs.tsx","../../src/navigation/Tabs/TabButton.tsx","../../src/navigation/Tabs/TabContent.tsx","../../src/navigation/Tabs/useTabs.ts"],"sourcesContent":["import { Children, cloneElement, ReactElement, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils';\nimport { Colors } from '@iziui/core/theme';\n\nimport { uuid } from '@iziui/toolkit/uuid';\n\nimport createComponent from '@/core/createComponent';\nimport useListenerResized from '@/hooks/useListenerResized';\n\nimport '@iziui/styles/components/Tabs.scss';\n\nfunction validateCurrent(length: number, current: number) {\n  if (current > length) {\n    throw new Error(`Current tab index (${current}) is greater than the number of tabs (${length})`);\n  }\n}\n\nexport interface TabsProps extends Omit<React.HTMLProps<HTMLDivElement>, 'onChange'> {\n  current?: number;\n  color?: Colors;\n  children: React.ReactNode;\n  onChange?: (index: number) => void;\n};\n\nfunction Tabs({\n  children,\n  color = 'primary',\n  current = 0,\n  onChange,\n  ...props\n}: TabsProps) {\n  const arrayChildren = Children.toArray(children) as ReactElement<TabsProps>[];\n\n  const [_current, setCurrent] = useState(current);\n  const scrollRef = useRef<HTMLDivElement[] | null>([]);\n\n  const cls = joinClass(\n    `${prefix}-tabs`,\n    `${prefix}-tabs--${color}`,\n    props.className\n  );\n\n  const classNameMarker = joinClass(\n    `${prefix}-tabs__marker`,\n    `${prefix}-tabs__marker--${color}`,\n  );\n\n  const id = useMemo(() => `marker-${uuid()}`, []);\n\n  useListenerResized(() => setBorderLine(), [_current]);\n\n  useEffect(() => { validateCurrent(arrayChildren.length - 1, _current); }, []);\n\n  useEffect(() => {\n    const firstEnableButton = arrayChildren.findIndex(children => !children.props.disabled);\n    const currentIsDisabled = arrayChildren[current].props.disabled;\n\n    setCurrent(currentIsDisabled ? firstEnableButton : current);\n  }, [current]);\n\n  useEffect(() => {\n    setBorderLine();\n    goToTab(_current);\n  }, [_current]);\n\n  const handleClick = (index: number) => {\n    if (onChange) { onChange(index); };\n    setCurrent(index);\n  };\n\n  const goToTab = (index: number) => {\n    if (!scrollRef.current) { return; }\n    scrollRef.current[index].scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'center', });\n  };\n\n  const setRef = (index: number, ref: HTMLDivElement | null) => {\n    if (!scrollRef.current || !ref) { return; }\n\n    scrollRef.current[index] = ref;\n  };\n\n  const setBorderLine = () => {\n    const element = document.querySelector(`#tab-${id}-${_current}`) as HTMLElement;\n    const el = document.getElementById(id) as HTMLElement;\n\n    const width = element['offsetWidth'];\n    const left = element['offsetLeft'];\n\n    el.style.width = `${width}px`;\n    el.style.left = `${left}px`;\n  };\n\n  const renderChildren = () => {\n    return arrayChildren.map((child, index) => {\n      const _id = `tab-${id}-${index}`;\n      const isActive = _current === index;\n\n      return (\n        <div key={_id} ref={ref => setRef(index, ref)} style={{ width: '100%' }}>\n          {\n            cloneElement(child, {\n              id: _id,\n              tabIndex: index + 1,\n              'aria-checked': isActive,\n              onClick: () => handleClick(index),\n            })\n          }\n        </div>\n      );\n    });\n  };\n\n  return (\n    <div {...props} className={cls}>\n      {renderChildren()}\n      <div id={id} className={classNameMarker} />\n    </div>\n  );\n}\n\nexport default createComponent(Tabs);\n","import { cloneElement, HTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { Colors } from '@iziui/core/theme';\nimport { joinClass } from '@iziui/core/utils';\n\nimport type { IconProps } from '@/display/Icon';\n\nexport interface TabButtonProps extends HTMLAttributes<HTMLButtonElement> {\n  label: string;\n  disabled?: boolean;\n  color?: Colors;\n  icon?: React.JSX.Element;\n}\n\nexport default function TabButton({ icon, label, disabled, color = 'primary', ...props }: TabButtonProps) {\n  const { 'aria-checked': checked } = props;\n\n  const className = joinClass(\n    `${prefix}-tabs__button`,\n    disabled && `${prefix}-tabs__button--disabled`,\n    checked && `${prefix}-tabs__button--active-${color}`,\n    props.className\n  );\n\n  const renderIcon = () => {\n    return icon && cloneElement<IconProps>(icon, {\n      className: joinClass(\n        `${prefix}-tabs__button__icon`,\n      ),\n    });\n  };\n\n  return (\n    <button\n      type=\"button\"\n      disabled={disabled}\n      className={className}\n      {...props}\n    >\n      {renderIcon()}\n      {label}\n    </button>\n  );\n}","import type { HTMLAttributes } from 'react';\n\nimport Slide from '@/animations/Slide';\n\nexport interface TabContentProps extends HTMLAttributes<HTMLDivElement> {\n  children: React.JSX.Element;\n  value: number;\n  current: number;\n}\n\nexport default function TabContent({ children, value, current, ...props }: TabContentProps) {\n  return (\n    value === current && (\n      <Slide enter direction=\"left\">\n        <div {...props}>\n          {children}\n        </div>\n      </Slide>\n    )\n  );\n}","import { useEffect, useState } from 'react';\n\ntype UseTabs = [(index: number) => void, number]\n\nexport default function useTabs(current: number): UseTabs {\n  const [_current, setCurrent] = useState(current);\n\n  useEffect(() => { setCurrent(current); }, [current]);\n\n  const setTab = (index: number) => { setCurrent(index); };\n\n  return [\n    setTab,\n    _current,\n  ];\n}"],"names":["validateCurrent","length","current","Tabs","children","color","onChange","props","arrayChildren","Children","_current","setCurrent","useState","scrollRef","useRef","cls","joinClass","prefix","classNameMarker","id","useMemo","uuid","useListenerResized","setBorderLine","useEffect","firstEnableButton","currentIsDisabled","goToTab","handleClick","index","setRef","ref","element","el","width","left","renderChildren","child","_id","isActive","jsx","jsxs","Tabs_default","createComponent","TabButton","icon","label","disabled","checked","className","renderIcon","cloneElement","TabContent","value","Slide","useTabs"],"mappings":"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"}

package/dist/chunks/useTabs-De_vpYsm.js

@@ -0,0 +1,2 @@
+import{jsxs as C,jsx as f}from"react/jsx-runtime";import{Children as j,useState as k,useRef as x,useMemo as B,useEffect as b,cloneElement as y}from"react";import{p as c}from"./index-CZ41y9Hn.js";import{j as h}from"./joinClass-anSpaauN.js";import{u as R}from"./uuid-dGvr9vBZ.js";import{c as S}from"./createComponent-D-IheGJm.js";import{u as L}from"./useListenerResized-Bnqxrt7k.js";import{S as g}from"./Slide-BxEwoZ70.js";function A(t,n){if(n>t)throw new Error(`Current tab index (${n}) is greater than the number of tabs (${t})`)}function M({children:t,color:n="primary",current:s=0,onChange:i,...o}){const l=j.toArray(t),[a,$]=k(s),d=x([]),T=h(`${c}-tabs`,`${c}-tabs--${n}`,o.className),v=h(`${c}-tabs__marker`,`${c}-tabs__marker--${n}`),m=B(()=>`marker-${R()}`,[]);L(()=>p(),[a]),b(()=>{A(l.length-1,a)},[]),b(()=>{const e=l.findIndex(u=>!u.props.disabled),r=l[s].props.disabled;$(r?e:s)},[s]),b(()=>{p(),N(a)},[a]);const I=e=>{i&&i(e),$(e)},N=e=>{d.current&&d.current[e].scrollIntoView({behavior:"smooth",block:"nearest",inline:"center"})},w=(e,r)=>{!d.current||!r||(d.current[e]=r)},p=()=>{const e=document.querySelector(`#tab-${m}-${a}`),r=document.getElementById(m),u=e.offsetWidth,_=e.offsetLeft;r.style.width=`${u}px`,r.style.left=`${_}px`};return C("div",{...o,className:T,children:[l.map((e,r)=>{const u=`tab-${m}-${r}`,_=a===r;return f("div",{ref:E=>w(r,E),style:{width:"100%"},children:y(e,{id:u,tabIndex:r+1,"aria-checked":_,onClick:()=>I(r)})},u)}),f("div",{id:m,className:v})]})}const K=S(M);function O({icon:t,label:n,disabled:s,color:i="primary",...o}){const{"aria-checked":l}=o,a=h(`${c}-tabs__button`,s&&`${c}-tabs__button--disabled`,l&&`${c}-tabs__button--active-${i}`,o.className);return C("button",{type:"button",disabled:s,className:a,...o,children:[t&&y(t,{className:h(`${c}-tabs__button__icon`)}),n]})}function P({children:t,value:n,current:s,...i}){return n===s&&f(g,{enter:!0,direction:"left",children:f("div",{...i,children:t})})}function Q(t){const[n,s]=k(t);return b(()=>{s(t)},[t]),[o=>{s(o)},n]}export{O as T,P as a,K as b,Q as u};
+//# sourceMappingURL=useTabs-De_vpYsm.js.map

package/dist/chunks/useTabs-De_vpYsm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTabs-De_vpYsm.js","sources":["../../src/navigation/Tabs/Tabs.tsx","../../src/navigation/Tabs/TabButton.tsx","../../src/navigation/Tabs/TabContent.tsx","../../src/navigation/Tabs/useTabs.ts"],"sourcesContent":["import { Children, cloneElement, ReactElement, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils';\nimport { Colors } from '@iziui/core/theme';\n\nimport { uuid } from '@iziui/toolkit/uuid';\n\nimport createComponent from '@/core/createComponent';\nimport useListenerResized from '@/hooks/useListenerResized';\n\nimport '@iziui/styles/components/Tabs.scss';\n\nfunction validateCurrent(length: number, current: number) {\n  if (current > length) {\n    throw new Error(`Current tab index (${current}) is greater than the number of tabs (${length})`);\n  }\n}\n\nexport interface TabsProps extends Omit<React.HTMLProps<HTMLDivElement>, 'onChange'> {\n  current?: number;\n  color?: Colors;\n  children: React.ReactNode;\n  onChange?: (index: number) => void;\n};\n\nfunction Tabs({\n  children,\n  color = 'primary',\n  current = 0,\n  onChange,\n  ...props\n}: TabsProps) {\n  const arrayChildren = Children.toArray(children) as ReactElement<TabsProps>[];\n\n  const [_current, setCurrent] = useState(current);\n  const scrollRef = useRef<HTMLDivElement[] | null>([]);\n\n  const cls = joinClass(\n    `${prefix}-tabs`,\n    `${prefix}-tabs--${color}`,\n    props.className\n  );\n\n  const classNameMarker = joinClass(\n    `${prefix}-tabs__marker`,\n    `${prefix}-tabs__marker--${color}`,\n  );\n\n  const id = useMemo(() => `marker-${uuid()}`, []);\n\n  useListenerResized(() => setBorderLine(), [_current]);\n\n  useEffect(() => { validateCurrent(arrayChildren.length - 1, _current); }, []);\n\n  useEffect(() => {\n    const firstEnableButton = arrayChildren.findIndex(children => !children.props.disabled);\n    const currentIsDisabled = arrayChildren[current].props.disabled;\n\n    setCurrent(currentIsDisabled ? firstEnableButton : current);\n  }, [current]);\n\n  useEffect(() => {\n    setBorderLine();\n    goToTab(_current);\n  }, [_current]);\n\n  const handleClick = (index: number) => {\n    if (onChange) { onChange(index); };\n    setCurrent(index);\n  };\n\n  const goToTab = (index: number) => {\n    if (!scrollRef.current) { return; }\n    scrollRef.current[index].scrollIntoView({ behavior: 'smooth', block: 'nearest', inline: 'center', });\n  };\n\n  const setRef = (index: number, ref: HTMLDivElement | null) => {\n    if (!scrollRef.current || !ref) { return; }\n\n    scrollRef.current[index] = ref;\n  };\n\n  const setBorderLine = () => {\n    const element = document.querySelector(`#tab-${id}-${_current}`) as HTMLElement;\n    const el = document.getElementById(id) as HTMLElement;\n\n    const width = element['offsetWidth'];\n    const left = element['offsetLeft'];\n\n    el.style.width = `${width}px`;\n    el.style.left = `${left}px`;\n  };\n\n  const renderChildren = () => {\n    return arrayChildren.map((child, index) => {\n      const _id = `tab-${id}-${index}`;\n      const isActive = _current === index;\n\n      return (\n        <div key={_id} ref={ref => setRef(index, ref)} style={{ width: '100%' }}>\n          {\n            cloneElement(child, {\n              id: _id,\n              tabIndex: index + 1,\n              'aria-checked': isActive,\n              onClick: () => handleClick(index),\n            })\n          }\n        </div>\n      );\n    });\n  };\n\n  return (\n    <div {...props} className={cls}>\n      {renderChildren()}\n      <div id={id} className={classNameMarker} />\n    </div>\n  );\n}\n\nexport default createComponent(Tabs);\n","import { cloneElement, HTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { Colors } from '@iziui/core/theme';\nimport { joinClass } from '@iziui/core/utils';\n\nimport type { IconProps } from '@/display/Icon';\n\nexport interface TabButtonProps extends HTMLAttributes<HTMLButtonElement> {\n  label: string;\n  disabled?: boolean;\n  color?: Colors;\n  icon?: React.JSX.Element;\n}\n\nexport default function TabButton({ icon, label, disabled, color = 'primary', ...props }: TabButtonProps) {\n  const { 'aria-checked': checked } = props;\n\n  const className = joinClass(\n    `${prefix}-tabs__button`,\n    disabled && `${prefix}-tabs__button--disabled`,\n    checked && `${prefix}-tabs__button--active-${color}`,\n    props.className\n  );\n\n  const renderIcon = () => {\n    return icon && cloneElement<IconProps>(icon, {\n      className: joinClass(\n        `${prefix}-tabs__button__icon`,\n      ),\n    });\n  };\n\n  return (\n    <button\n      type=\"button\"\n      disabled={disabled}\n      className={className}\n      {...props}\n    >\n      {renderIcon()}\n      {label}\n    </button>\n  );\n}","import type { HTMLAttributes } from 'react';\n\nimport Slide from '@/animations/Slide';\n\nexport interface TabContentProps extends HTMLAttributes<HTMLDivElement> {\n  children: React.JSX.Element;\n  value: number;\n  current: number;\n}\n\nexport default function TabContent({ children, value, current, ...props }: TabContentProps) {\n  return (\n    value === current && (\n      <Slide enter direction=\"left\">\n        <div {...props}>\n          {children}\n        </div>\n      </Slide>\n    )\n  );\n}","import { useEffect, useState } from 'react';\n\ntype UseTabs = [(index: number) => void, number]\n\nexport default function useTabs(current: number): UseTabs {\n  const [_current, setCurrent] = useState(current);\n\n  useEffect(() => { setCurrent(current); }, [current]);\n\n  const setTab = (index: number) => { setCurrent(index); };\n\n  return [\n    setTab,\n    _current,\n  ];\n}"],"names":["validateCurrent","length","current","Tabs","children","color","onChange","props","arrayChildren","Children","_current","setCurrent","useState","scrollRef","useRef","cls","joinClass","prefix","classNameMarker","id","useMemo","uuid","useListenerResized","setBorderLine","useEffect","firstEnableButton","currentIsDisabled","goToTab","handleClick","index","setRef","ref","element","el","width","left","jsxs","child","_id","isActive","jsx","Tabs_default","createComponent","TabButton","icon","label","disabled","checked","className","cloneElement","TabContent","value","Slide","useTabs"],"mappings":"qaAcA,SAASA,EAAgBC,EAAgBC,EAAiB,CACxD,GAAIA,EAAUD,EACZ,MAAM,IAAI,MAAM,sBAAsBC,CAAO,yCAAyCD,CAAM,GAAG,CAEnG,CASA,SAASE,EAAK,CACZ,SAAAC,EACA,MAAAC,EAAQ,UACR,QAAAH,EAAU,EACV,SAAAI,EACA,GAAGC,CACL,EAAc,CACZ,MAAMC,EAAgBC,EAAS,QAAQL,CAAQ,EAEzC,CAACM,EAAUC,CAAU,EAAIC,EAASV,CAAO,EACzCW,EAAYC,EAAgC,EAAE,EAE9CC,EAAMC,EACV,GAAGC,CAAM,QACT,GAAGA,CAAM,UAAUZ,CAAK,GACxBE,EAAM,SAAA,EAGFW,EAAkBF,EACtB,GAAGC,CAAM,gBACT,GAAGA,CAAM,kBAAkBZ,CAAK,EAAA,EAG5Bc,EAAKC,EAAQ,IAAM,UAAUC,GAAM,GAAI,EAAE,EAE/CC,EAAmB,IAAMC,IAAiB,CAACb,CAAQ,CAAC,EAEpDc,EAAU,IAAM,CAAExB,EAAgBQ,EAAc,OAAS,EAAGE,CAAQ,CAAG,EAAG,CAAA,CAAE,EAE5Ec,EAAU,IAAM,CACd,MAAMC,EAAoBjB,EAAc,UAAUJ,GAAY,CAACA,EAAS,MAAM,QAAQ,EAChFsB,EAAoBlB,EAAcN,CAAO,EAAE,MAAM,SAEvDS,EAAWe,EAAoBD,EAAoBvB,CAAO,CAC5D,EAAG,CAACA,CAAO,CAAC,EAEZsB,EAAU,IAAM,CACdD,EAAA,EACAI,EAAQjB,CAAQ,CAClB,EAAG,CAACA,CAAQ,CAAC,EAEb,MAAMkB,EAAeC,GAAkB,CACjCvB,GAAYA,EAASuB,CAAK,EAC9BlB,EAAWkB,CAAK,CAClB,EAEMF,EAAWE,GAAkB,CAC5BhB,EAAU,SACfA,EAAU,QAAQgB,CAAK,EAAE,eAAe,CAAE,SAAU,SAAU,MAAO,UAAW,OAAQ,QAAA,CAAW,CACrG,EAEMC,EAAS,CAACD,EAAeE,IAA+B,CACxD,CAAClB,EAAU,SAAW,CAACkB,IAE3BlB,EAAU,QAAQgB,CAAK,EAAIE,EAC7B,EAEMR,EAAgB,IAAM,CAC1B,MAAMS,EAAU,SAAS,cAAc,QAAQb,CAAE,IAAIT,CAAQ,EAAE,EACzDuB,EAAK,SAAS,eAAed,CAAE,EAE/Be,EAAQF,EAAQ,YAChBG,EAAOH,EAAQ,WAErBC,EAAG,MAAM,MAAQ,GAAGC,CAAK,KACzBD,EAAG,MAAM,KAAO,GAAGE,CAAI,IACzB,EAsBA,OACEC,EAAC,MAAA,CAAK,GAAG7B,EAAO,UAAWQ,EACxB,SAAA,CArBIP,EAAc,IAAI,CAAC6B,EAAOR,IAAU,CACzC,MAAMS,EAAM,OAAOnB,CAAE,IAAIU,CAAK,GACxBU,EAAW7B,IAAamB,EAE9B,OACEW,EAAC,MAAA,CAAc,IAAKT,GAAOD,EAAOD,EAAOE,CAAG,EAAG,MAAO,CAAE,MAAO,MAAA,EAE3D,WAAaM,EAAO,CAClB,GAAIC,EACJ,SAAUT,EAAQ,EAClB,eAAgBU,EAChB,QAAS,IAAMX,EAAYC,CAAK,CAAA,CACjC,GAPKS,CASV,CAEJ,CAAC,EAMCE,EAAC,MAAA,CAAI,GAAArB,EAAQ,UAAWD,CAAA,CAAiB,CAAA,EAC3C,CAEJ,CAEA,MAAAuB,EAAeC,EAAgBvC,CAAI,EC3GnC,SAAwBwC,EAAU,CAAE,KAAAC,EAAM,MAAAC,EAAO,SAAAC,EAAU,MAAAzC,EAAQ,UAAW,GAAGE,GAAyB,CACxG,KAAM,CAAE,eAAgBwC,CAAA,EAAYxC,EAE9ByC,EAAYhC,EAChB,GAAGC,CAAM,gBACT6B,GAAY,GAAG7B,CAAM,0BACrB8B,GAAW,GAAG9B,CAAM,yBAAyBZ,CAAK,GAClDE,EAAM,SAAA,EAWR,OACE6B,EAAC,SAAA,CACC,KAAK,SACL,SAAAU,EACA,UAAAE,EACC,GAAGzC,EAEH,SAAA,CAdIqC,GAAQK,EAAwBL,EAAM,CAC3C,UAAW5B,EACT,GAAGC,CAAM,qBAAA,CACX,CACD,EAWE4B,CAAA,CAAA,CAAA,CAGP,CCnCA,SAAwBK,EAAW,CAAE,SAAA9C,EAAU,MAAA+C,EAAO,QAAAjD,EAAS,GAAGK,GAA0B,CAC1F,OACE4C,IAAUjD,GACRsC,EAACY,EAAA,CAAM,MAAK,GAAC,UAAU,OACrB,SAAAZ,EAAC,MAAA,CAAK,GAAGjC,EACN,SAAAH,EACH,EACF,CAGN,CChBA,SAAwBiD,EAAQnD,EAA0B,CACxD,KAAM,CAACQ,EAAUC,CAAU,EAAIC,EAASV,CAAO,EAE/C,OAAAsB,EAAU,IAAM,CAAEb,EAAWT,CAAO,CAAG,EAAG,CAACA,CAAO,CAAC,EAI5C,CAFS2B,GAAkB,CAAElB,EAAWkB,CAAK,CAAG,EAIrDnB,CAAA,CAEJ"}

package/dist/chunks/uuid-dGvr9vBZ.js

@@ -0,0 +1,2 @@
+function e(){let x=new Date().getTime();return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,function(n){const t=(x+Math.random()*16)%16|0;return x=Math.floor(x/16),(n=="x"?t:t&3|8).toString(16)})}export{e as u};
+//# sourceMappingURL=uuid-dGvr9vBZ.js.map

package/dist/chunks/uuid-dGvr9vBZ.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"uuid-dGvr9vBZ.js","sources":["../../../../toolkit/src/uuid/uuid.ts"],"sourcesContent":["export function uuid() {\n  let dt = new Date().getTime();\n\n  const uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {\n    const r = (dt + Math.random() * 16) % 16 | 0;\n    dt = Math.floor(dt / 16);\n    return (c == 'x' ? r : (r & 0x3 | 0x8)).toString(16);\n  });\n\n  return uuid;\n}\n\nexport function hash(str: string): string {\n  let h = 5381;\n\n  for (let i = 0; i < str.length; i++) {\n    h = ((h << 5) + h) + str.charCodeAt(i);\n  }\n\n  return (h >>> 0).toString(36);\n}"],"names":["uuid","dt","c","r"],"mappings":"AAAO,SAASA,GAAO,CACrB,IAAIC,EAAK,IAAI,KAAA,EAAO,QAAA,EAQpB,MANa,uCAAuC,QAAQ,QAAS,SAAUC,EAAG,CAChF,MAAMC,GAAKF,EAAK,KAAK,SAAW,IAAM,GAAK,EAC3C,OAAAA,EAAK,KAAK,MAAMA,EAAK,EAAE,GACfC,GAAK,IAAMC,EAAKA,EAAI,EAAM,GAAM,SAAS,EAAE,CACrD,CAAC,CAGH"}

package/dist/chunks/uuid-omnJ9TjZ.cjs

@@ -0,0 +1,2 @@
+"use strict";function n(){let x=new Date().getTime();return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,function(u){const t=(x+Math.random()*16)%16|0;return x=Math.floor(x/16),(u=="x"?t:t&3|8).toString(16)})}exports.uuid=n;
+//# sourceMappingURL=uuid-omnJ9TjZ.cjs.map

package/dist/chunks/uuid-omnJ9TjZ.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"uuid-omnJ9TjZ.cjs","sources":["../../../../toolkit/src/uuid/uuid.ts"],"sourcesContent":["export function uuid() {\n  let dt = new Date().getTime();\n\n  const uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {\n    const r = (dt + Math.random() * 16) % 16 | 0;\n    dt = Math.floor(dt / 16);\n    return (c == 'x' ? r : (r & 0x3 | 0x8)).toString(16);\n  });\n\n  return uuid;\n}\n\nexport function hash(str: string): string {\n  let h = 5381;\n\n  for (let i = 0; i < str.length; i++) {\n    h = ((h << 5) + h) + str.charCodeAt(i);\n  }\n\n  return (h >>> 0).toString(36);\n}"],"names":["uuid","dt","c","r"],"mappings":"aAAO,SAASA,GAAO,CACrB,IAAIC,EAAK,IAAI,KAAA,EAAO,QAAA,EAQpB,MANa,uCAAuC,QAAQ,QAAS,SAAUC,EAAG,CAChF,MAAMC,GAAKF,EAAK,KAAK,SAAW,IAAM,GAAK,EAC3C,OAAAA,EAAK,KAAK,MAAMA,EAAK,EAAE,GACfC,GAAK,IAAMC,EAAKA,EAAI,EAAM,GAAM,SAAS,EAAE,CACrD,CAAC,CAGH"}

package/dist/chunks/wait-BSgGzoPk.js

@@ -0,0 +1,2 @@
+function n(e,t){return new Promise(i=>{setTimeout(()=>{i(e())},t)})}export{n as w};
+//# sourceMappingURL=wait-BSgGzoPk.js.map

package/dist/chunks/wait-BSgGzoPk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"wait-BSgGzoPk.js","sources":["../../../../toolkit/src/promise/wait.ts"],"sourcesContent":["export function wait<T>(callback: () => T, ms: number) {\n  return new Promise<T>(resolve => {\n    setTimeout(() => { resolve(callback()); }, ms);\n  });\n}\n"],"names":["wait","callback","ms","resolve"],"mappings":"AAAO,SAASA,EAAQC,EAAmBC,EAAY,CACrD,OAAO,IAAI,QAAWC,GAAW,CAC/B,WAAW,IAAM,CAAEA,EAAQF,GAAU,CAAG,EAAGC,CAAE,CAC/C,CAAC,CACH"}

package/dist/chunks/wait-CgS79FV1.cjs

@@ -0,0 +1,2 @@
+"use strict";function n(t,e){return new Promise(i=>{setTimeout(()=>{i(t())},e)})}exports.wait=n;
+//# sourceMappingURL=wait-CgS79FV1.cjs.map

package/dist/chunks/wait-CgS79FV1.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"wait-CgS79FV1.cjs","sources":["../../../../toolkit/src/promise/wait.ts"],"sourcesContent":["export function wait<T>(callback: () => T, ms: number) {\n  return new Promise<T>(resolve => {\n    setTimeout(() => { resolve(callback()); }, ms);\n  });\n}\n"],"names":["wait","callback","ms","resolve"],"mappings":"aAAO,SAASA,EAAQC,EAAmBC,EAAY,CACrD,OAAO,IAAI,QAAWC,GAAW,CAC/B,WAAW,IAAM,CAAEA,EAAQF,GAAU,CAAG,EAAGC,CAAE,CAC/C,CAAC,CACH"}

package/dist/components/Alert/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../chunks/Alert-CUgp08gU.cjs");require("react/jsx-runtime");require("react");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/joinClass-Jk3EszKD.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");require("../../chunks/Stack-B_lU0ez7.cjs");require("../../chunks/createComponent-Dkt68kvT.cjs");require("../../chunks/Typography-DW57lh3e.cjs");require("../../chunks/convertPathToColor-D8eBpd_D.cjs");require("../../chunks/ButtonIcon-BMOZPxpN.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");require("../../chunks/Icon-CIrgQex7.cjs");exports.default=e.Alert;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../chunks/Alert-BCDrxwmz.cjs");require("react/jsx-runtime");require("react");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/joinClass-Jk3EszKD.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");require("../../chunks/Stack-lvjI3kV3.cjs");require("../../chunks/createComponent-B2C4sTOb.cjs");require("../../chunks/Typography-B2gBDBkp.cjs");require("../../chunks/convertPathToColor-D8eBpd_D.cjs");require("../../chunks/ButtonIcon-CJ5Iz-uJ.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");require("../../chunks/Icon-CFvy-l1V.cjs");exports.default=e.Alert;
 //# sourceMappingURL=index.cjs.map

package/dist/components/Alert/index.js

@@ -1,2 +1,2 @@
-import{A as b}from"../../chunks/Alert-mOXPwc3e.js";import"react/jsx-runtime";import"react";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/joinClass-anSpaauN.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";import"../../chunks/Stack-Deow48Th.js";import"../../chunks/createComponent-CovqNaAJ.js";import"../../chunks/Typography-BrJZyxiT.js";import"../../chunks/convertPathToColor-DtOjH4ZP.js";import"../../chunks/ButtonIcon-CYO1Crb-.js";import"../../chunks/Ripple-Bq9bxg4k.js";import"../../chunks/Icon-imOBrsbL.js";export{b as default};
+import{A as b}from"../../chunks/Alert-B-zwGEUF.js";import"react/jsx-runtime";import"react";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/joinClass-anSpaauN.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";import"../../chunks/Stack-C2zMFX0w.js";import"../../chunks/createComponent-D-IheGJm.js";import"../../chunks/Typography-BkvvYn5T.js";import"../../chunks/convertPathToColor-DtOjH4ZP.js";import"../../chunks/ButtonIcon-mMZe5V_1.js";import"../../chunks/Ripple-Bq9bxg4k.js";import"../../chunks/Icon-B2zjgYkr.js";export{b as default};
 //# sourceMappingURL=index.js.map

package/dist/components/Avatar/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react/jsx-runtime"),e=require("../../chunks/index-DYxwT4uW.cjs"),h=require("../../chunks/joinClass-Jk3EszKD.cjs"),l=require("../../chunks/createComponent-Dkt68kvT.cjs"),x=require("../../chunks/Ripple-Dy4i91j1.cjs"),v=require("../../chunks/Icon-CIrgQex7.cjs"),y=require("../../chunks/Typography-DW57lh3e.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("react");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");require("../../chunks/convertPathToColor-D8eBpd_D.cjs");function g({src:a,alt:u,name:n,size:r=40,variant:c="circular",color:s="primary",icon:o,...t}){const f=h.joinClass(`${e.prefix}-avatar`,`${e.prefix}-avatar--${c}`,`${e.prefix}-avatar--${s}`,a&&`${e.prefix}-avatar--image`,n&&`${e.prefix}-avatar--name`,!a&&!n||o&&`${e.prefix}-avatar--icon`,t.onClick&&`${e.prefix}-avatar--clickable`,t.className),d=()=>a?i.jsx("img",{src:a,alt:u,width:r,height:r,sizes:"100vw",loading:"lazy",style:{width:"100%",height:"auto"}}):n?i.jsx(y.Typography,{style:{fontSize:r/2,color:"currentColor"},children:l.getInitials(n)}):o||i.jsx(v.Icon,{name:"user",size:r/1.6,style:{color:"currentColor"}});return i.jsxs("div",{...t,style:{width:r,height:r,...t.style},className:f,children:[d(),t.children,t.onClick&&i.jsx(x.Ripple,{})]})}const q=l.createComponent(g);exports.default=q;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),t=require("../../chunks/index-DYxwT4uW.cjs"),f=require("../../chunks/joinClass-Jk3EszKD.cjs"),d=require("../../chunks/Ripple-Dy4i91j1.cjs"),g=require("../../chunks/createComponent-B2C4sTOb.cjs"),v=require("../../chunks/Icon-CFvy-l1V.cjs"),x=require("../../chunks/Typography-B2gBDBkp.cjs");require("react");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");require("../../chunks/convertPathToColor-D8eBpd_D.cjs");function s(e){return e.normalize("NFD").trim().toLowerCase().replace(/a-zA-Z0-9_.-+/g,"").replace(/_/g,"").replace(/[^\w\s]/gi,"")}function m(e){const a=e.trim().split(" "),i=a.length===1,r=s(a[0]).charAt(0).toLocaleUpperCase(),c=i?s(a[0]).charAt(1).toLocaleUpperCase():s(a.reverse()[0]).charAt(0).toLocaleUpperCase();return r+c}function y({src:e,alt:a,name:i,size:r=40,variant:c="circular",color:u="primary",icon:l,...n}){const h=f.joinClass(`${t.prefix}-avatar`,`${t.prefix}-avatar--${c}`,`${t.prefix}-avatar--${u}`,e&&`${t.prefix}-avatar--image`,i&&`${t.prefix}-avatar--name`,!e&&!i||l&&`${t.prefix}-avatar--icon`,n.onClick&&`${t.prefix}-avatar--clickable`,n.className),p=()=>e?o.jsx("img",{src:e,alt:a,width:r,height:r,sizes:"100vw",loading:"lazy",style:{width:"100%",height:"auto"}}):i?o.jsx(x.Typography,{style:{fontSize:r/2,color:"currentColor"},children:m(i)}):l||o.jsx(v.Icon,{name:"user",size:r/1.6,style:{color:"currentColor"}});return o.jsxs("div",{...n,style:{width:r,height:r,...n.style},className:h,children:[p(),n.children,n.onClick&&o.jsx(d.Ripple,{})]})}const C=g.createComponent(y);exports.default=C;
 //# sourceMappingURL=index.cjs.map

package/dist/components/Avatar/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/display/Avatar/Avatar.tsx"],"sourcesContent":["import { HTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\nimport type { Colors } from '@iziui/core/theme';\n\nimport { getInitials } from '@iziui/toolkit/string';\n\nimport Ripple from '@/actions/Ripple';\nimport createComponent from '@/core/createComponent';\n\nimport Icon from '../Icon';\nimport Typography from '../Typography';\n\nimport '@iziui/styles/components/Avatar.scss';\n\ninterface AvatarProps extends HTMLAttributes<HTMLElement> {\n  alt?: string;\n  src?: string;\n  name?: string;\n  size?: number;\n  color?: Colors;\n  variant?: 'rounded' | 'circular';\n  icon?: React.JSX.Element;\n}\nfunction Avatar({\n  src,\n  alt,\n  name,\n  size = 40,\n  variant = 'circular',\n  color = 'primary',\n  icon,\n  ...props\n}: AvatarProps) {\n  const className = joinClass(\n    `${prefix}-avatar`,\n    `${prefix}-avatar--${variant}`,\n    `${prefix}-avatar--${color}`,\n    src && `${prefix}-avatar--image`,\n    name && `${prefix}-avatar--name`,\n    (!src && !name) || icon && `${prefix}-avatar--icon`,\n    props.onClick && `${prefix}-avatar--clickable`,\n    props.className\n  );\n\n  const content = () => {\n    if (src) {\n      return (\n        <img\n          src={src}\n          alt={alt}\n          width={size}\n          height={size}\n          sizes=\"100vw\"\n          loading=\"lazy\"\n          style={{ width: '100%', height: 'auto' }}\n        />\n      );\n    }\n    if (name) {\n      return (\n        <Typography\n          style={{\n            fontSize: size / 2,\n            color: 'currentColor'\n          }}\n        >\n          {getInitials(name)}\n        </Typography>\n      );\n    }\n\n    if (icon) { return icon; }\n\n    return (\n      <Icon name=\"user\" size={size / 1.6} style={{ color: 'currentColor' }} />\n    );\n  };\n\n  return (\n    <div {...props} style={{ width: size, height: size, ...props.style }} className={className}>\n      {content()}\n      {props.children}\n      {props.onClick && <Ripple />}\n    </div>\n  );\n}\n\nexport default createComponent(Avatar);"],"names":["Avatar","src","alt","name","size","variant","color","icon","props","className","joinClass","prefix","content","jsx","Typography","Icon","jsxs","Ripple","Avatar_default","createComponent"],"mappings":"omBA0BA,SAASA,EAAO,CACd,IAAAC,EACA,IAAAC,EACA,KAAAC,EACA,KAAAC,EAAO,GACP,QAAAC,EAAU,WACV,MAAAC,EAAQ,UACR,KAAAC,EACA,GAAGC,CACL,EAAgB,CACd,MAAMC,EAAYC,EAAAA,UAChB,GAAGC,EAAAA,MAAM,UACT,GAAGA,EAAAA,MAAM,YAAYN,CAAO,GAC5B,GAAGM,EAAAA,MAAM,YAAYL,CAAK,GAC1BL,GAAO,GAAGU,EAAAA,MAAM,iBAChBR,GAAQ,GAAGQ,EAAAA,MAAM,gBAChB,CAACV,GAAO,CAACE,GAASI,GAAQ,GAAGI,EAAAA,MAAM,gBACpCH,EAAM,SAAW,GAAGG,EAAAA,MAAM,qBAC1BH,EAAM,SAAA,EAGFI,EAAU,IACVX,EAEAY,EAAAA,IAAC,MAAA,CACC,IAAAZ,EACA,IAAAC,EACA,MAAOE,EACP,OAAQA,EACR,MAAM,QACN,QAAQ,OACR,MAAO,CAAE,MAAO,OAAQ,OAAQ,MAAA,CAAO,CAAA,EAIzCD,EAEAU,EAAAA,IAACC,EAAAA,WAAA,CACC,MAAO,CACL,SAAUV,EAAO,EACjB,MAAO,cAAA,EAGR,uBAAYD,CAAI,CAAA,CAAA,EAKnBI,GAGFM,EAAAA,IAACE,EAAAA,KAAA,CAAK,KAAK,OAAO,KAAMX,EAAO,IAAK,MAAO,CAAE,MAAO,cAAA,CAAe,CAAG,EAI1E,OACEY,EAAAA,KAAC,MAAA,CAAK,GAAGR,EAAO,MAAO,CAAE,MAAOJ,EAAM,OAAQA,EAAM,GAAGI,EAAM,KAAA,EAAS,UAAAC,EACnE,SAAA,CAAAG,EAAA,EACAJ,EAAM,SACNA,EAAM,SAAWK,MAACI,EAAAA,OAAA,CAAA,CAAO,CAAA,EAC5B,CAEJ,CAEA,MAAAC,EAAeC,EAAAA,gBAAgBnB,CAAM"}
+{"version":3,"file":"index.cjs","sources":["../../../../../toolkit/src/string/string.ts","../../../src/display/Avatar/Avatar.tsx"],"sourcesContent":["export function sanitize(value: string) {\n  return value.normalize('NFD')\n    .trim().toLowerCase()\n    .replace(/a-zA-Z0-9_.-+/g, '')\n    .replace(/_/g, '')\n    .replace(/[^\\w\\s]/gi, '');\n};\n\nexport function getInitials(name: string) {\n  const names: string[] = name.trim().split(' ');\n\n  const hasOneName = names.length === 1;\n\n  const firstInitial = sanitize(names[0]).charAt(0).toLocaleUpperCase();\n\n  const secondInitial = hasOneName\n    ? sanitize(names[0]).charAt(1).toLocaleUpperCase()\n    : sanitize(names.reverse()[0]).charAt(0).toLocaleUpperCase();\n\n  return firstInitial + secondInitial;\n};\n\nexport function slug(str: string) {\n  if (!str) { return ''; }\n\n  return sanitize(str)\n    .replace(/\\s+/g, '-');\n}\n\nexport function capitalize(str: string) {\n  if (!str) { return ''; }\n  return str[0].toUpperCase() + str.slice(1);\n}\n\nexport function toKebabCase(value: string) {\n  return value.replace(/[A-Z]/g, match => `-${match.toLowerCase()}`);\n}","import { HTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\nimport type { Colors } from '@iziui/core/theme';\n\nimport { getInitials } from '@iziui/toolkit/string';\n\nimport Ripple from '@/actions/Ripple';\nimport createComponent from '@/core/createComponent';\n\nimport Icon from '../Icon';\nimport Typography from '../Typography';\n\nimport '@iziui/styles/components/Avatar.scss';\n\ninterface AvatarProps extends HTMLAttributes<HTMLElement> {\n  alt?: string;\n  src?: string;\n  name?: string;\n  size?: number;\n  color?: Colors;\n  variant?: 'rounded' | 'circular';\n  icon?: React.JSX.Element;\n}\nfunction Avatar({\n  src,\n  alt,\n  name,\n  size = 40,\n  variant = 'circular',\n  color = 'primary',\n  icon,\n  ...props\n}: AvatarProps) {\n  const className = joinClass(\n    `${prefix}-avatar`,\n    `${prefix}-avatar--${variant}`,\n    `${prefix}-avatar--${color}`,\n    src && `${prefix}-avatar--image`,\n    name && `${prefix}-avatar--name`,\n    (!src && !name) || icon && `${prefix}-avatar--icon`,\n    props.onClick && `${prefix}-avatar--clickable`,\n    props.className\n  );\n\n  const content = () => {\n    if (src) {\n      return (\n        <img\n          src={src}\n          alt={alt}\n          width={size}\n          height={size}\n          sizes=\"100vw\"\n          loading=\"lazy\"\n          style={{ width: '100%', height: 'auto' }}\n        />\n      );\n    }\n    if (name) {\n      return (\n        <Typography\n          style={{\n            fontSize: size / 2,\n            color: 'currentColor'\n          }}\n        >\n          {getInitials(name)}\n        </Typography>\n      );\n    }\n\n    if (icon) { return icon; }\n\n    return (\n      <Icon name=\"user\" size={size / 1.6} style={{ color: 'currentColor' }} />\n    );\n  };\n\n  return (\n    <div {...props} style={{ width: size, height: size, ...props.style }} className={className}>\n      {content()}\n      {props.children}\n      {props.onClick && <Ripple />}\n    </div>\n  );\n}\n\nexport default createComponent(Avatar);"],"names":["sanitize","value","getInitials","name","names","hasOneName","firstInitial","secondInitial","Avatar","src","alt","size","variant","color","icon","props","className","joinClass","prefix","content","jsx","Typography","Icon","jsxs","Ripple","Avatar_default","createComponent"],"mappings":"omBAAO,SAASA,EAASC,EAAe,CACtC,OAAOA,EAAM,UAAU,KAAK,EACzB,KAAA,EAAO,cACP,QAAQ,iBAAkB,EAAE,EAC5B,QAAQ,KAAM,EAAE,EAChB,QAAQ,YAAa,EAAE,CAC5B,CAEO,SAASC,EAAYC,EAAc,CACxC,MAAMC,EAAkBD,EAAK,KAAA,EAAO,MAAM,GAAG,EAEvCE,EAAaD,EAAM,SAAW,EAE9BE,EAAeN,EAASI,EAAM,CAAC,CAAC,EAAE,OAAO,CAAC,EAAE,kBAAA,EAE5CG,EAAgBF,EAClBL,EAASI,EAAM,CAAC,CAAC,EAAE,OAAO,CAAC,EAAE,kBAAA,EAC7BJ,EAASI,EAAM,UAAU,CAAC,CAAC,EAAE,OAAO,CAAC,EAAE,kBAAA,EAE3C,OAAOE,EAAeC,CACxB,CCMA,SAASC,EAAO,CACd,IAAAC,EACA,IAAAC,EACA,KAAAP,EACA,KAAAQ,EAAO,GACP,QAAAC,EAAU,WACV,MAAAC,EAAQ,UACR,KAAAC,EACA,GAAGC,CACL,EAAgB,CACd,MAAMC,EAAYC,EAAAA,UAChB,GAAGC,EAAAA,MAAM,UACT,GAAGA,EAAAA,MAAM,YAAYN,CAAO,GAC5B,GAAGM,EAAAA,MAAM,YAAYL,CAAK,GAC1BJ,GAAO,GAAGS,EAAAA,MAAM,iBAChBf,GAAQ,GAAGe,EAAAA,MAAM,gBAChB,CAACT,GAAO,CAACN,GAASW,GAAQ,GAAGI,EAAAA,MAAM,gBACpCH,EAAM,SAAW,GAAGG,EAAAA,MAAM,qBAC1BH,EAAM,SAAA,EAGFI,EAAU,IACVV,EAEAW,EAAAA,IAAC,MAAA,CACC,IAAAX,EACA,IAAAC,EACA,MAAOC,EACP,OAAQA,EACR,MAAM,QACN,QAAQ,OACR,MAAO,CAAE,MAAO,OAAQ,OAAQ,MAAA,CAAO,CAAA,EAIzCR,EAEAiB,EAAAA,IAACC,EAAAA,WAAA,CACC,MAAO,CACL,SAAUV,EAAO,EACjB,MAAO,cAAA,EAGR,WAAYR,CAAI,CAAA,CAAA,EAKnBW,GAGFM,EAAAA,IAACE,EAAAA,KAAA,CAAK,KAAK,OAAO,KAAMX,EAAO,IAAK,MAAO,CAAE,MAAO,cAAA,CAAe,CAAG,EAI1E,OACEY,EAAAA,KAAC,MAAA,CAAK,GAAGR,EAAO,MAAO,CAAE,MAAOJ,EAAM,OAAQA,EAAM,GAAGI,EAAM,KAAA,EAAS,UAAAC,EACnE,SAAA,CAAAG,EAAA,EACAJ,EAAM,SACNA,EAAM,SAAWK,MAACI,EAAAA,OAAA,CAAA,CAAO,CAAA,EAC5B,CAEJ,CAEA,MAAAC,EAAeC,EAAAA,gBAAgBlB,CAAM"}

package/dist/components/Avatar/index.js

@@ -1,2 +1,2 @@
-import{jsxs as h,jsx as e}from"react/jsx-runtime";import{p as t}from"../../chunks/index-CZ41y9Hn.js";import{j as u}from"../../chunks/joinClass-anSpaauN.js";import{c as v,g as d}from"../../chunks/createComponent-CovqNaAJ.js";import{R as p}from"../../chunks/Ripple-Bq9bxg4k.js";import{I as g}from"../../chunks/Icon-imOBrsbL.js";import{T as y}from"../../chunks/Typography-BrJZyxiT.js";import"../../chunks/useTheme-BYuNiCiH.js";import"react";import"../../chunks/generateSupportColors-BN5t8dA-.js";import"../../chunks/convertPathToColor-DtOjH4ZP.js";function $({src:o,alt:n,name:i,size:a=40,variant:m="circular",color:c="primary",icon:l,...r}){const s=u(`${t}-avatar`,`${t}-avatar--${m}`,`${t}-avatar--${c}`,o&&`${t}-avatar--image`,i&&`${t}-avatar--name`,!o&&!i||l&&`${t}-avatar--icon`,r.onClick&&`${t}-avatar--clickable`,r.className),f=()=>o?e("img",{src:o,alt:n,width:a,height:a,sizes:"100vw",loading:"lazy",style:{width:"100%",height:"auto"}}):i?e(y,{style:{fontSize:a/2,color:"currentColor"},children:d(i)}):l||e(g,{name:"user",size:a/1.6,style:{color:"currentColor"}});return h("div",{...r,style:{width:a,height:a,...r.style},className:s,children:[f(),r.children,r.onClick&&e(p,{})]})}const S=v($);export{S as default};
+import{jsxs as h,jsx as n}from"react/jsx-runtime";import{p as r}from"../../chunks/index-CZ41y9Hn.js";import{j as u}from"../../chunks/joinClass-anSpaauN.js";import{R as g}from"../../chunks/Ripple-Bq9bxg4k.js";import{c as v}from"../../chunks/createComponent-D-IheGJm.js";import{I as d}from"../../chunks/Icon-B2zjgYkr.js";import{T as C}from"../../chunks/Typography-BkvvYn5T.js";import"react";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";import"../../chunks/convertPathToColor-DtOjH4ZP.js";function s(t){return t.normalize("NFD").trim().toLowerCase().replace(/a-zA-Z0-9_.-+/g,"").replace(/_/g,"").replace(/[^\w\s]/gi,"")}function y(t){const e=t.trim().split(" "),o=e.length===1,a=s(e[0]).charAt(0).toLocaleUpperCase(),l=o?s(e[0]).charAt(1).toLocaleUpperCase():s(e.reverse()[0]).charAt(0).toLocaleUpperCase();return a+l}function $({src:t,alt:e,name:o,size:a=40,variant:l="circular",color:m="primary",icon:c,...i}){const p=u(`${r}-avatar`,`${r}-avatar--${l}`,`${r}-avatar--${m}`,t&&`${r}-avatar--image`,o&&`${r}-avatar--name`,!t&&!o||c&&`${r}-avatar--icon`,i.onClick&&`${r}-avatar--clickable`,i.className),f=()=>t?n("img",{src:t,alt:e,width:a,height:a,sizes:"100vw",loading:"lazy",style:{width:"100%",height:"auto"}}):o?n(C,{style:{fontSize:a/2,color:"currentColor"},children:y(o)}):c||n(d,{name:"user",size:a/1.6,style:{color:"currentColor"}});return h("div",{...i,style:{width:a,height:a,...i.style},className:p,children:[f(),i.children,i.onClick&&n(g,{})]})}const R=v($);export{R as default};
 //# sourceMappingURL=index.js.map

package/dist/components/Avatar/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/display/Avatar/Avatar.tsx"],"sourcesContent":["import { HTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\nimport type { Colors } from '@iziui/core/theme';\n\nimport { getInitials } from '@iziui/toolkit/string';\n\nimport Ripple from '@/actions/Ripple';\nimport createComponent from '@/core/createComponent';\n\nimport Icon from '../Icon';\nimport Typography from '../Typography';\n\nimport '@iziui/styles/components/Avatar.scss';\n\ninterface AvatarProps extends HTMLAttributes<HTMLElement> {\n  alt?: string;\n  src?: string;\n  name?: string;\n  size?: number;\n  color?: Colors;\n  variant?: 'rounded' | 'circular';\n  icon?: React.JSX.Element;\n}\nfunction Avatar({\n  src,\n  alt,\n  name,\n  size = 40,\n  variant = 'circular',\n  color = 'primary',\n  icon,\n  ...props\n}: AvatarProps) {\n  const className = joinClass(\n    `${prefix}-avatar`,\n    `${prefix}-avatar--${variant}`,\n    `${prefix}-avatar--${color}`,\n    src && `${prefix}-avatar--image`,\n    name && `${prefix}-avatar--name`,\n    (!src && !name) || icon && `${prefix}-avatar--icon`,\n    props.onClick && `${prefix}-avatar--clickable`,\n    props.className\n  );\n\n  const content = () => {\n    if (src) {\n      return (\n        <img\n          src={src}\n          alt={alt}\n          width={size}\n          height={size}\n          sizes=\"100vw\"\n          loading=\"lazy\"\n          style={{ width: '100%', height: 'auto' }}\n        />\n      );\n    }\n    if (name) {\n      return (\n        <Typography\n          style={{\n            fontSize: size / 2,\n            color: 'currentColor'\n          }}\n        >\n          {getInitials(name)}\n        </Typography>\n      );\n    }\n\n    if (icon) { return icon; }\n\n    return (\n      <Icon name=\"user\" size={size / 1.6} style={{ color: 'currentColor' }} />\n    );\n  };\n\n  return (\n    <div {...props} style={{ width: size, height: size, ...props.style }} className={className}>\n      {content()}\n      {props.children}\n      {props.onClick && <Ripple />}\n    </div>\n  );\n}\n\nexport default createComponent(Avatar);"],"names":["Avatar","src","alt","name","size","variant","color","icon","props","className","joinClass","prefix","content","jsx","Typography","Icon","jsxs","Ripple","Avatar_default","createComponent"],"mappings":"iiBA0BA,SAASA,EAAO,CACd,IAAAC,EACA,IAAAC,EACA,KAAAC,EACA,KAAAC,EAAO,GACP,QAAAC,EAAU,WACV,MAAAC,EAAQ,UACR,KAAAC,EACA,GAAGC,CACL,EAAgB,CACd,MAAMC,EAAYC,EAChB,GAAGC,CAAM,UACT,GAAGA,CAAM,YAAYN,CAAO,GAC5B,GAAGM,CAAM,YAAYL,CAAK,GAC1BL,GAAO,GAAGU,CAAM,iBAChBR,GAAQ,GAAGQ,CAAM,gBAChB,CAACV,GAAO,CAACE,GAASI,GAAQ,GAAGI,CAAM,gBACpCH,EAAM,SAAW,GAAGG,CAAM,qBAC1BH,EAAM,SAAA,EAGFI,EAAU,IACVX,EAEAY,EAAC,MAAA,CACC,IAAAZ,EACA,IAAAC,EACA,MAAOE,EACP,OAAQA,EACR,MAAM,QACN,QAAQ,OACR,MAAO,CAAE,MAAO,OAAQ,OAAQ,MAAA,CAAO,CAAA,EAIzCD,EAEAU,EAACC,EAAA,CACC,MAAO,CACL,SAAUV,EAAO,EACjB,MAAO,cAAA,EAGR,WAAYD,CAAI,CAAA,CAAA,EAKnBI,GAGFM,EAACE,EAAA,CAAK,KAAK,OAAO,KAAMX,EAAO,IAAK,MAAO,CAAE,MAAO,cAAA,CAAe,CAAG,EAI1E,OACEY,EAAC,MAAA,CAAK,GAAGR,EAAO,MAAO,CAAE,MAAOJ,EAAM,OAAQA,EAAM,GAAGI,EAAM,KAAA,EAAS,UAAAC,EACnE,SAAA,CAAAG,EAAA,EACAJ,EAAM,SACNA,EAAM,SAAWK,EAACI,EAAA,CAAA,CAAO,CAAA,EAC5B,CAEJ,CAEA,MAAAC,EAAeC,EAAgBnB,CAAM"}
+{"version":3,"file":"index.js","sources":["../../../../../toolkit/src/string/string.ts","../../../src/display/Avatar/Avatar.tsx"],"sourcesContent":["export function sanitize(value: string) {\n  return value.normalize('NFD')\n    .trim().toLowerCase()\n    .replace(/a-zA-Z0-9_.-+/g, '')\n    .replace(/_/g, '')\n    .replace(/[^\\w\\s]/gi, '');\n};\n\nexport function getInitials(name: string) {\n  const names: string[] = name.trim().split(' ');\n\n  const hasOneName = names.length === 1;\n\n  const firstInitial = sanitize(names[0]).charAt(0).toLocaleUpperCase();\n\n  const secondInitial = hasOneName\n    ? sanitize(names[0]).charAt(1).toLocaleUpperCase()\n    : sanitize(names.reverse()[0]).charAt(0).toLocaleUpperCase();\n\n  return firstInitial + secondInitial;\n};\n\nexport function slug(str: string) {\n  if (!str) { return ''; }\n\n  return sanitize(str)\n    .replace(/\\s+/g, '-');\n}\n\nexport function capitalize(str: string) {\n  if (!str) { return ''; }\n  return str[0].toUpperCase() + str.slice(1);\n}\n\nexport function toKebabCase(value: string) {\n  return value.replace(/[A-Z]/g, match => `-${match.toLowerCase()}`);\n}","import { HTMLAttributes } from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\nimport type { Colors } from '@iziui/core/theme';\n\nimport { getInitials } from '@iziui/toolkit/string';\n\nimport Ripple from '@/actions/Ripple';\nimport createComponent from '@/core/createComponent';\n\nimport Icon from '../Icon';\nimport Typography from '../Typography';\n\nimport '@iziui/styles/components/Avatar.scss';\n\ninterface AvatarProps extends HTMLAttributes<HTMLElement> {\n  alt?: string;\n  src?: string;\n  name?: string;\n  size?: number;\n  color?: Colors;\n  variant?: 'rounded' | 'circular';\n  icon?: React.JSX.Element;\n}\nfunction Avatar({\n  src,\n  alt,\n  name,\n  size = 40,\n  variant = 'circular',\n  color = 'primary',\n  icon,\n  ...props\n}: AvatarProps) {\n  const className = joinClass(\n    `${prefix}-avatar`,\n    `${prefix}-avatar--${variant}`,\n    `${prefix}-avatar--${color}`,\n    src && `${prefix}-avatar--image`,\n    name && `${prefix}-avatar--name`,\n    (!src && !name) || icon && `${prefix}-avatar--icon`,\n    props.onClick && `${prefix}-avatar--clickable`,\n    props.className\n  );\n\n  const content = () => {\n    if (src) {\n      return (\n        <img\n          src={src}\n          alt={alt}\n          width={size}\n          height={size}\n          sizes=\"100vw\"\n          loading=\"lazy\"\n          style={{ width: '100%', height: 'auto' }}\n        />\n      );\n    }\n    if (name) {\n      return (\n        <Typography\n          style={{\n            fontSize: size / 2,\n            color: 'currentColor'\n          }}\n        >\n          {getInitials(name)}\n        </Typography>\n      );\n    }\n\n    if (icon) { return icon; }\n\n    return (\n      <Icon name=\"user\" size={size / 1.6} style={{ color: 'currentColor' }} />\n    );\n  };\n\n  return (\n    <div {...props} style={{ width: size, height: size, ...props.style }} className={className}>\n      {content()}\n      {props.children}\n      {props.onClick && <Ripple />}\n    </div>\n  );\n}\n\nexport default createComponent(Avatar);"],"names":["sanitize","value","getInitials","name","names","hasOneName","firstInitial","secondInitial","Avatar","src","alt","size","variant","color","icon","props","className","joinClass","prefix","content","jsx","Typography","Icon","jsxs","Ripple","Avatar_default","createComponent"],"mappings":"0hBAAO,SAASA,EAASC,EAAe,CACtC,OAAOA,EAAM,UAAU,KAAK,EACzB,KAAA,EAAO,cACP,QAAQ,iBAAkB,EAAE,EAC5B,QAAQ,KAAM,EAAE,EAChB,QAAQ,YAAa,EAAE,CAC5B,CAEO,SAASC,EAAYC,EAAc,CACxC,MAAMC,EAAkBD,EAAK,KAAA,EAAO,MAAM,GAAG,EAEvCE,EAAaD,EAAM,SAAW,EAE9BE,EAAeN,EAASI,EAAM,CAAC,CAAC,EAAE,OAAO,CAAC,EAAE,kBAAA,EAE5CG,EAAgBF,EAClBL,EAASI,EAAM,CAAC,CAAC,EAAE,OAAO,CAAC,EAAE,kBAAA,EAC7BJ,EAASI,EAAM,UAAU,CAAC,CAAC,EAAE,OAAO,CAAC,EAAE,kBAAA,EAE3C,OAAOE,EAAeC,CACxB,CCMA,SAASC,EAAO,CACd,IAAAC,EACA,IAAAC,EACA,KAAAP,EACA,KAAAQ,EAAO,GACP,QAAAC,EAAU,WACV,MAAAC,EAAQ,UACR,KAAAC,EACA,GAAGC,CACL,EAAgB,CACd,MAAMC,EAAYC,EAChB,GAAGC,CAAM,UACT,GAAGA,CAAM,YAAYN,CAAO,GAC5B,GAAGM,CAAM,YAAYL,CAAK,GAC1BJ,GAAO,GAAGS,CAAM,iBAChBf,GAAQ,GAAGe,CAAM,gBAChB,CAACT,GAAO,CAACN,GAASW,GAAQ,GAAGI,CAAM,gBACpCH,EAAM,SAAW,GAAGG,CAAM,qBAC1BH,EAAM,SAAA,EAGFI,EAAU,IACVV,EAEAW,EAAC,MAAA,CACC,IAAAX,EACA,IAAAC,EACA,MAAOC,EACP,OAAQA,EACR,MAAM,QACN,QAAQ,OACR,MAAO,CAAE,MAAO,OAAQ,OAAQ,MAAA,CAAO,CAAA,EAIzCR,EAEAiB,EAACC,EAAA,CACC,MAAO,CACL,SAAUV,EAAO,EACjB,MAAO,cAAA,EAGR,WAAYR,CAAI,CAAA,CAAA,EAKnBW,GAGFM,EAACE,EAAA,CAAK,KAAK,OAAO,KAAMX,EAAO,IAAK,MAAO,CAAE,MAAO,cAAA,CAAe,CAAG,EAI1E,OACEY,EAAC,MAAA,CAAK,GAAGR,EAAO,MAAO,CAAE,MAAOJ,EAAM,OAAQA,EAAM,GAAGI,EAAM,KAAA,EAAS,UAAAC,EACnE,SAAA,CAAAG,EAAA,EACAJ,EAAM,SACNA,EAAM,SAAWK,EAACI,EAAA,CAAA,CAAO,CAAA,EAC5B,CAEJ,CAEA,MAAAC,EAAeC,EAAgBlB,CAAM"}

package/dist/components/Box/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../chunks/Box-DdpIV_Bl.cjs");require("react/jsx-runtime");require("react");require("../../chunks/createComponent-Dkt68kvT.cjs");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");exports.default=e.Box;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../chunks/Box-BCKQa2JS.cjs");require("react/jsx-runtime");require("react");require("../../chunks/createComponent-B2C4sTOb.cjs");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");exports.default=e.Box;
 //# sourceMappingURL=index.cjs.map

package/dist/components/Box/index.js

@@ -1,2 +1,2 @@
-import{B as f}from"../../chunks/Box-O2jw08Hf.js";import"react/jsx-runtime";import"react";import"../../chunks/createComponent-CovqNaAJ.js";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";export{f as default};
+import{B as f}from"../../chunks/Box-Cs7u6zrl.js";import"react/jsx-runtime";import"react";import"../../chunks/createComponent-D-IheGJm.js";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";export{f as default};
 //# sourceMappingURL=index.js.map

package/dist/components/Button/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),m=require("react"),e=require("../../chunks/index-DYxwT4uW.cjs"),i=require("../../chunks/joinClass-Jk3EszKD.cjs"),d=require("../../chunks/Ripple-Dy4i91j1.cjs"),_=require("../../chunks/createComponent-Dkt68kvT.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");function j({size:o="medium",color:u="primary",variant:p="contained",startIcon:c,endIcon:l,loading:r,children:$,...s}){const f=i.joinClass(`${e.prefix}-button`,`${e.prefix}-button--${o}`,`${e.prefix}-button--${u}`,`${e.prefix}-button--${u}--${p}`,s.className),a=(t,b)=>m.cloneElement(t,{className:i.joinClass(t.props.className,`${e.prefix}-button__icon`,`${e.prefix}-button__icon--${b}`)}),x=t=>m.cloneElement(t,{className:i.joinClass(t.props.className,`${e.prefix}-button__loading`,`${e.prefix}-button__loading--${o}`),size:"1.1rem"});return n.jsxs("button",{...s,className:f,onClick:t=>!r&&s.onClick?.(t),children:[r?x(r):n.jsxs(n.Fragment,{children:[c&&a(c,"left"),$,l&&a(l,"right")]}),n.jsx(d.Ripple,{})]})}const q=_.createComponent(j);exports.default=q;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),m=require("react"),e=require("../../chunks/index-DYxwT4uW.cjs"),i=require("../../chunks/joinClass-Jk3EszKD.cjs"),d=require("../../chunks/Ripple-Dy4i91j1.cjs"),_=require("../../chunks/createComponent-B2C4sTOb.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");function j({size:o="medium",color:u="primary",variant:p="contained",startIcon:c,endIcon:l,loading:r,children:$,...s}){const f=i.joinClass(`${e.prefix}-button`,`${e.prefix}-button--${o}`,`${e.prefix}-button--${u}`,`${e.prefix}-button--${u}--${p}`,s.className),a=(t,b)=>m.cloneElement(t,{className:i.joinClass(t.props.className,`${e.prefix}-button__icon`,`${e.prefix}-button__icon--${b}`)}),x=t=>m.cloneElement(t,{className:i.joinClass(t.props.className,`${e.prefix}-button__loading`,`${e.prefix}-button__loading--${o}`),size:"1.1rem"});return n.jsxs("button",{...s,className:f,onClick:t=>!r&&s.onClick?.(t),children:[r?x(r):n.jsxs(n.Fragment,{children:[c&&a(c,"left"),$,l&&a(l,"right")]}),n.jsx(d.Ripple,{})]})}const q=_.createComponent(j);exports.default=q;
 //# sourceMappingURL=index.cjs.map

package/dist/components/Button/index.js

@@ -1,2 +1,2 @@
-import{jsxs as u,Fragment as d,jsx as _}from"react/jsx-runtime";import{cloneElement as l}from"react";import{p as t}from"../../chunks/index-CZ41y9Hn.js";import{j as e}from"../../chunks/joinClass-anSpaauN.js";import{R as N}from"../../chunks/Ripple-Bq9bxg4k.js";import{c as j}from"../../chunks/createComponent-CovqNaAJ.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";function x({size:m="medium",color:s="primary",variant:p="contained",startIcon:a,endIcon:i,loading:n,children:$,...r}){const f=e(`${t}-button`,`${t}-button--${m}`,`${t}-button--${s}`,`${t}-button--${s}--${p}`,r.className),c=(o,b)=>l(o,{className:e(o.props.className,`${t}-button__icon`,`${t}-button__icon--${b}`)});return u("button",{...r,className:f,onClick:o=>!n&&r.onClick?.(o),children:[n?(o=>l(o,{className:e(o.props.className,`${t}-button__loading`,`${t}-button__loading--${m}`),size:"1.1rem"}))(n):u(d,{children:[a&&c(a,"left"),$,i&&c(i,"right")]}),_(N,{})]})}const F=j(x);export{F as default};
+import{jsxs as u,Fragment as d,jsx as _}from"react/jsx-runtime";import{cloneElement as l}from"react";import{p as t}from"../../chunks/index-CZ41y9Hn.js";import{j as e}from"../../chunks/joinClass-anSpaauN.js";import{R as N}from"../../chunks/Ripple-Bq9bxg4k.js";import{c as j}from"../../chunks/createComponent-D-IheGJm.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";function x({size:m="medium",color:s="primary",variant:p="contained",startIcon:a,endIcon:i,loading:n,children:$,...r}){const f=e(`${t}-button`,`${t}-button--${m}`,`${t}-button--${s}`,`${t}-button--${s}--${p}`,r.className),c=(o,b)=>l(o,{className:e(o.props.className,`${t}-button__icon`,`${t}-button__icon--${b}`)});return u("button",{...r,className:f,onClick:o=>!n&&r.onClick?.(o),children:[n?(o=>l(o,{className:e(o.props.className,`${t}-button__loading`,`${t}-button__loading--${m}`),size:"1.1rem"}))(n):u(d,{children:[a&&c(a,"left"),$,i&&c(i,"right")]}),_(N,{})]})}const F=j(x);export{F as default};
 //# sourceMappingURL=index.js.map

package/dist/components/ButtonIcon/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../chunks/ButtonIcon-BMOZPxpN.cjs");require("react/jsx-runtime");require("react");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/joinClass-Jk3EszKD.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");require("../../chunks/createComponent-Dkt68kvT.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");exports.default=e.ButtonIcon;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../../chunks/ButtonIcon-CJ5Iz-uJ.cjs");require("react/jsx-runtime");require("react");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/joinClass-Jk3EszKD.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");require("../../chunks/createComponent-B2C4sTOb.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");exports.default=e.ButtonIcon;
 //# sourceMappingURL=index.cjs.map

package/dist/components/ButtonIcon/index.js

@@ -1,2 +1,2 @@
-import{B as l}from"../../chunks/ButtonIcon-CYO1Crb-.js";import"react/jsx-runtime";import"react";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/joinClass-anSpaauN.js";import"../../chunks/Ripple-Bq9bxg4k.js";import"../../chunks/createComponent-CovqNaAJ.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";export{l as default};
+import{B as l}from"../../chunks/ButtonIcon-mMZe5V_1.js";import"react/jsx-runtime";import"react";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/joinClass-anSpaauN.js";import"../../chunks/Ripple-Bq9bxg4k.js";import"../../chunks/createComponent-D-IheGJm.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";export{l as default};
 //# sourceMappingURL=index.js.map

package/dist/components/Card/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../chunks/Card-DtjP8NP7.cjs"),r=require("../../chunks/CardContent-BqqU9iwO.cjs");require("react/jsx-runtime");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/joinClass-Jk3EszKD.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");require("react");require("../../chunks/createComponent-Dkt68kvT.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");exports.Card=e.Card;exports.CardContent=r.CardContent;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../chunks/Card-CcOpPKfS.cjs"),r=require("../../chunks/CardContent-D2cDaP4l.cjs");require("react/jsx-runtime");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/joinClass-Jk3EszKD.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");require("react");require("../../chunks/createComponent-B2C4sTOb.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");exports.Card=e.Card;exports.CardContent=r.CardContent;
 //# sourceMappingURL=index.cjs.map

package/dist/components/Card/index.js

@@ -1,2 +1,2 @@
-import{C as f}from"../../chunks/Card-D_RFnUk2.js";import{C as s}from"../../chunks/CardContent-BsSfxSQH.js";import"react/jsx-runtime";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/joinClass-anSpaauN.js";import"../../chunks/Ripple-Bq9bxg4k.js";import"react";import"../../chunks/createComponent-CovqNaAJ.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";export{f as Card,s as CardContent};
+import{C as f}from"../../chunks/Card-DDRUwdlG.js";import{C as s}from"../../chunks/CardContent-DYAWf3xO.js";import"react/jsx-runtime";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/joinClass-anSpaauN.js";import"../../chunks/Ripple-Bq9bxg4k.js";import"react";import"../../chunks/createComponent-D-IheGJm.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";export{f as Card,s as CardContent};
 //# sourceMappingURL=index.js.map

package/dist/components/Checkbox/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),e=require("../../chunks/index-DYxwT4uW.cjs"),x=require("../../chunks/joinClass-Jk3EszKD.cjs"),h=require("../../chunks/Stack-B_lU0ez7.cjs"),b=require("../../chunks/createComponent-Dkt68kvT.cjs");require("react");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");function k({label:n,name:c,color:t="primary",checked:i,disabled:s,error:l,helperText:o,...u}){const a=x.joinClass(`${e.prefix}-checkbox`,`${e.prefix}-checkbox--${t}`,i&&`${e.prefix}-checkbox--${t}--checked`,s&&`${e.prefix}-checkbox--disabled`),p=x.joinClass(`${e.prefix}-checkbox__helper-text`,o&&`${e.prefix}-checkbox__helper-text--visible`,l&&`${e.prefix}-checkbox__helper-text--error`);return r.jsxs(h.Stack,{gap:4,children:[r.jsxs("label",{htmlFor:c,className:a,children:[r.jsx("input",{type:"checkbox",...u,id:c,name:c,checked:i,disabled:s}),n]}),r.jsx("span",{className:p,children:o})]})}const f=b.createComponent(k);exports.default=f;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),e=require("../../chunks/index-DYxwT4uW.cjs"),x=require("../../chunks/joinClass-Jk3EszKD.cjs"),h=require("../../chunks/Stack-lvjI3kV3.cjs"),b=require("../../chunks/createComponent-B2C4sTOb.cjs");require("react");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");function k({label:n,name:c,color:t="primary",checked:i,disabled:s,error:l,helperText:o,...u}){const a=x.joinClass(`${e.prefix}-checkbox`,`${e.prefix}-checkbox--${t}`,i&&`${e.prefix}-checkbox--${t}--checked`,s&&`${e.prefix}-checkbox--disabled`),p=x.joinClass(`${e.prefix}-checkbox__helper-text`,o&&`${e.prefix}-checkbox__helper-text--visible`,l&&`${e.prefix}-checkbox__helper-text--error`);return r.jsxs(h.Stack,{gap:4,children:[r.jsxs("label",{htmlFor:c,className:a,children:[r.jsx("input",{type:"checkbox",...u,id:c,name:c,checked:i,disabled:s}),n]}),r.jsx("span",{className:p,children:o})]})}const f=b.createComponent(k);exports.default=f;
 //# sourceMappingURL=index.cjs.map

package/dist/components/Checkbox/index.js

@@ -1,2 +1,2 @@
-import{jsxs as p,jsx as i}from"react/jsx-runtime";import{p as e}from"../../chunks/index-CZ41y9Hn.js";import{j as h}from"../../chunks/joinClass-anSpaauN.js";import{S as n}from"../../chunks/Stack-Deow48Th.js";import{c as k}from"../../chunks/createComponent-CovqNaAJ.js";import"react";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";function f({label:x,name:o,color:c="primary",checked:r,disabled:t,error:a,helperText:s,...m}){const l=h(`${e}-checkbox`,`${e}-checkbox--${c}`,r&&`${e}-checkbox--${c}--checked`,t&&`${e}-checkbox--disabled`),b=h(`${e}-checkbox__helper-text`,s&&`${e}-checkbox__helper-text--visible`,a&&`${e}-checkbox__helper-text--error`);return p(n,{gap:4,children:[p("label",{htmlFor:o,className:l,children:[i("input",{type:"checkbox",...m,id:o,name:o,checked:r,disabled:t}),x]}),i("span",{className:b,children:s})]})}const S=k(f);export{S as default};
+import{jsxs as p,jsx as i}from"react/jsx-runtime";import{p as e}from"../../chunks/index-CZ41y9Hn.js";import{j as h}from"../../chunks/joinClass-anSpaauN.js";import{S as n}from"../../chunks/Stack-C2zMFX0w.js";import{c as k}from"../../chunks/createComponent-D-IheGJm.js";import"react";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";function f({label:x,name:o,color:c="primary",checked:r,disabled:t,error:a,helperText:s,...m}){const l=h(`${e}-checkbox`,`${e}-checkbox--${c}`,r&&`${e}-checkbox--${c}--checked`,t&&`${e}-checkbox--disabled`),b=h(`${e}-checkbox__helper-text`,s&&`${e}-checkbox__helper-text--visible`,a&&`${e}-checkbox__helper-text--error`);return p(n,{gap:4,children:[p("label",{htmlFor:o,className:l,children:[i("input",{type:"checkbox",...m,id:o,name:o,checked:r,disabled:t}),x]}),i("span",{className:b,children:s})]})}const S=k(f);export{S as default};
 //# sourceMappingURL=index.js.map

package/dist/components/CheckboxGroup/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const C=require("react/jsx-runtime"),c=require("react"),x=require("../../chunks/index-DYxwT4uW.cjs"),b=require("../../chunks/joinClass-Jk3EszKD.cjs"),q=require("../../chunks/Stack-B_lU0ez7.cjs"),E=require("../../chunks/createComponent-Dkt68kvT.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");let g=0;function j({children:d,values:r,onChange:a,className:i}){const l=++g,n=c.Children.toArray(d),k=b.joinClass(`${x.prefix}-checkbox-group`,i),[s,p]=c.useState(n.map(e=>({id:e.props.name,value:e.props.value,checked:r?r.some(o=>o===e.props.name):!1}))),m=c.useCallback(()=>n.map((e,o)=>{const f=e.props.name;return c.cloneElement(e,{key:o,name:`${e.props.name}-${l}`,checked:e.props.checked||s[o].checked,onChange:h=>{const u=s.map(t=>t.id===f?{...t,checked:h.target.checked}:t);a&&a(u),p(u)}})}),[r,s]);return c.useEffect(()=>{p(n.map(e=>({id:e.props.name,value:e.props.value,checked:r?r.some(o=>o===e.props.name):!1})))},[r]),C.jsx(q.Stack,{gap:2,className:k,children:m()})}const y=E.createComponent(j);exports.default=y;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const C=require("react/jsx-runtime"),c=require("react"),x=require("../../chunks/index-DYxwT4uW.cjs"),b=require("../../chunks/joinClass-Jk3EszKD.cjs"),q=require("../../chunks/Stack-lvjI3kV3.cjs"),E=require("../../chunks/createComponent-B2C4sTOb.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");let g=0;function j({children:d,values:r,onChange:a,className:i}){const l=++g,n=c.Children.toArray(d),k=b.joinClass(`${x.prefix}-checkbox-group`,i),[s,p]=c.useState(n.map(e=>({id:e.props.name,value:e.props.value,checked:r?r.some(o=>o===e.props.name):!1}))),m=c.useCallback(()=>n.map((e,o)=>{const f=e.props.name;return c.cloneElement(e,{key:o,name:`${e.props.name}-${l}`,checked:e.props.checked||s[o].checked,onChange:h=>{const u=s.map(t=>t.id===f?{...t,checked:h.target.checked}:t);a&&a(u),p(u)}})}),[r,s]);return c.useEffect(()=>{p(n.map(e=>({id:e.props.name,value:e.props.value,checked:r?r.some(o=>o===e.props.name):!1})))},[r]),C.jsx(q.Stack,{gap:2,className:k,children:m()})}const y=E.createComponent(j);exports.default=y;
 //# sourceMappingURL=index.cjs.map

package/dist/components/CheckboxGroup/index.js

@@ -1,2 +1,2 @@
-import{jsx as i}from"react/jsx-runtime";import{Children as C,useState as x,useCallback as b,cloneElement as E,useEffect as y}from"react";import{p as g}from"../../chunks/index-CZ41y9Hn.js";import{j}from"../../chunks/joinClass-anSpaauN.js";import{S}from"../../chunks/Stack-Deow48Th.js";import{c as $}from"../../chunks/createComponent-CovqNaAJ.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";let A=0;function G({children:m,values:r,onChange:a,className:f}){const k=++A,p=C.toArray(m),d=j(`${g}-checkbox-group`,f),[c,n]=x(p.map(e=>({id:e.props.name,value:e.props.value,checked:r?r.some(o=>o===e.props.name):!1}))),u=b(()=>p.map((e,o)=>{const h=e.props.name;return E(e,{key:o,name:`${e.props.name}-${k}`,checked:e.props.checked||c[o].checked,onChange:l=>{const t=c.map(s=>s.id===h?{...s,checked:l.target.checked}:s);a&&a(t),n(t)}})}),[r,c]);return y(()=>{n(p.map(e=>({id:e.props.name,value:e.props.value,checked:r?r.some(o=>o===e.props.name):!1})))},[r]),i(S,{gap:2,className:d,children:u()})}const q=$(G);export{q as default};
+import{jsx as i}from"react/jsx-runtime";import{Children as C,useState as x,useCallback as b,cloneElement as E,useEffect as y}from"react";import{p as g}from"../../chunks/index-CZ41y9Hn.js";import{j}from"../../chunks/joinClass-anSpaauN.js";import{S}from"../../chunks/Stack-C2zMFX0w.js";import{c as $}from"../../chunks/createComponent-D-IheGJm.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";let A=0;function G({children:m,values:r,onChange:a,className:f}){const k=++A,p=C.toArray(m),d=j(`${g}-checkbox-group`,f),[c,n]=x(p.map(e=>({id:e.props.name,value:e.props.value,checked:r?r.some(o=>o===e.props.name):!1}))),u=b(()=>p.map((e,o)=>{const h=e.props.name;return E(e,{key:o,name:`${e.props.name}-${k}`,checked:e.props.checked||c[o].checked,onChange:l=>{const t=c.map(s=>s.id===h?{...s,checked:l.target.checked}:s);a&&a(t),n(t)}})}),[r,c]);return y(()=>{n(p.map(e=>({id:e.props.name,value:e.props.value,checked:r?r.some(o=>o===e.props.name):!1})))},[r]),i(S,{gap:2,className:d,children:u()})}const q=$(G);export{q as default};
 //# sourceMappingURL=index.js.map

package/dist/components/Chip/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react/jsx-runtime"),a=require("react"),e=require("../../chunks/index-DYxwT4uW.cjs"),o=require("../../chunks/joinClass-Jk3EszKD.cjs"),p=require("../../chunks/Ripple-Dy4i91j1.cjs"),j=require("../../chunks/useTheme-DsrjDJKC.cjs"),C=require("../../chunks/createComponent-Dkt68kvT.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");const _=a.forwardRef(({label:n,icon:t,size:u="medium",color:l="default",variant:d="contained",onDelete:c,...s},h)=>{const{theme:{mode:m}}=j.useTheme(),x=o.joinClass(`${e.prefix}-chip`,`${e.prefix}-chip--${m}`,`${e.prefix}-chip--${l}`,`${e.prefix}-chip--${l}--${d}`,`${e.prefix}-chip--${u}`,c&&`${e.prefix}-chip--deletable`,s.onClick&&`${e.prefix}-chip--clickable`,s.className),f=r=>a.cloneElement(r,{size:14,className:o.joinClass(r.props.className,`${e.prefix}-chip__icon`,n&&`${e.prefix}-chip__icon--margin`)}),$=r=>{r.stopPropagation(),c&&c()};return i.jsxs("div",{...s,ref:h,className:x,style:{...s.style},children:[t&&f(t),i.jsx("span",{children:n}),s.onClick&&i.jsx(p.Ripple,{}),c&&i.jsxs("button",{className:`${e.prefix}-chip__delete-icon`,onClick:$,children:[i.jsx("i",{className:"uil uil-times-circle"}),i.jsx(p.Ripple,{})]})]})}),q=C.createComponent(_);exports.default=q;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react/jsx-runtime"),a=require("react"),e=require("../../chunks/index-DYxwT4uW.cjs"),o=require("../../chunks/joinClass-Jk3EszKD.cjs"),p=require("../../chunks/Ripple-Dy4i91j1.cjs"),j=require("../../chunks/useTheme-DsrjDJKC.cjs"),C=require("../../chunks/createComponent-B2C4sTOb.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");const _=a.forwardRef(({label:n,icon:t,size:u="medium",color:l="default",variant:d="contained",onDelete:c,...s},h)=>{const{theme:{mode:m}}=j.useTheme(),x=o.joinClass(`${e.prefix}-chip`,`${e.prefix}-chip--${m}`,`${e.prefix}-chip--${l}`,`${e.prefix}-chip--${l}--${d}`,`${e.prefix}-chip--${u}`,c&&`${e.prefix}-chip--deletable`,s.onClick&&`${e.prefix}-chip--clickable`,s.className),f=r=>a.cloneElement(r,{size:14,className:o.joinClass(r.props.className,`${e.prefix}-chip__icon`,n&&`${e.prefix}-chip__icon--margin`)}),$=r=>{r.stopPropagation(),c&&c()};return i.jsxs("div",{...s,ref:h,className:x,style:{...s.style},children:[t&&f(t),i.jsx("span",{children:n}),s.onClick&&i.jsx(p.Ripple,{}),c&&i.jsxs("button",{className:`${e.prefix}-chip__delete-icon`,onClick:$,children:[i.jsx("i",{className:"uil uil-times-circle"}),i.jsx(p.Ripple,{})]})]})}),q=C.createComponent(_);exports.default=q;
 //# sourceMappingURL=index.cjs.map

package/dist/components/Chip/index.js

@@ -1,2 +1,2 @@
-import{jsxs as r,jsx as t}from"react/jsx-runtime";import{forwardRef as _,cloneElement as N}from"react";import{p as i}from"../../chunks/index-CZ41y9Hn.js";import{j as l}from"../../chunks/joinClass-anSpaauN.js";import{R as n}from"../../chunks/Ripple-Bq9bxg4k.js";import{u as j}from"../../chunks/useTheme-BYuNiCiH.js";import{c as k}from"../../chunks/createComponent-CovqNaAJ.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";const x=_(({label:a,icon:m,size:p="medium",color:o="default",variant:h="contained",onDelete:c,...e},d)=>{const{theme:{mode:$}}=j(),f=l(`${i}-chip`,`${i}-chip--${$}`,`${i}-chip--${o}`,`${i}-chip--${o}--${h}`,`${i}-chip--${p}`,c&&`${i}-chip--deletable`,e.onClick&&`${i}-chip--clickable`,e.className),u=s=>N(s,{size:14,className:l(s.props.className,`${i}-chip__icon`,a&&`${i}-chip__icon--margin`)}),C=s=>{s.stopPropagation(),c&&c()};return r("div",{...e,ref:d,className:f,style:{...e.style},children:[m&&u(m),t("span",{children:a}),e.onClick&&t(n,{}),c&&r("button",{className:`${i}-chip__delete-icon`,onClick:C,children:[t("i",{className:"uil uil-times-circle"}),t(n,{})]})]})}),I=k(x);export{I as default};
+import{jsxs as r,jsx as t}from"react/jsx-runtime";import{forwardRef as _,cloneElement as N}from"react";import{p as i}from"../../chunks/index-CZ41y9Hn.js";import{j as l}from"../../chunks/joinClass-anSpaauN.js";import{R as n}from"../../chunks/Ripple-Bq9bxg4k.js";import{u as j}from"../../chunks/useTheme-BYuNiCiH.js";import{c as k}from"../../chunks/createComponent-D-IheGJm.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";const x=_(({label:a,icon:m,size:p="medium",color:o="default",variant:h="contained",onDelete:c,...e},d)=>{const{theme:{mode:$}}=j(),f=l(`${i}-chip`,`${i}-chip--${$}`,`${i}-chip--${o}`,`${i}-chip--${o}--${h}`,`${i}-chip--${p}`,c&&`${i}-chip--deletable`,e.onClick&&`${i}-chip--clickable`,e.className),u=s=>N(s,{size:14,className:l(s.props.className,`${i}-chip__icon`,a&&`${i}-chip__icon--margin`)}),C=s=>{s.stopPropagation(),c&&c()};return r("div",{...e,ref:d,className:f,style:{...e.style},children:[m&&u(m),t("span",{children:a}),e.onClick&&t(n,{}),c&&r("button",{className:`${i}-chip__delete-icon`,onClick:C,children:[t("i",{className:"uil uil-times-circle"}),t(n,{})]})]})}),I=k(x);export{I as default};
 //# sourceMappingURL=index.js.map

package/dist/components/ColorPicker/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),d=require("react"),e=require("../../chunks/index-DYxwT4uW.cjs"),s=require("../../chunks/joinClass-Jk3EszKD.cjs"),x=require("../../chunks/generateSupportColors-CTMoGhDf.cjs"),m=require("../../chunks/createComponent-Dkt68kvT.cjs"),R=require("../../chunks/Box-DdpIV_Bl.cjs"),C=require("../../chunks/Icon-CIrgQex7.cjs"),E=require("../../chunks/Stack-B_lU0ez7.cjs"),I=require("../../chunks/useTheme-DsrjDJKC.cjs"),_=require("../../chunks/useMenu-DewYBiar.cjs");require("../../chunks/useListenerResized-AwpsZLcP.cjs");require("../../chunks/Card-DtjP8NP7.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");require("../../chunks/CardContent-BqqU9iwO.cjs");const k=["#00aae6","#2e72fe","#6f4dff","#9f40f1","#9e2dbf","#db5bdc","#ea479b","#ff83a8","#d80051","#eb3d32","#fa8d2f","#f5cd2b","#93ca00","#62d26f","#38c5ab","#87969f"];function O({label:n,error:i,helperText:t,fitContent:b,value:c=k[0],autoClose:j,onChange:h,onInput:$,...q}){const{theme:{palette:a}}=I.useTheme(),l=d.useRef(null),[g,N,p]=_.useMenu(),u=d.useMemo(()=>m.uuid(),[]),y=s.joinClass(`${e.prefix}-color-picker__label`,i&&`${e.prefix}-color-picker__label--error`),v=s.joinClass(`${e.prefix}-color-picker-container`,i&&`${e.prefix}-color-picker-container--error`),M=s.joinClass(`${e.prefix}-color-picker`,i&&`${e.prefix}-color-picker--error`),S=s.joinClass(`${e.prefix}-color-picker__value`,i&&`${e.prefix}-color-picker__value--error`),w=s.joinClass(`${e.prefix}-color-picker__helper-text`,t&&`${e.prefix}-color-picker__helper-text--visible`,i&&`${e.prefix}-color-picker__helper-text--error`),f=o=>s.joinClass(`${e.prefix}-color-picker__color__icon`,c===o&&`${e.prefix}-color-picker__color__icon--visible`);function P(o){l.current&&(l.current.value=o,l.current.dispatchEvent(new Event("input",{bubbles:!0})))}return r.jsxs("div",{className:v,children:[n&&r.jsxs("label",{className:y,children:[n," ",q.required&&"*"]}),r.jsxs("button",{type:"button",onClick:p,className:M,children:[r.jsx("div",{className:`${e.prefix}-color-picker__preview`,children:r.jsx("div",{style:{backgroundColor:c}})}),r.jsx("div",{className:S,children:c})]}),r.jsx("span",{className:w,children:t}),r.jsx(_.Menu,{direction:"left",autoClose:j,open:g,anchorEl:N,width:b?"fit-content":"",onClose:p,children:r.jsx(R.Box,{sx:{p:1},children:r.jsxs(E.Stack,{gap:8,flexDirection:"row",justifyContent:"center",style:{flexWrap:"wrap"},children:[k.map(o=>r.jsx("button",{type:"button",className:`${e.prefix}-color-picker__color`,onClick:()=>P(o),style:{backgroundColor:o},children:r.jsx(C.Icon,{name:"check",className:f(o),style:{color:x.getContrastColor(c)}})},o)),r.jsxs("label",{htmlFor:`color-picker-${u}`,className:`${e.prefix}-color-picker__color`,style:{backgroundColor:a.grey.main},children:[r.jsx(C.Icon,{name:"plus",className:f(c),style:{color:x.getContrastColor(a.grey.main)}}),r.jsx("input",{ref:l,type:"color",id:`color-picker-${u}`,value:c,onChange:h,onInput:$})]})]})})})]})}const T=m.createComponent(O);exports.default=T;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("react/jsx-runtime"),d=require("react"),e=require("../../chunks/index-DYxwT4uW.cjs"),s=require("../../chunks/joinClass-Jk3EszKD.cjs"),x=require("../../chunks/generateSupportColors-CTMoGhDf.cjs"),P=require("../../chunks/uuid-omnJ9TjZ.cjs"),R=require("../../chunks/Box-BCKQa2JS.cjs"),C=require("../../chunks/Icon-CFvy-l1V.cjs"),E=require("../../chunks/Stack-lvjI3kV3.cjs"),I=require("../../chunks/useTheme-DsrjDJKC.cjs"),_=require("../../chunks/useMenu-C2KhwKNS.cjs"),O=require("../../chunks/createComponent-B2C4sTOb.cjs");require("../../chunks/useListenerResized-AwpsZLcP.cjs");require("../../chunks/Card-CcOpPKfS.cjs");require("../../chunks/Ripple-Dy4i91j1.cjs");require("../../chunks/CardContent-D2cDaP4l.cjs");const k=["#00aae6","#2e72fe","#6f4dff","#9f40f1","#9e2dbf","#db5bdc","#ea479b","#ff83a8","#d80051","#eb3d32","#fa8d2f","#f5cd2b","#93ca00","#62d26f","#38c5ab","#87969f"];function T({label:n,error:i,helperText:t,fitContent:m,value:c=k[0],autoClose:b,onChange:j,onInput:h,...$}){const{theme:{palette:a}}=I.useTheme(),l=d.useRef(null),[q,g,u]=_.useMenu(),p=d.useMemo(()=>P.uuid(),[]),N=s.joinClass(`${e.prefix}-color-picker__label`,i&&`${e.prefix}-color-picker__label--error`),y=s.joinClass(`${e.prefix}-color-picker-container`,i&&`${e.prefix}-color-picker-container--error`),v=s.joinClass(`${e.prefix}-color-picker`,i&&`${e.prefix}-color-picker--error`),M=s.joinClass(`${e.prefix}-color-picker__value`,i&&`${e.prefix}-color-picker__value--error`),S=s.joinClass(`${e.prefix}-color-picker__helper-text`,t&&`${e.prefix}-color-picker__helper-text--visible`,i&&`${e.prefix}-color-picker__helper-text--error`),f=o=>s.joinClass(`${e.prefix}-color-picker__color__icon`,c===o&&`${e.prefix}-color-picker__color__icon--visible`);function w(o){l.current&&(l.current.value=o,l.current.dispatchEvent(new Event("input",{bubbles:!0})))}return r.jsxs("div",{className:y,children:[n&&r.jsxs("label",{className:N,children:[n," ",$.required&&"*"]}),r.jsxs("button",{type:"button",onClick:u,className:v,children:[r.jsx("div",{className:`${e.prefix}-color-picker__preview`,children:r.jsx("div",{style:{backgroundColor:c}})}),r.jsx("div",{className:M,children:c})]}),r.jsx("span",{className:S,children:t}),r.jsx(_.Menu,{direction:"left",autoClose:b,open:q,anchorEl:g,width:m?"fit-content":"",onClose:u,children:r.jsx(R.Box,{sx:{p:1},children:r.jsxs(E.Stack,{gap:8,flexDirection:"row",justifyContent:"center",style:{flexWrap:"wrap"},children:[k.map(o=>r.jsx("button",{type:"button",className:`${e.prefix}-color-picker__color`,onClick:()=>w(o),style:{backgroundColor:o},children:r.jsx(C.Icon,{name:"check",className:f(o),style:{color:x.getContrastColor(c)}})},o)),r.jsxs("label",{htmlFor:`color-picker-${p}`,className:`${e.prefix}-color-picker__color`,style:{backgroundColor:a.grey.main},children:[r.jsx(C.Icon,{name:"plus",className:f(c),style:{color:x.getContrastColor(a.grey.main)}}),r.jsx("input",{ref:l,type:"color",id:`color-picker-${p}`,value:c,onChange:j,onInput:h})]})]})})})]})}const B=O.createComponent(T);exports.default=B;
 //# sourceMappingURL=index.cjs.map

package/dist/components/ColorPicker/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/fields/ColorPicker/colors.ts","../../../src/fields/ColorPicker/ColorPicker.tsx"],"sourcesContent":["export default [\n  '#00aae6',\n  '#2e72fe',\n  '#6f4dff',\n  '#9f40f1',\n  '#9e2dbf',\n  '#db5bdc',\n  '#ea479b',\n  '#ff83a8',\n  '#d80051',\n  '#eb3d32',\n  '#fa8d2f',\n  '#f5cd2b',\n  '#93ca00',\n  '#62d26f',\n  '#38c5ab',\n  '#87969f',\n];","import {\n  useRef,\n  useMemo,\n  type InputHTMLAttributes,\n} from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\nimport { getContrastColor } from '@iziui/core/utils';\n\nimport { uuid } from '@iziui/toolkit/uuid';\n\nimport Box from '@/layout/Box';\nimport Icon from '@/display/Icon';\nimport Stack from '@/layout/Stack';\nimport { useTheme } from '@/theme';\nimport { Menu, useMenu } from '@/navigation/Menu';\n\nimport COLORS from './colors';\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/ColorPicker.scss';\n\nexport interface ColorPickerProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value'> {\n  label?: string;\n  value: string;\n  error?: boolean;\n  helperText?: string;\n  fitContent?: boolean;\n  autoClose?: boolean;\n}\n\nfunction ColorPicker({\n  label,\n  error,\n  helperText,\n  fitContent,\n  value = COLORS[0],\n  autoClose,\n  onChange,\n  onInput,\n  ...props\n}: ColorPickerProps) {\n  const { theme: { palette } } = useTheme();\n\n  const inputRef = useRef<HTMLInputElement | null>(null);\n\n  const [open, el, toggle] = useMenu();\n\n  const id = useMemo(() => uuid(), []);\n\n  const labelClss = joinClass(\n    `${prefix}-color-picker__label`,\n    error && `${prefix}-color-picker__label--error`,\n  );\n\n  const containerClassName = joinClass(\n    `${prefix}-color-picker-container`,\n    error && `${prefix}-color-picker-container--error`,\n  );\n\n  const colorPickerClassName = joinClass(\n    `${prefix}-color-picker`,\n    error && `${prefix}-color-picker--error`,\n  );\n\n  const valueClassName = joinClass(\n    `${prefix}-color-picker__value`,\n    error && `${prefix}-color-picker__value--error`,\n  );\n\n  const helperTextClss = joinClass(\n    `${prefix}-color-picker__helper-text`,\n    helperText && `${prefix}-color-picker__helper-text--visible`,\n    error && `${prefix}-color-picker__helper-text--error`,\n  );\n\n  const iconClassName = (c: string) => joinClass(\n    `${prefix}-color-picker__color__icon`,\n    value === c && `${prefix}-color-picker__color__icon--visible`,\n  );\n\n  function handleColorChange(color: string) {\n    if (!inputRef.current) { return; }\n    // if (autoClose) { toggle(); }\n\n    inputRef.current.value = color;\n    inputRef.current.dispatchEvent(new Event('input', { bubbles: true }));\n  }\n\n  return (\n    <div className={containerClassName}>\n      {label && <label className={labelClss}>{label} {props.required && '*'}</label>}\n      <button type=\"button\" onClick={toggle} className={colorPickerClassName}>\n        <div className={`${prefix}-color-picker__preview`}>\n          <div style={{ backgroundColor: value }} />\n        </div>\n        <div className={valueClassName}>\n          {value}\n        </div>\n      </button>\n      <span className={helperTextClss}>{helperText}</span>\n      <Menu\n        direction=\"left\"\n        autoClose={autoClose}\n        open={open}\n        anchorEl={el}\n        width={fitContent ? 'fit-content' : ''}\n        onClose={toggle}\n      >\n        <Box sx={{ p: 1 }}>\n          <Stack\n            gap={8}\n            flexDirection=\"row\"\n            justifyContent=\"center\"\n            style={{ flexWrap: 'wrap' }}\n          >\n            {\n              COLORS.map((c) => (\n                <button\n                  key={c}\n                  type=\"button\"\n                  className={`${prefix}-color-picker__color`}\n                  onClick={() => handleColorChange(c)}\n                  style={{ backgroundColor: c }}\n                >\n                  <Icon\n                    name=\"check\"\n                    className={iconClassName(c)}\n                    style={{ color: getContrastColor(value) }}\n                  />\n                </button>\n              ))\n            }\n            <label\n              htmlFor={`color-picker-${id}`}\n              className={`${prefix}-color-picker__color`}\n              style={{ backgroundColor: palette.grey.main }}\n            >\n              <Icon\n                name=\"plus\"\n                className={iconClassName(value)}\n                style={{ color: getContrastColor(palette.grey.main) }}\n              />\n              <input\n                ref={inputRef}\n                type=\"color\"\n                id={`color-picker-${id}`}\n                value={value}\n                onChange={onChange}\n                onInput={onInput}\n              />\n            </label>\n          </Stack>\n        </Box>\n      </Menu>\n    </div>\n  );\n}\n\nexport default createComponent(ColorPicker);\n"],"names":["COLORS","ColorPicker","label","error","helperText","fitContent","value","autoClose","onChange","onInput","props","palette","useTheme","inputRef","useRef","open","el","toggle","useMenu","id","useMemo","uuid","labelClss","joinClass","prefix","containerClassName","colorPickerClassName","valueClassName","helperTextClss","iconClassName","c","handleColorChange","color","jsxs","jsx","Menu","Box","Stack","Icon","getContrastColor","ColorPicker_default","createComponent"],"mappings":"wxBAAA,MAAAA,EAAe,CACb,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,UACA,SACF,ECgBA,SAASC,EAAY,CACnB,MAAAC,EACA,MAAAC,EACA,WAAAC,EACA,WAAAC,EACA,MAAAC,EAAQN,EAAO,CAAC,EAChB,UAAAO,EACA,SAAAC,EACA,QAAAC,EACA,GAAGC,CACL,EAAqB,CACnB,KAAM,CAAE,MAAO,CAAE,QAAAC,CAAA,CAAQ,EAAMC,EAAAA,SAAA,EAEzBC,EAAWC,EAAAA,OAAgC,IAAI,EAE/C,CAACC,EAAMC,EAAIC,CAAM,EAAIC,EAAAA,QAAA,EAErBC,EAAKC,EAAAA,QAAQ,IAAMC,EAAAA,KAAA,EAAQ,CAAA,CAAE,EAE7BC,EAAYC,EAAAA,UAChB,GAAGC,EAAAA,MAAM,uBACTrB,GAAS,GAAGqB,EAAAA,MAAM,6BAAA,EAGdC,EAAqBF,EAAAA,UACzB,GAAGC,EAAAA,MAAM,0BACTrB,GAAS,GAAGqB,EAAAA,MAAM,gCAAA,EAGdE,EAAuBH,EAAAA,UAC3B,GAAGC,EAAAA,MAAM,gBACTrB,GAAS,GAAGqB,EAAAA,MAAM,sBAAA,EAGdG,EAAiBJ,EAAAA,UACrB,GAAGC,EAAAA,MAAM,uBACTrB,GAAS,GAAGqB,EAAAA,MAAM,6BAAA,EAGdI,EAAiBL,EAAAA,UACrB,GAAGC,EAAAA,MAAM,6BACTpB,GAAc,GAAGoB,EAAAA,MAAM,sCACvBrB,GAAS,GAAGqB,EAAAA,MAAM,mCAAA,EAGdK,EAAiBC,GAAcP,EAAAA,UACnC,GAAGC,EAAAA,MAAM,6BACTlB,IAAUwB,GAAK,GAAGN,EAAAA,MAAM,qCAAA,EAG1B,SAASO,EAAkBC,EAAe,CACnCnB,EAAS,UAGdA,EAAS,QAAQ,MAAQmB,EACzBnB,EAAS,QAAQ,cAAc,IAAI,MAAM,QAAS,CAAE,QAAS,EAAA,CAAM,CAAC,EACtE,CAEA,OACEoB,EAAAA,KAAC,MAAA,CAAI,UAAWR,EACb,SAAA,CAAAvB,GAAS+B,EAAAA,KAAC,QAAA,CAAM,UAAWX,EAAY,SAAA,CAAApB,EAAM,IAAEQ,EAAM,UAAY,GAAA,EAAI,SACrE,SAAA,CAAO,KAAK,SAAS,QAASO,EAAQ,UAAWS,EAChD,SAAA,CAAAQ,EAAAA,IAAC,MAAA,CAAI,UAAW,GAAGV,EAAAA,MAAM,yBACvB,SAAAU,EAAAA,IAAC,MAAA,CAAI,MAAO,CAAE,gBAAiB5B,CAAA,CAAM,CAAG,EAC1C,EACA4B,EAAAA,IAAC,MAAA,CAAI,UAAWP,EACb,SAAArB,CAAA,CACH,CAAA,EACF,EACA4B,EAAAA,IAAC,OAAA,CAAK,UAAWN,EAAiB,SAAAxB,EAAW,EAC7C8B,EAAAA,IAACC,EAAAA,KAAA,CACC,UAAU,OACV,UAAA5B,EACA,KAAAQ,EACA,SAAUC,EACV,MAAOX,EAAa,cAAgB,GACpC,QAASY,EAET,eAACmB,EAAAA,IAAA,CAAI,GAAI,CAAE,EAAG,GACZ,SAAAH,EAAAA,KAACI,EAAAA,MAAA,CACC,IAAK,EACL,cAAc,MACd,eAAe,SACf,MAAO,CAAE,SAAU,MAAA,EAGjB,SAAA,CAAArC,EAAO,IAAK8B,GACVI,EAAAA,IAAC,SAAA,CAEC,KAAK,SACL,UAAW,GAAGV,EAAAA,MAAM,uBACpB,QAAS,IAAMO,EAAkBD,CAAC,EAClC,MAAO,CAAE,gBAAiBA,CAAA,EAE1B,SAAAI,EAAAA,IAACI,EAAAA,KAAA,CACC,KAAK,QACL,UAAWT,EAAcC,CAAC,EAC1B,MAAO,CAAE,MAAOS,EAAAA,iBAAiBjC,CAAK,CAAA,CAAE,CAAA,CAC1C,EAVKwB,CAAA,CAYR,EAEHG,EAAAA,KAAC,QAAA,CACC,QAAS,gBAAgBd,CAAE,GAC3B,UAAW,GAAGK,EAAAA,MAAM,uBACpB,MAAO,CAAE,gBAAiBb,EAAQ,KAAK,IAAA,EAEvC,SAAA,CAAAuB,EAAAA,IAACI,EAAAA,KAAA,CACC,KAAK,OACL,UAAWT,EAAcvB,CAAK,EAC9B,MAAO,CAAE,MAAOiC,EAAAA,iBAAiB5B,EAAQ,KAAK,IAAI,CAAA,CAAE,CAAA,EAEtDuB,EAAAA,IAAC,QAAA,CACC,IAAKrB,EACL,KAAK,QACL,GAAI,gBAAgBM,CAAE,GACtB,MAAAb,EACA,SAAAE,EACA,QAAAC,CAAA,CAAA,CACF,CAAA,CAAA,CACF,CAAA,CAAA,CACF,CACF,CAAA,CAAA,CACF,EACF,CAEJ,CAEA,MAAA+B,EAAeC,EAAAA,gBAAgBxC,CAAW"}
+{"version":3,"file":"index.cjs","sources":["../../../src/fields/ColorPicker/colors.ts","../../../src/fields/ColorPicker/ColorPicker.tsx"],"sourcesContent":["export default [\n  '#00aae6',\n  '#2e72fe',\n  '#6f4dff',\n  '#9f40f1',\n  '#9e2dbf',\n  '#db5bdc',\n  '#ea479b',\n  '#ff83a8',\n  '#d80051',\n  '#eb3d32',\n  '#fa8d2f',\n  '#f5cd2b',\n  '#93ca00',\n  '#62d26f',\n  '#38c5ab',\n  '#87969f',\n];","import {\n  useRef,\n  useMemo,\n  type InputHTMLAttributes,\n} from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\nimport { getContrastColor } from '@iziui/core/utils';\n\nimport { uuid } from '@iziui/toolkit/uuid';\n\nimport Box from '@/layout/Box';\nimport Icon from '@/display/Icon';\nimport Stack from '@/layout/Stack';\nimport { useTheme } from '@/theme';\nimport { Menu, useMenu } from '@/navigation/Menu';\n\nimport COLORS from './colors';\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/ColorPicker.scss';\n\nexport interface ColorPickerProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value'> {\n  label?: string;\n  value: string;\n  error?: boolean;\n  helperText?: string;\n  fitContent?: boolean;\n  autoClose?: boolean;\n}\n\nfunction ColorPicker({\n  label,\n  error,\n  helperText,\n  fitContent,\n  value = COLORS[0],\n  autoClose,\n  onChange,\n  onInput,\n  ...props\n}: ColorPickerProps) {\n  const { theme: { palette } } = useTheme();\n\n  const inputRef = useRef<HTMLInputElement | null>(null);\n\n  const [open, el, toggle] = useMenu();\n\n  const id = useMemo(() => uuid(), []);\n\n  const labelClss = joinClass(\n    `${prefix}-color-picker__label`,\n    error && `${prefix}-color-picker__label--error`,\n  );\n\n  const containerClassName = joinClass(\n    `${prefix}-color-picker-container`,\n    error && `${prefix}-color-picker-container--error`,\n  );\n\n  const colorPickerClassName = joinClass(\n    `${prefix}-color-picker`,\n    error && `${prefix}-color-picker--error`,\n  );\n\n  const valueClassName = joinClass(\n    `${prefix}-color-picker__value`,\n    error && `${prefix}-color-picker__value--error`,\n  );\n\n  const helperTextClss = joinClass(\n    `${prefix}-color-picker__helper-text`,\n    helperText && `${prefix}-color-picker__helper-text--visible`,\n    error && `${prefix}-color-picker__helper-text--error`,\n  );\n\n  const iconClassName = (c: string) => joinClass(\n    `${prefix}-color-picker__color__icon`,\n    value === c && `${prefix}-color-picker__color__icon--visible`,\n  );\n\n  function handleColorChange(color: string) {\n    if (!inputRef.current) { return; }\n    // if (autoClose) { toggle(); }\n\n    inputRef.current.value = color;\n    inputRef.current.dispatchEvent(new Event('input', { bubbles: true }));\n  }\n\n  return (\n    <div className={containerClassName}>\n      {label && <label className={labelClss}>{label} {props.required && '*'}</label>}\n      <button type=\"button\" onClick={toggle} className={colorPickerClassName}>\n        <div className={`${prefix}-color-picker__preview`}>\n          <div style={{ backgroundColor: value }} />\n        </div>\n        <div className={valueClassName}>\n          {value}\n        </div>\n      </button>\n      <span className={helperTextClss}>{helperText}</span>\n      <Menu\n        direction=\"left\"\n        autoClose={autoClose}\n        open={open}\n        anchorEl={el}\n        width={fitContent ? 'fit-content' : ''}\n        onClose={toggle}\n      >\n        <Box sx={{ p: 1 }}>\n          <Stack\n            gap={8}\n            flexDirection=\"row\"\n            justifyContent=\"center\"\n            style={{ flexWrap: 'wrap' }}\n          >\n            {\n              COLORS.map((c) => (\n                <button\n                  key={c}\n                  type=\"button\"\n                  className={`${prefix}-color-picker__color`}\n                  onClick={() => handleColorChange(c)}\n                  style={{ backgroundColor: c }}\n                >\n                  <Icon\n                    name=\"check\"\n                    className={iconClassName(c)}\n                    style={{ color: getContrastColor(value) }}\n                  />\n                </button>\n              ))\n            }\n            <label\n              htmlFor={`color-picker-${id}`}\n              className={`${prefix}-color-picker__color`}\n              style={{ backgroundColor: palette.grey.main }}\n            >\n              <Icon\n                name=\"plus\"\n                className={iconClassName(value)}\n                style={{ color: getContrastColor(palette.grey.main) }}\n              />\n              <input\n                ref={inputRef}\n                type=\"color\"\n                id={`color-picker-${id}`}\n                value={value}\n                onChange={onChange}\n                onInput={onInput}\n              />\n            </label>\n          </Stack>\n        </Box>\n      </Menu>\n    </div>\n  );\n}\n\nexport default createComponent(ColorPicker);\n"],"names":["COLORS","ColorPicker","label","error","helperText","fitContent","value","autoClose","onChange","onInput","props","palette","useTheme","inputRef","useRef","open","el","toggle","useMenu","id","useMemo","uuid","labelClss","joinClass","prefix","containerClassName","colorPickerClassName","valueClassName","helperTextClss","iconClassName","c","handleColorChange","color","jsxs","jsx","Menu","Box","Stack","Icon","getContrastColor","ColorPicker_default","createComponent"],"mappings":"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"}

package/dist/components/ColorPicker/index.js

@@ -1,2 +1,2 @@
-import{jsxs as i,jsx as e}from"react/jsx-runtime";import{useRef as P,useMemo as R}from"react";import{p as o}from"../../chunks/index-CZ41y9Hn.js";import{j as l}from"../../chunks/joinClass-anSpaauN.js";import{b as u}from"../../chunks/generateSupportColors-BN5t8dA-.js";import{c as S,u as B}from"../../chunks/createComponent-CovqNaAJ.js";import{B as I}from"../../chunks/Box-O2jw08Hf.js";import{I as _}from"../../chunks/Icon-imOBrsbL.js";import{S as O}from"../../chunks/Stack-Deow48Th.js";import{u as q}from"../../chunks/useTheme-BYuNiCiH.js";import{u as D,M as F}from"../../chunks/useMenu-DuX7EGHi.js";import"../../chunks/useListenerResized-Bnqxrt7k.js";import"../../chunks/Card-D_RFnUk2.js";import"../../chunks/Ripple-Bq9bxg4k.js";import"../../chunks/CardContent-BsSfxSQH.js";const k=["#00aae6","#2e72fe","#6f4dff","#9f40f1","#9e2dbf","#db5bdc","#ea479b","#ff83a8","#d80051","#eb3d32","#fa8d2f","#f5cd2b","#93ca00","#62d26f","#38c5ab","#87969f"];function L({label:s,error:t,helperText:a,fitContent:b,value:c=k[0],autoClose:h,onChange:C,onInput:$,...N}){const{theme:{palette:p}}=q(),n=P(null),[y,x,m]=D(),f=R(()=>B(),[]),g=l(`${o}-color-picker__label`,t&&`${o}-color-picker__label--error`),v=l(`${o}-color-picker-container`,t&&`${o}-color-picker-container--error`),j=l(`${o}-color-picker`,t&&`${o}-color-picker--error`),w=l(`${o}-color-picker__value`,t&&`${o}-color-picker__value--error`),M=l(`${o}-color-picker__helper-text`,a&&`${o}-color-picker__helper-text--visible`,t&&`${o}-color-picker__helper-text--error`),d=r=>l(`${o}-color-picker__color__icon`,c===r&&`${o}-color-picker__color__icon--visible`);function E(r){n.current&&(n.current.value=r,n.current.dispatchEvent(new Event("input",{bubbles:!0})))}return i("div",{className:v,children:[s&&i("label",{className:g,children:[s," ",N.required&&"*"]}),i("button",{type:"button",onClick:m,className:j,children:[e("div",{className:`${o}-color-picker__preview`,children:e("div",{style:{backgroundColor:c}})}),e("div",{className:w,children:c})]}),e("span",{className:M,children:a}),e(F,{direction:"left",autoClose:h,open:y,anchorEl:x,width:b?"fit-content":"",onClose:m,children:e(I,{sx:{p:1},children:i(O,{gap:8,flexDirection:"row",justifyContent:"center",style:{flexWrap:"wrap"},children:[k.map(r=>e("button",{type:"button",className:`${o}-color-picker__color`,onClick:()=>E(r),style:{backgroundColor:r},children:e(_,{name:"check",className:d(r),style:{color:u(c)}})},r)),i("label",{htmlFor:`color-picker-${f}`,className:`${o}-color-picker__color`,style:{backgroundColor:p.grey.main},children:[e(_,{name:"plus",className:d(c),style:{color:u(p.grey.main)}}),e("input",{ref:n,type:"color",id:`color-picker-${f}`,value:c,onChange:C,onInput:$})]})]})})})]})}const eo=S(L);export{eo as default};
+import{jsxs as i,jsx as e}from"react/jsx-runtime";import{useRef as P,useMemo as R}from"react";import{p as o}from"../../chunks/index-CZ41y9Hn.js";import{j as l}from"../../chunks/joinClass-anSpaauN.js";import{b as u}from"../../chunks/generateSupportColors-BN5t8dA-.js";import{u as S}from"../../chunks/uuid-dGvr9vBZ.js";import{B}from"../../chunks/Box-Cs7u6zrl.js";import{I as _}from"../../chunks/Icon-B2zjgYkr.js";import{S as I}from"../../chunks/Stack-C2zMFX0w.js";import{u as O}from"../../chunks/useTheme-BYuNiCiH.js";import{u as q,M as D}from"../../chunks/useMenu-DLaxCUF_.js";import{c as F}from"../../chunks/createComponent-D-IheGJm.js";import"../../chunks/useListenerResized-Bnqxrt7k.js";import"../../chunks/Card-DDRUwdlG.js";import"../../chunks/Ripple-Bq9bxg4k.js";import"../../chunks/CardContent-DYAWf3xO.js";const k=["#00aae6","#2e72fe","#6f4dff","#9f40f1","#9e2dbf","#db5bdc","#ea479b","#ff83a8","#d80051","#eb3d32","#fa8d2f","#f5cd2b","#93ca00","#62d26f","#38c5ab","#87969f"];function L({label:s,error:t,helperText:a,fitContent:b,value:c=k[0],autoClose:h,onChange:C,onInput:$,...N}){const{theme:{palette:p}}=O(),n=P(null),[y,x,m]=q(),f=R(()=>S(),[]),g=l(`${o}-color-picker__label`,t&&`${o}-color-picker__label--error`),v=l(`${o}-color-picker-container`,t&&`${o}-color-picker-container--error`),j=l(`${o}-color-picker`,t&&`${o}-color-picker--error`),w=l(`${o}-color-picker__value`,t&&`${o}-color-picker__value--error`),M=l(`${o}-color-picker__helper-text`,a&&`${o}-color-picker__helper-text--visible`,t&&`${o}-color-picker__helper-text--error`),d=r=>l(`${o}-color-picker__color__icon`,c===r&&`${o}-color-picker__color__icon--visible`);function E(r){n.current&&(n.current.value=r,n.current.dispatchEvent(new Event("input",{bubbles:!0})))}return i("div",{className:v,children:[s&&i("label",{className:g,children:[s," ",N.required&&"*"]}),i("button",{type:"button",onClick:m,className:j,children:[e("div",{className:`${o}-color-picker__preview`,children:e("div",{style:{backgroundColor:c}})}),e("div",{className:w,children:c})]}),e("span",{className:M,children:a}),e(D,{direction:"left",autoClose:h,open:y,anchorEl:x,width:b?"fit-content":"",onClose:m,children:e(B,{sx:{p:1},children:i(I,{gap:8,flexDirection:"row",justifyContent:"center",style:{flexWrap:"wrap"},children:[k.map(r=>e("button",{type:"button",className:`${o}-color-picker__color`,onClick:()=>E(r),style:{backgroundColor:r},children:e(_,{name:"check",className:d(r),style:{color:u(c)}})},r)),i("label",{htmlFor:`color-picker-${f}`,className:`${o}-color-picker__color`,style:{backgroundColor:p.grey.main},children:[e(_,{name:"plus",className:d(c),style:{color:u(p.grey.main)}}),e("input",{ref:n,type:"color",id:`color-picker-${f}`,value:c,onChange:C,onInput:$})]})]})})})]})}const ro=F(L);export{ro as default};
 //# sourceMappingURL=index.js.map

package/dist/components/ColorPicker/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/fields/ColorPicker/colors.ts","../../../src/fields/ColorPicker/ColorPicker.tsx"],"sourcesContent":["export default [\n  '#00aae6',\n  '#2e72fe',\n  '#6f4dff',\n  '#9f40f1',\n  '#9e2dbf',\n  '#db5bdc',\n  '#ea479b',\n  '#ff83a8',\n  '#d80051',\n  '#eb3d32',\n  '#fa8d2f',\n  '#f5cd2b',\n  '#93ca00',\n  '#62d26f',\n  '#38c5ab',\n  '#87969f',\n];","import {\n  useRef,\n  useMemo,\n  type InputHTMLAttributes,\n} from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\nimport { getContrastColor } from '@iziui/core/utils';\n\nimport { uuid } from '@iziui/toolkit/uuid';\n\nimport Box from '@/layout/Box';\nimport Icon from '@/display/Icon';\nimport Stack from '@/layout/Stack';\nimport { useTheme } from '@/theme';\nimport { Menu, useMenu } from '@/navigation/Menu';\n\nimport COLORS from './colors';\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/ColorPicker.scss';\n\nexport interface ColorPickerProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value'> {\n  label?: string;\n  value: string;\n  error?: boolean;\n  helperText?: string;\n  fitContent?: boolean;\n  autoClose?: boolean;\n}\n\nfunction ColorPicker({\n  label,\n  error,\n  helperText,\n  fitContent,\n  value = COLORS[0],\n  autoClose,\n  onChange,\n  onInput,\n  ...props\n}: ColorPickerProps) {\n  const { theme: { palette } } = useTheme();\n\n  const inputRef = useRef<HTMLInputElement | null>(null);\n\n  const [open, el, toggle] = useMenu();\n\n  const id = useMemo(() => uuid(), []);\n\n  const labelClss = joinClass(\n    `${prefix}-color-picker__label`,\n    error && `${prefix}-color-picker__label--error`,\n  );\n\n  const containerClassName = joinClass(\n    `${prefix}-color-picker-container`,\n    error && `${prefix}-color-picker-container--error`,\n  );\n\n  const colorPickerClassName = joinClass(\n    `${prefix}-color-picker`,\n    error && `${prefix}-color-picker--error`,\n  );\n\n  const valueClassName = joinClass(\n    `${prefix}-color-picker__value`,\n    error && `${prefix}-color-picker__value--error`,\n  );\n\n  const helperTextClss = joinClass(\n    `${prefix}-color-picker__helper-text`,\n    helperText && `${prefix}-color-picker__helper-text--visible`,\n    error && `${prefix}-color-picker__helper-text--error`,\n  );\n\n  const iconClassName = (c: string) => joinClass(\n    `${prefix}-color-picker__color__icon`,\n    value === c && `${prefix}-color-picker__color__icon--visible`,\n  );\n\n  function handleColorChange(color: string) {\n    if (!inputRef.current) { return; }\n    // if (autoClose) { toggle(); }\n\n    inputRef.current.value = color;\n    inputRef.current.dispatchEvent(new Event('input', { bubbles: true }));\n  }\n\n  return (\n    <div className={containerClassName}>\n      {label && <label className={labelClss}>{label} {props.required && '*'}</label>}\n      <button type=\"button\" onClick={toggle} className={colorPickerClassName}>\n        <div className={`${prefix}-color-picker__preview`}>\n          <div style={{ backgroundColor: value }} />\n        </div>\n        <div className={valueClassName}>\n          {value}\n        </div>\n      </button>\n      <span className={helperTextClss}>{helperText}</span>\n      <Menu\n        direction=\"left\"\n        autoClose={autoClose}\n        open={open}\n        anchorEl={el}\n        width={fitContent ? 'fit-content' : ''}\n        onClose={toggle}\n      >\n        <Box sx={{ p: 1 }}>\n          <Stack\n            gap={8}\n            flexDirection=\"row\"\n            justifyContent=\"center\"\n            style={{ flexWrap: 'wrap' }}\n          >\n            {\n              COLORS.map((c) => (\n                <button\n                  key={c}\n                  type=\"button\"\n                  className={`${prefix}-color-picker__color`}\n                  onClick={() => handleColorChange(c)}\n                  style={{ backgroundColor: c }}\n                >\n                  <Icon\n                    name=\"check\"\n                    className={iconClassName(c)}\n                    style={{ color: getContrastColor(value) }}\n                  />\n                </button>\n              ))\n            }\n            <label\n              htmlFor={`color-picker-${id}`}\n              className={`${prefix}-color-picker__color`}\n              style={{ backgroundColor: palette.grey.main }}\n            >\n              <Icon\n                name=\"plus\"\n                className={iconClassName(value)}\n                style={{ color: getContrastColor(palette.grey.main) }}\n              />\n              <input\n                ref={inputRef}\n                type=\"color\"\n                id={`color-picker-${id}`}\n                value={value}\n                onChange={onChange}\n                onInput={onInput}\n              />\n            </label>\n          </Stack>\n        </Box>\n      </Menu>\n    </div>\n  );\n}\n\nexport default createComponent(ColorPicker);\n"],"names":["COLORS","ColorPicker","label","error","helperText","fitContent","value","autoClose","onChange","onInput","props","palette","useTheme","inputRef","useRef","open","el","toggle","useMenu","id","useMemo","uuid","labelClss","joinClass","prefix","containerClassName","colorPickerClassName","valueClassName","helperTextClss","iconClassName","c","handleColorChange","color","jsxs","jsx","Menu","Box","Stack","Icon","getContrastColor","ColorPicker_default","createComponent"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../src/fields/ColorPicker/colors.ts","../../../src/fields/ColorPicker/ColorPicker.tsx"],"sourcesContent":["export default [\n  '#00aae6',\n  '#2e72fe',\n  '#6f4dff',\n  '#9f40f1',\n  '#9e2dbf',\n  '#db5bdc',\n  '#ea479b',\n  '#ff83a8',\n  '#d80051',\n  '#eb3d32',\n  '#fa8d2f',\n  '#f5cd2b',\n  '#93ca00',\n  '#62d26f',\n  '#38c5ab',\n  '#87969f',\n];","import {\n  useRef,\n  useMemo,\n  type InputHTMLAttributes,\n} from 'react';\n\nimport { prefix } from '@iziui/tokens/web/js';\n\nimport { joinClass } from '@iziui/core/utils/joinClass';\nimport { getContrastColor } from '@iziui/core/utils';\n\nimport { uuid } from '@iziui/toolkit/uuid';\n\nimport Box from '@/layout/Box';\nimport Icon from '@/display/Icon';\nimport Stack from '@/layout/Stack';\nimport { useTheme } from '@/theme';\nimport { Menu, useMenu } from '@/navigation/Menu';\n\nimport COLORS from './colors';\nimport createComponent from '../../core/createComponent';\n\nimport '@iziui/styles/components/ColorPicker.scss';\n\nexport interface ColorPickerProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value'> {\n  label?: string;\n  value: string;\n  error?: boolean;\n  helperText?: string;\n  fitContent?: boolean;\n  autoClose?: boolean;\n}\n\nfunction ColorPicker({\n  label,\n  error,\n  helperText,\n  fitContent,\n  value = COLORS[0],\n  autoClose,\n  onChange,\n  onInput,\n  ...props\n}: ColorPickerProps) {\n  const { theme: { palette } } = useTheme();\n\n  const inputRef = useRef<HTMLInputElement | null>(null);\n\n  const [open, el, toggle] = useMenu();\n\n  const id = useMemo(() => uuid(), []);\n\n  const labelClss = joinClass(\n    `${prefix}-color-picker__label`,\n    error && `${prefix}-color-picker__label--error`,\n  );\n\n  const containerClassName = joinClass(\n    `${prefix}-color-picker-container`,\n    error && `${prefix}-color-picker-container--error`,\n  );\n\n  const colorPickerClassName = joinClass(\n    `${prefix}-color-picker`,\n    error && `${prefix}-color-picker--error`,\n  );\n\n  const valueClassName = joinClass(\n    `${prefix}-color-picker__value`,\n    error && `${prefix}-color-picker__value--error`,\n  );\n\n  const helperTextClss = joinClass(\n    `${prefix}-color-picker__helper-text`,\n    helperText && `${prefix}-color-picker__helper-text--visible`,\n    error && `${prefix}-color-picker__helper-text--error`,\n  );\n\n  const iconClassName = (c: string) => joinClass(\n    `${prefix}-color-picker__color__icon`,\n    value === c && `${prefix}-color-picker__color__icon--visible`,\n  );\n\n  function handleColorChange(color: string) {\n    if (!inputRef.current) { return; }\n    // if (autoClose) { toggle(); }\n\n    inputRef.current.value = color;\n    inputRef.current.dispatchEvent(new Event('input', { bubbles: true }));\n  }\n\n  return (\n    <div className={containerClassName}>\n      {label && <label className={labelClss}>{label} {props.required && '*'}</label>}\n      <button type=\"button\" onClick={toggle} className={colorPickerClassName}>\n        <div className={`${prefix}-color-picker__preview`}>\n          <div style={{ backgroundColor: value }} />\n        </div>\n        <div className={valueClassName}>\n          {value}\n        </div>\n      </button>\n      <span className={helperTextClss}>{helperText}</span>\n      <Menu\n        direction=\"left\"\n        autoClose={autoClose}\n        open={open}\n        anchorEl={el}\n        width={fitContent ? 'fit-content' : ''}\n        onClose={toggle}\n      >\n        <Box sx={{ p: 1 }}>\n          <Stack\n            gap={8}\n            flexDirection=\"row\"\n            justifyContent=\"center\"\n            style={{ flexWrap: 'wrap' }}\n          >\n            {\n              COLORS.map((c) => (\n                <button\n                  key={c}\n                  type=\"button\"\n                  className={`${prefix}-color-picker__color`}\n                  onClick={() => handleColorChange(c)}\n                  style={{ backgroundColor: c }}\n                >\n                  <Icon\n                    name=\"check\"\n                    className={iconClassName(c)}\n                    style={{ color: getContrastColor(value) }}\n                  />\n                </button>\n              ))\n            }\n            <label\n              htmlFor={`color-picker-${id}`}\n              className={`${prefix}-color-picker__color`}\n              style={{ backgroundColor: palette.grey.main }}\n            >\n              <Icon\n                name=\"plus\"\n                className={iconClassName(value)}\n                style={{ color: getContrastColor(palette.grey.main) }}\n              />\n              <input\n                ref={inputRef}\n                type=\"color\"\n                id={`color-picker-${id}`}\n                value={value}\n                onChange={onChange}\n                onInput={onInput}\n              />\n            </label>\n          </Stack>\n        </Box>\n      </Menu>\n    </div>\n  );\n}\n\nexport default createComponent(ColorPicker);\n"],"names":["COLORS","ColorPicker","label","error","helperText","fitContent","value","autoClose","onChange","onInput","props","palette","useTheme","inputRef","useRef","open","el","toggle","useMenu","id","useMemo","uuid","labelClss","joinClass","prefix","containerClassName","colorPickerClassName","valueClassName","helperTextClss","iconClassName","c","handleColorChange","color","jsxs","jsx","Menu","Box","Stack","Icon","getContrastColor","ColorPicker_default","createComponent"],"mappings":"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"}

package/dist/components/Container/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const q=require("react/jsx-runtime"),s=require("react"),C=require("../../chunks/joinClass-Jk3EszKD.cjs"),g=require("../../chunks/useResize-Dnf6Ktrn.cjs"),f=require("../../chunks/createComponent-Dkt68kvT.cjs");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");const j=s.forwardRef(function({sm:o="100%",md:r=750,lg:i=950,children:u,tag:a="div",...n},c){const[l,e]=s.useState(0),t={sm:o,lg:i,md:r},d=C.joinClass(n.className);g.useResize({onXs:()=>e(t.sm),onSm:()=>e(t.md),onMd:()=>e(t.md),onLg:()=>e(t.lg),onXl:()=>e(t.lg)});const m=a;return q.jsx(m,{...n,ref:c,style:{width:"100%",maxWidth:l,margin:"auto",...n.style},className:d,children:u})}),h=f.createComponent(j);exports.default=h;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const q=require("react/jsx-runtime"),s=require("react"),C=require("../../chunks/joinClass-Jk3EszKD.cjs"),g=require("../../chunks/useResize-Dnf6Ktrn.cjs"),f=require("../../chunks/createComponent-B2C4sTOb.cjs");require("../../chunks/index-DYxwT4uW.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");const j=s.forwardRef(function({sm:o="100%",md:r=750,lg:i=950,children:u,tag:a="div",...n},c){const[l,e]=s.useState(0),t={sm:o,lg:i,md:r},d=C.joinClass(n.className);g.useResize({onXs:()=>e(t.sm),onSm:()=>e(t.md),onMd:()=>e(t.md),onLg:()=>e(t.lg),onXl:()=>e(t.lg)});const m=a;return q.jsx(m,{...n,ref:c,style:{width:"100%",maxWidth:l,margin:"auto",...n.style},className:d,children:u})}),h=f.createComponent(j);exports.default=h;
 //# sourceMappingURL=index.cjs.map

package/dist/components/Container/index.js

@@ -1,2 +1,2 @@
-import{jsx as f}from"react/jsx-runtime";import{forwardRef as l,useState as u}from"react";import{j as C}from"../../chunks/joinClass-anSpaauN.js";import{u as g}from"../../chunks/useResize-BUftB918.js";import{c as p}from"../../chunks/createComponent-CovqNaAJ.js";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";const h=l(function({sm:m="100%",md:n=750,lg:a=950,children:e,tag:r="div",...s},i){const[c,t]=u(0),o={sm:m,lg:a,md:n},d=C(s.className);return g({onXs:()=>t(o.sm),onSm:()=>t(o.md),onMd:()=>t(o.md),onLg:()=>t(o.lg),onXl:()=>t(o.lg)}),f(r,{...s,ref:i,style:{width:"100%",maxWidth:c,margin:"auto",...s.style},className:d,children:e})}),X=p(h);export{X as default};
+import{jsx as f}from"react/jsx-runtime";import{forwardRef as l,useState as u}from"react";import{j as C}from"../../chunks/joinClass-anSpaauN.js";import{u as g}from"../../chunks/useResize-BUftB918.js";import{c as p}from"../../chunks/createComponent-D-IheGJm.js";import"../../chunks/index-CZ41y9Hn.js";import"../../chunks/useTheme-BYuNiCiH.js";import"../../chunks/generateSupportColors-BN5t8dA-.js";const h=l(function({sm:m="100%",md:n=750,lg:a=950,children:e,tag:r="div",...s},i){const[c,t]=u(0),o={sm:m,lg:a,md:n},d=C(s.className);return g({onXs:()=>t(o.sm),onSm:()=>t(o.md),onMd:()=>t(o.md),onLg:()=>t(o.lg),onXl:()=>t(o.lg)}),f(r,{...s,ref:i,style:{width:"100%",maxWidth:c,margin:"auto",...s.style},className:d,children:e})}),X=p(h);export{X as default};
 //# sourceMappingURL=index.js.map

package/dist/components/Divider/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react/jsx-runtime"),t=require("../../chunks/index-DYxwT4uW.cjs"),s=require("../../chunks/joinClass-Jk3EszKD.cjs"),n=require("../../chunks/createComponent-Dkt68kvT.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("react");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");function u({...e}){const r=s.joinClass(`${t.prefix}-divider`,e.className);return i.jsx("div",{...e,className:r})}const o=n.createComponent(u);exports.default=o;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("react/jsx-runtime"),t=require("../../chunks/index-DYxwT4uW.cjs"),s=require("../../chunks/joinClass-Jk3EszKD.cjs"),n=require("../../chunks/createComponent-B2C4sTOb.cjs");require("../../chunks/useTheme-DsrjDJKC.cjs");require("react");require("../../chunks/generateSupportColors-CTMoGhDf.cjs");function u({...e}){const r=s.joinClass(`${t.prefix}-divider`,e.className);return i.jsx("div",{...e,className:r})}const o=n.createComponent(u);exports.default=o;
 //# sourceMappingURL=index.cjs.map