@jbpark/ui-kit 2.4.0 → 2.7.0

package/dist/Menu.d.mts

@@ -41,8 +41,8 @@ type ClickEventHandler = (params: {
 }) => void;
 declare const MENU_CLASSNAMES: string[];
 type SelectionMap = ReadonlyMap<React.Key, boolean>;
-declare function buildSelectionMap(items: MenuItem[], selectedKeysSet: ReadonlySet<React.Key>): SelectionMap;
-declare function findKey(menu: MenuItem, targetKeys: ReadonlySet<React.Key>): boolean;
+declare const buildSelectionMap: (items: MenuItem[], selectedKeysSet: ReadonlySet<React.Key>) => SelectionMap;
+declare const findKey: (menu: MenuItem, targetKeys: ReadonlySet<React.Key>) => boolean;
 declare const Menu: ({
   items,
   mode,

package/dist/Menu.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.d.mts","names":[],"sources":["../src/components/molecules/Menu/index.tsx"],"mappings":";;;UAQiB,QAAA;EACf,KAAA,EAAO,KAAA,CAAM,SAAA;EACb,GAAA,EAAK,KAAA,CAAM,GAAA;EACX,IAAA;EACA,IAAA;EACA,QAAA,GAAW,QAAA;AAAA;AAAA,UAGI,KAAA;EACf,IAAA;EACA,YAAA,GAAe,KAAA,CAAM,GAAA;EACrB,mBAAA,GAAsB,KAAA,CAAM,GAAA;EAC5B,YAAA,GAAe,YAAA;EACf,MAAA;EACA,YAAA;EACA,UAAA;IACE,QAAA;IACA,OAAA;IACA,IAAA;IACA,KAAA;EAAA;EAGF,MAAA;IACE,QAAA,GAAW,KAAA,CAAM,aAAA;IACjB,OAAA,GAAU,KAAA,CAAM,aAAA;IAChB,IAAA,GAAO,KAAA,CAAM,aAAA;IACb,KAAA,GAAQ,KAAA,CAAM,aAAA;EAAA;EAGhB,OAAA,GAAU,iBAAA;EACV,QAAA,GAAW,iBAAA;AAAA;AAAA,UAGI,SAAA,SAEb,KAAA,EACA,IAAA,CAAK,KAAA,CAAM,wBAAA;EACb,KAAA,GAAQ,QAAA;AAAA;AAAA,KAGE,iBAAA,IAAqB,MAAA;EAC/B,QAAA,EAAU,KAAA,CAAM,UAAA;EAChB,GAAA,EAAK,KAAA,CAAM,GAAA;EACX,OAAA,EAAS,KAAA,CAAM,GAAA;EACf,IAAA,EAAM,QAAA;AAAA;AAAA,cAGK,eAAA;AAAA,KAQD,YAAA,GAAe,WAAA,CAAY,KAAA,CAAM,GAAA;AAAA,iBAE7B,iBAAA,CACd,KAAA,EAAO,QAAA,IACP,eAAA,EAAiB,WAAA,CAAY,KAAA,CAAM,GAAA,IAClC,YAAA;AAAA,iBAea,OAAA,CACd,IAAA,EAAM,QAAA,EACN,UAAA,EAAY,WAAA,CAAY,KAAA,CAAM,GAAA;AAAA,cAiB1B,IAAA;EAAQ,KAAA;EAAA,IAAA;EAAA,mBAAA;EAAA,YAAA,EAAA,aAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAA,MAAA;EAAA,YAAA;EAAA,OAAA;EAAA,QAAA,EAAA,SAAA;EAAA,GAAA;AAAA,GAaX,SAAA,KAAS,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"Menu.d.mts","names":[],"sources":["../src/components/molecules/Menu/index.tsx"],"mappings":";;;UAQiB,QAAA;EACf,KAAA,EAAO,KAAA,CAAM,SAAA;EACb,GAAA,EAAK,KAAA,CAAM,GAAA;EACX,IAAA;EACA,IAAA;EACA,QAAA,GAAW,QAAA;AAAA;AAAA,UAGI,KAAA;EACf,IAAA;EACA,YAAA,GAAe,KAAA,CAAM,GAAA;EACrB,mBAAA,GAAsB,KAAA,CAAM,GAAA;EAC5B,YAAA,GAAe,YAAA;EACf,MAAA;EACA,YAAA;EACA,UAAA;IACE,QAAA;IACA,OAAA;IACA,IAAA;IACA,KAAA;EAAA;EAGF,MAAA;IACE,QAAA,GAAW,KAAA,CAAM,aAAA;IACjB,OAAA,GAAU,KAAA,CAAM,aAAA;IAChB,IAAA,GAAO,KAAA,CAAM,aAAA;IACb,KAAA,GAAQ,KAAA,CAAM,aAAA;EAAA;EAGhB,OAAA,GAAU,iBAAA;EACV,QAAA,GAAW,iBAAA;AAAA;AAAA,UAGI,SAAA,SAEb,KAAA,EACA,IAAA,CAAK,KAAA,CAAM,wBAAA;EACb,KAAA,GAAQ,QAAA;AAAA;AAAA,KAGE,iBAAA,IAAqB,MAAA;EAC/B,QAAA,EAAU,KAAA,CAAM,UAAA;EAChB,GAAA,EAAK,KAAA,CAAM,GAAA;EACX,OAAA,EAAS,KAAA,CAAM,GAAA;EACf,IAAA,EAAM,QAAA;AAAA;AAAA,cAGK,eAAA;AAAA,KAQD,YAAA,GAAe,WAAA,CAAY,KAAA,CAAM,GAAA;AAAA,cAEhC,iBAAA,GACX,KAAA,EAAO,QAAA,IACP,eAAA,EAAiB,WAAA,CAAY,KAAA,CAAM,GAAA,MAClC,YAAA;AAAA,cAeU,OAAA,GACX,IAAA,EAAM,QAAA,EACN,UAAA,EAAY,WAAA,CAAY,KAAA,CAAM,GAAA;AAAA,cAiB1B,IAAA;EAAQ,KAAA;EAAA,IAAA;EAAA,mBAAA;EAAA,YAAA,EAAA,aAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAA,MAAA;EAAA,YAAA;EAAA,OAAA;EAAA,QAAA,EAAA,SAAA;EAAA,GAAA;AAAA,GAaX,SAAA,KAAS,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/Menu.mjs

@@ -12,7 +12,7 @@ const MENU_CLASSNAMES = [
 	"shadow-md",
 	"rounded-md"
 ];
-function buildSelectionMap(items, selectedKeysSet) {
+const buildSelectionMap = (items, selectedKeysSet) => {
 	const map = /* @__PURE__ */ new Map();
 	const dfs = (node) => {
 		const self = selectedKeysSet.has(node.key);
@@ -23,14 +23,14 @@ function buildSelectionMap(items, selectedKeysSet) {
 	};
 	items.forEach(dfs);
 	return map;
-}
-function findKey(menu, targetKeys) {
+};
+const findKey = (menu, targetKeys) => {
 	if (targetKeys.has(menu.key)) return true;
 	if (menu.children && Array.isArray(menu.children)) {
 		for (const child of menu.children) if (findKey(child, targetKeys)) return true;
 	}
 	return false;
-}
+};
 const Menu = ({ items, mode = "vertical", defaultSelectedKeys = [], selectedKeys: _selectedKeys, className, classNames, styles, offset, inlineOffset, onClick, onSelect: _onSelect, ...props }) => {
 	const controlled = _selectedKeys !== void 0;
 	const [uncontrolledSelectedKeys, setUncontrolledSelectedKeys] = useState(defaultSelectedKeys ?? []);

package/dist/Menu.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.mjs","names":[],"sources":["../src/components/molecules/Menu/index.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo, useState } from 'react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport Item from './Item';\n\nexport interface MenuItem {\n  label: React.ReactNode;\n  key: React.Key;\n  type?: string;\n  path?: string;\n  children?: MenuItem[];\n}\n\nexport interface Props {\n  mode?: 'horizontal' | 'vertical' | 'inline';\n  selectedKeys?: React.Key[];\n  defaultSelectedKeys?: React.Key[];\n  selectionMap?: SelectionMap;\n  offset?: [number, number];\n  inlineOffset?: number;\n  classNames?: {\n    rootItem?: string;\n    subMenu?: string;\n    item?: string;\n    label?: string;\n    // open?: string;\n  };\n  styles?: {\n    rootItem?: React.CSSProperties;\n    subMenu?: React.CSSProperties;\n    item?: React.CSSProperties;\n    label?: React.CSSProperties;\n    // open?: React.CSSProperties;\n  };\n  onClick?: ClickEventHandler;\n  onSelect?: ClickEventHandler;\n}\n\nexport interface MenuProps\n  extends\n    Props,\n    Omit<React.ComponentPropsWithoutRef<'ul'>, 'onClick' | 'onSelect'> {\n  items?: MenuItem[];\n}\n\nexport type ClickEventHandler = (params: {\n  domEvent: React.MouseEvent;\n  key: React.Key;\n  keyPath: React.Key[];\n  item: MenuItem;\n}) => void;\n\nexport const MENU_CLASSNAMES = [\n  'p-0',\n  'bg-white',\n  'shadow-md',\n  'rounded-md',\n  //\n];\n\nexport type SelectionMap = ReadonlyMap<React.Key, boolean>;\n\nexport function buildSelectionMap(\n  items: MenuItem[],\n  selectedKeysSet: ReadonlySet<React.Key>,\n): SelectionMap {\n  const map = new Map<React.Key, boolean>();\n\n  const dfs = (node: MenuItem): boolean => {\n    const self = selectedKeysSet.has(node.key);\n    const hasSelectedChild = node.children?.some(child => dfs(child)) ?? false;\n    const isSelected = self || hasSelectedChild;\n    map.set(node.key, isSelected);\n    return isSelected;\n  };\n\n  items.forEach(dfs);\n  return map;\n}\n\nexport function findKey(\n  menu: MenuItem,\n  targetKeys: ReadonlySet<React.Key>,\n): boolean {\n  if (targetKeys.has(menu.key)) {\n    return true;\n  }\n\n  if (menu.children && Array.isArray(menu.children)) {\n    for (const child of menu.children) {\n      if (findKey(child, targetKeys)) {\n        return true;\n      }\n    }\n  }\n\n  return false;\n}\n\nconst Menu = ({\n  items,\n  mode = 'vertical',\n  defaultSelectedKeys = [],\n  selectedKeys: _selectedKeys,\n  className,\n  classNames,\n  styles,\n  offset,\n  inlineOffset,\n  onClick,\n  onSelect: _onSelect,\n  ...props\n}: MenuProps) => {\n  const controlled = _selectedKeys !== undefined;\n  const [uncontrolledSelectedKeys, setUncontrolledSelectedKeys] = useState<\n    React.Key[]\n  >(defaultSelectedKeys ?? []);\n\n  const selectedKeys = controlled\n    ? (_selectedKeys as React.Key[])\n    : uncontrolledSelectedKeys;\n\n  const selectedKeysSet = useMemo(\n    () => new Set<React.Key>(selectedKeys ?? []),\n    [selectedKeys],\n  );\n\n  const selectionMap = useMemo(\n    () => buildSelectionMap(items ?? [], selectedKeysSet),\n    [items, selectedKeysSet],\n  );\n\n  const onSelect = (params: {\n    domEvent: React.MouseEvent;\n    key: React.Key;\n    keyPath: React.Key[];\n    item: MenuItem;\n  }) => {\n    if (!controlled) {\n      setUncontrolledSelectedKeys([params.key]);\n    }\n    _onSelect?.(params);\n  };\n\n  return (\n    <ul\n      role=\"menu\"\n      className={cn(\n        MENU_CLASSNAMES,\n        mode === 'horizontal' ? 'flex' : 'inline-block',\n        className,\n      )}\n      {...props}\n    >\n      {items?.map(item => (\n        <Item\n          root\n          {...item}\n          key={item.key}\n          itemKey={item.key}\n          keyPath={[item.key]}\n          selectedKeys={selectedKeys}\n          selectionMap={selectionMap}\n          mode={mode}\n          classNames={classNames}\n          styles={styles}\n          offset={offset}\n          inlineOffset={inlineOffset}\n          onClick={onClick}\n          onSelect={onSelect}\n        />\n      ))}\n    </ul>\n  );\n};\n\nexport default Menu;\n"],"mappings":";;;;;;;;AAuDA,MAAa,kBAAkB;CAC7B;CACA;CACA;CACA;CAED;AAID,SAAgB,kBACd,OACA,iBACc;CACd,MAAM,sBAAM,IAAI,KAAyB;CAEzC,MAAM,OAAO,SAA4B;EACvC,MAAM,OAAO,gBAAgB,IAAI,KAAK,IAAI;EAC1C,MAAM,mBAAmB,KAAK,UAAU,MAAK,UAAS,IAAI,MAAM,CAAC,IAAI;EACrE,MAAM,aAAa,QAAQ;AAC3B,MAAI,IAAI,KAAK,KAAK,WAAW;AAC7B,SAAO;;AAGT,OAAM,QAAQ,IAAI;AAClB,QAAO;;AAGT,SAAgB,QACd,MACA,YACS;AACT,KAAI,WAAW,IAAI,KAAK,IAAI,CAC1B,QAAO;AAGT,KAAI,KAAK,YAAY,MAAM,QAAQ,KAAK,SAAS,EAC/C;OAAK,MAAM,SAAS,KAAK,SACvB,KAAI,QAAQ,OAAO,WAAW,CAC5B,QAAO;;AAKb,QAAO;;AAGT,MAAM,QAAQ,EACZ,OACA,OAAO,YACP,sBAAsB,EAAE,EACxB,cAAc,eACd,WACA,YACA,QACA,QACA,cACA,SACA,UAAU,WACV,GAAG,YACY;CACf,MAAM,aAAa,kBAAkB;CACrC,MAAM,CAAC,0BAA0B,+BAA+B,SAE9D,uBAAuB,EAAE,CAAC;CAE5B,MAAM,eAAe,aAChB,gBACD;CAEJ,MAAM,kBAAkB,cAChB,IAAI,IAAe,gBAAgB,EAAE,CAAC,EAC5C,CAAC,aAAa,CACf;CAED,MAAM,eAAe,cACb,kBAAkB,SAAS,EAAE,EAAE,gBAAgB,EACrD,CAAC,OAAO,gBAAgB,CACzB;CAED,MAAM,YAAY,WAKZ;AACJ,MAAI,CAAC,WACH,6BAA4B,CAAC,OAAO,IAAI,CAAC;AAE3C,cAAY,OAAO;;AAGrB,QACE,oBAAC;EACC,MAAK;EACL,WAAW,GACT,iBACA,SAAS,eAAe,SAAS,gBACjC,UACD;EACD,GAAI;YAEH,OAAO,KAAI,SACV,8BAAC;GACC;GACA,GAAI;GACJ,KAAK,KAAK;GACV,SAAS,KAAK;GACd,SAAS,CAAC,KAAK,IAAI;GACL;GACA;GACR;GACM;GACJ;GACA;GACM;GACL;GACC;IACV,CACF;GACC"}
+{"version":3,"file":"Menu.mjs","names":[],"sources":["../src/components/molecules/Menu/index.tsx"],"sourcesContent":["'use client';\n\nimport { useMemo, useState } from 'react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport Item from './Item';\n\nexport interface MenuItem {\n  label: React.ReactNode;\n  key: React.Key;\n  type?: string;\n  path?: string;\n  children?: MenuItem[];\n}\n\nexport interface Props {\n  mode?: 'horizontal' | 'vertical' | 'inline';\n  selectedKeys?: React.Key[];\n  defaultSelectedKeys?: React.Key[];\n  selectionMap?: SelectionMap;\n  offset?: [number, number];\n  inlineOffset?: number;\n  classNames?: {\n    rootItem?: string;\n    subMenu?: string;\n    item?: string;\n    label?: string;\n    // open?: string;\n  };\n  styles?: {\n    rootItem?: React.CSSProperties;\n    subMenu?: React.CSSProperties;\n    item?: React.CSSProperties;\n    label?: React.CSSProperties;\n    // open?: React.CSSProperties;\n  };\n  onClick?: ClickEventHandler;\n  onSelect?: ClickEventHandler;\n}\n\nexport interface MenuProps\n  extends\n    Props,\n    Omit<React.ComponentPropsWithoutRef<'ul'>, 'onClick' | 'onSelect'> {\n  items?: MenuItem[];\n}\n\nexport type ClickEventHandler = (params: {\n  domEvent: React.MouseEvent;\n  key: React.Key;\n  keyPath: React.Key[];\n  item: MenuItem;\n}) => void;\n\nexport const MENU_CLASSNAMES = [\n  'p-0',\n  'bg-white',\n  'shadow-md',\n  'rounded-md',\n  //\n];\n\nexport type SelectionMap = ReadonlyMap<React.Key, boolean>;\n\nexport const buildSelectionMap = (\n  items: MenuItem[],\n  selectedKeysSet: ReadonlySet<React.Key>,\n): SelectionMap => {\n  const map = new Map<React.Key, boolean>();\n\n  const dfs = (node: MenuItem): boolean => {\n    const self = selectedKeysSet.has(node.key);\n    const hasSelectedChild = node.children?.some(child => dfs(child)) ?? false;\n    const isSelected = self || hasSelectedChild;\n    map.set(node.key, isSelected);\n    return isSelected;\n  };\n\n  items.forEach(dfs);\n  return map;\n};\n\nexport const findKey = (\n  menu: MenuItem,\n  targetKeys: ReadonlySet<React.Key>,\n): boolean => {\n  if (targetKeys.has(menu.key)) {\n    return true;\n  }\n\n  if (menu.children && Array.isArray(menu.children)) {\n    for (const child of menu.children) {\n      if (findKey(child, targetKeys)) {\n        return true;\n      }\n    }\n  }\n\n  return false;\n};\n\nconst Menu = ({\n  items,\n  mode = 'vertical',\n  defaultSelectedKeys = [],\n  selectedKeys: _selectedKeys,\n  className,\n  classNames,\n  styles,\n  offset,\n  inlineOffset,\n  onClick,\n  onSelect: _onSelect,\n  ...props\n}: MenuProps) => {\n  const controlled = _selectedKeys !== undefined;\n  const [uncontrolledSelectedKeys, setUncontrolledSelectedKeys] = useState<\n    React.Key[]\n  >(defaultSelectedKeys ?? []);\n\n  const selectedKeys = controlled\n    ? (_selectedKeys as React.Key[])\n    : uncontrolledSelectedKeys;\n\n  const selectedKeysSet = useMemo(\n    () => new Set<React.Key>(selectedKeys ?? []),\n    [selectedKeys],\n  );\n\n  const selectionMap = useMemo(\n    () => buildSelectionMap(items ?? [], selectedKeysSet),\n    [items, selectedKeysSet],\n  );\n\n  const onSelect = (params: {\n    domEvent: React.MouseEvent;\n    key: React.Key;\n    keyPath: React.Key[];\n    item: MenuItem;\n  }) => {\n    if (!controlled) {\n      setUncontrolledSelectedKeys([params.key]);\n    }\n    _onSelect?.(params);\n  };\n\n  return (\n    <ul\n      role=\"menu\"\n      className={cn(\n        MENU_CLASSNAMES,\n        mode === 'horizontal' ? 'flex' : 'inline-block',\n        className,\n      )}\n      {...props}\n    >\n      {items?.map(item => (\n        <Item\n          root\n          {...item}\n          key={item.key}\n          itemKey={item.key}\n          keyPath={[item.key]}\n          selectedKeys={selectedKeys}\n          selectionMap={selectionMap}\n          mode={mode}\n          classNames={classNames}\n          styles={styles}\n          offset={offset}\n          inlineOffset={inlineOffset}\n          onClick={onClick}\n          onSelect={onSelect}\n        />\n      ))}\n    </ul>\n  );\n};\n\nexport default Menu;\n"],"mappings":";;;;;;;;AAuDA,MAAa,kBAAkB;CAC7B;CACA;CACA;CACA;CAED;AAID,MAAa,qBACX,OACA,oBACiB;CACjB,MAAM,sBAAM,IAAI,KAAyB;CAEzC,MAAM,OAAO,SAA4B;EACvC,MAAM,OAAO,gBAAgB,IAAI,KAAK,IAAI;EAC1C,MAAM,mBAAmB,KAAK,UAAU,MAAK,UAAS,IAAI,MAAM,CAAC,IAAI;EACrE,MAAM,aAAa,QAAQ;AAC3B,MAAI,IAAI,KAAK,KAAK,WAAW;AAC7B,SAAO;;AAGT,OAAM,QAAQ,IAAI;AAClB,QAAO;;AAGT,MAAa,WACX,MACA,eACY;AACZ,KAAI,WAAW,IAAI,KAAK,IAAI,CAC1B,QAAO;AAGT,KAAI,KAAK,YAAY,MAAM,QAAQ,KAAK,SAAS,EAC/C;OAAK,MAAM,SAAS,KAAK,SACvB,KAAI,QAAQ,OAAO,WAAW,CAC5B,QAAO;;AAKb,QAAO;;AAGT,MAAM,QAAQ,EACZ,OACA,OAAO,YACP,sBAAsB,EAAE,EACxB,cAAc,eACd,WACA,YACA,QACA,QACA,cACA,SACA,UAAU,WACV,GAAG,YACY;CACf,MAAM,aAAa,kBAAkB;CACrC,MAAM,CAAC,0BAA0B,+BAA+B,SAE9D,uBAAuB,EAAE,CAAC;CAE5B,MAAM,eAAe,aAChB,gBACD;CAEJ,MAAM,kBAAkB,cAChB,IAAI,IAAe,gBAAgB,EAAE,CAAC,EAC5C,CAAC,aAAa,CACf;CAED,MAAM,eAAe,cACb,kBAAkB,SAAS,EAAE,EAAE,gBAAgB,EACrD,CAAC,OAAO,gBAAgB,CACzB;CAED,MAAM,YAAY,WAKZ;AACJ,MAAI,CAAC,WACH,6BAA4B,CAAC,OAAO,IAAI,CAAC;AAE3C,cAAY,OAAO;;AAGrB,QACE,oBAAC;EACC,MAAK;EACL,WAAW,GACT,iBACA,SAAS,eAAe,SAAS,gBACjC,UACD;EACD,GAAI;YAEH,OAAO,KAAI,SACV,8BAAC;GACC;GACA,GAAI;GACJ,KAAK,KAAK;GACV,SAAS,KAAK;GACd,SAAS,CAAC,KAAK,IAAI;GACL;GACA;GACR;GACM;GACJ;GACA;GACM;GACL;GACC;IACV,CACF;GACC"}

package/dist/components/atoms/Button/index.mjs

@@ -10,8 +10,8 @@ import { jsx, jsxs } from "react/jsx-runtime";
 const Core = Button$1;
 const variantClasses = {
 	solid: "",
-	outlined: cn("border border-[rgb(var(--btn-border)/0.5)]", "bg-background text-foreground", "hover:bg-accent"),
-	dashed: cn("border border-dashed border-[rgb(var(--btn-border)/0.5)]", "bg-background text-foreground", "hover:bg-accent"),
+	outlined: cn("border border-[color-mix(in_oklch,var(--btn-border),transparent_50%)]", "bg-background text-foreground", "hover:bg-accent"),
+	dashed: cn("border border-dashed border-[color-mix(in_oklch,var(--btn-border),transparent_50%)]", "bg-background text-foreground", "hover:bg-accent"),
 	filled: cn("bg-muted text-foreground", "hover:bg-muted/80"),
 	text: cn("bg-transparent text-foreground", "hover:bg-accent"),
 	link: cn("bg-transparent text-primary", "underline-offset-4 hover:underline", "hover:bg-primary/10")
@@ -54,7 +54,7 @@ const Button = ({ icon, className, type = "default", variant, size = "middle", c
 			"active:bg-(--btn-bg-active)",
 			"text-(--btn-fg)",
 			"border-(--btn-border)"
-		] : ["text-(--btn-bg)", "border-[rgb(var(--btn-border)/0.5)]"]), className),
+		] : ["text-(--btn-bg)", "border-[color-mix(in_oklch,var(--btn-border),transparent_50%)]"]), className),
 		onMouseDown: (e) => {
 			e.preventDefault();
 			onMouseDown?.(e);

package/dist/components/atoms/Button/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":["button.Button"],"sources":["../../../../src/components/atoms/Button/index.tsx"],"sourcesContent":["'use client';\n\nimport { LoaderCircle } from 'lucide-react';\n\nimport { button } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nconst Core = button.Button;\ntype ButtonProps = button.Props;\n\ntype PresetColors =\n  | 'blue'\n  | 'purple'\n  | 'cyan'\n  | 'green'\n  | 'magenta'\n  | 'pink'\n  | 'red'\n  | 'orange'\n  | 'yellow'\n  | 'volcano'\n  | 'geekblue'\n  | 'lime'\n  | 'gold';\n\nexport interface Props extends Omit<ButtonProps, 'size' | 'variant' | 'type'> {\n  icon?: React.ReactNode;\n  block?: boolean;\n  danger?: boolean;\n  disabled?: boolean;\n  size?: 'small' | 'middle' | 'large';\n  type?: 'primary' | 'default' | 'dashed' | 'text' | 'link';\n  variant?: 'solid' | 'outlined' | 'dashed' | 'filled' | 'text' | 'link';\n  shape?: 'default' | 'circle' | 'round';\n  color?: PresetColors | 'default' | 'primary' | 'danger';\n  loading?: boolean | { icon: React.ReactNode };\n}\n\nconst variantClasses: Record<string, string> = {\n  solid: '',\n  outlined: cn(\n    'border border-[rgb(var(--btn-border)/0.5)]',\n    'bg-background text-foreground',\n    'hover:bg-accent',\n  ),\n  dashed: cn(\n    'border border-dashed border-[rgb(var(--btn-border)/0.5)]',\n    'bg-background text-foreground',\n    'hover:bg-accent',\n  ),\n  filled: cn('bg-muted text-foreground', 'hover:bg-muted/80'),\n  text: cn('bg-transparent text-foreground', 'hover:bg-accent'),\n  link: cn(\n    'bg-transparent text-primary',\n    'underline-offset-4 hover:underline',\n    'hover:bg-primary/10',\n  ),\n};\n\nconst typeToVariant: Record<string, string> = {\n  primary: 'solid',\n  default: 'outlined',\n  dashed: 'dashed',\n  text: 'text',\n  link: 'link',\n};\n\nconst sizesClasses: Record<string, string> = {\n  small: 'h-6 px-3 text-sm',\n  middle: 'h-8 px-4 text-base',\n  large: 'h-10 px-5 text-lg',\n};\n\nconst iconClasses: Record<string, string> = {\n  small: `size-6 [&_svg:not([class*='size-'])]:size-3`,\n  middle: `size-8 [&_svg:not([class*='size-'])]:size-4`,\n  large: `size-10 [&_svg:not([class*='size-'])]:size-5`,\n};\n\nconst shapesClasses = {\n  default: 'rounded-sm',\n  circle: 'rounded-full',\n  round: 'rounded-2xl',\n};\n\nconst Button = ({\n  icon,\n  className,\n  type = 'default',\n  variant,\n  size = 'middle',\n  color = 'default',\n  shape = 'default',\n  block = false,\n  disabled,\n  loading,\n  danger,\n  children,\n  onMouseDown,\n  ...props\n}: Props) => {\n  const iconOnly = icon && !children;\n  const computedColor = danger ? 'danger' : color;\n  const colored = computedColor && computedColor !== 'default';\n  const resolvedVariant = variant ?? typeToVariant[type] ?? 'solid';\n\n  const displayIcon = loading ? (\n    typeof loading === 'object' ? (\n      loading.icon\n    ) : (\n      <LoaderCircle className=\"animate-spin\" />\n    )\n  ) : (\n    icon\n  );\n\n  return (\n    <Core\n      disabled={disabled}\n      variant=\"default\"\n      data-color={computedColor}\n      className={cn(\n        'inline-flex items-center justify-center gap-x-2',\n        'rounded-lg',\n        'cursor-pointer',\n        'h-auto py-0',\n        'transition-all',\n        variantClasses[resolvedVariant],\n        sizesClasses[size || 'medium'],\n        iconOnly && ['p-0', iconClasses[size || 'medium']],\n        shapesClasses[shape || 'default'],\n        block && 'w-full',\n        colored &&\n          (resolvedVariant === 'solid'\n            ? [\n                'bg-(--btn-bg)',\n                'hover:bg-(--btn-bg-hover)',\n                'active:bg-(--btn-bg-active)',\n                'text-(--btn-fg)',\n                'border-(--btn-border)',\n              ]\n            : [\n                'text-(--btn-bg)',\n                'border-[rgb(var(--btn-border)/0.5)]',\n                //\n              ]),\n        className,\n        //\n      )}\n      onMouseDown={e => {\n        e.preventDefault();\n        onMouseDown?.(e);\n      }}\n      {...props}\n    >\n      {displayIcon}\n      {children}\n    </Core>\n  );\n};\n\nexport default Button;\n"],"mappings":";;;;;;;;;AAOA,MAAM,OAAOA;AA+Bb,MAAM,iBAAyC;CAC7C,OAAO;CACP,UAAU,GACR,8CACA,iCACA,kBACD;CACD,QAAQ,GACN,4DACA,iCACA,kBACD;CACD,QAAQ,GAAG,4BAA4B,oBAAoB;CAC3D,MAAM,GAAG,kCAAkC,kBAAkB;CAC7D,MAAM,GACJ,+BACA,sCACA,sBACD;CACF;AAED,MAAM,gBAAwC;CAC5C,SAAS;CACT,SAAS;CACT,QAAQ;CACR,MAAM;CACN,MAAM;CACP;AAED,MAAM,eAAuC;CAC3C,OAAO;CACP,QAAQ;CACR,OAAO;CACR;AAED,MAAM,cAAsC;CAC1C,OAAO;CACP,QAAQ;CACR,OAAO;CACR;AAED,MAAM,gBAAgB;CACpB,SAAS;CACT,QAAQ;CACR,OAAO;CACR;AAED,MAAM,UAAU,EACd,MACA,WACA,OAAO,WACP,SACA,OAAO,UACP,QAAQ,WACR,QAAQ,WACR,QAAQ,OACR,UACA,SACA,QACA,UACA,aACA,GAAG,YACQ;CACX,MAAM,WAAW,QAAQ,CAAC;CAC1B,MAAM,gBAAgB,SAAS,WAAW;CAC1C,MAAM,UAAU,iBAAiB,kBAAkB;CACnD,MAAM,kBAAkB,WAAW,cAAc,SAAS;CAE1D,MAAM,cAAc,UAClB,OAAO,YAAY,WACjB,QAAQ,OAER,oBAAC,gBAAa,WAAU,iBAAiB,GAG3C;AAGF,QACE,qBAAC;EACW;EACV,SAAQ;EACR,cAAY;EACZ,WAAW,GACT,mDACA,cACA,kBACA,eACA,kBACA,eAAe,kBACf,aAAa,QAAQ,WACrB,YAAY,CAAC,OAAO,YAAY,QAAQ,UAAU,EAClD,cAAc,SAAS,YACvB,SAAS,UACT,YACG,oBAAoB,UACjB;GACE;GACA;GACA;GACA;GACA;GACD,GACD,CACE,mBACA,sCAED,GACP,UAED;EACD,cAAa,MAAK;AAChB,KAAE,gBAAgB;AAClB,iBAAc,EAAE;;EAElB,GAAI;aAEH,aACA;GACI"}
+{"version":3,"file":"index.mjs","names":["button.Button"],"sources":["../../../../src/components/atoms/Button/index.tsx"],"sourcesContent":["'use client';\n\nimport { LoaderCircle } from 'lucide-react';\n\nimport { button } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nconst Core = button.Button;\ntype ButtonProps = button.Props;\n\ntype PresetColors =\n  | 'blue'\n  | 'purple'\n  | 'cyan'\n  | 'green'\n  | 'magenta'\n  | 'pink'\n  | 'red'\n  | 'orange'\n  | 'yellow'\n  | 'volcano'\n  | 'geekblue'\n  | 'lime'\n  | 'gold';\n\nexport interface Props extends Omit<ButtonProps, 'size' | 'variant' | 'type'> {\n  icon?: React.ReactNode;\n  block?: boolean;\n  danger?: boolean;\n  disabled?: boolean;\n  size?: 'small' | 'middle' | 'large';\n  type?: 'primary' | 'default' | 'dashed' | 'text' | 'link';\n  variant?: 'solid' | 'outlined' | 'dashed' | 'filled' | 'text' | 'link';\n  shape?: 'default' | 'circle' | 'round';\n  color?: PresetColors | 'default' | 'primary' | 'danger';\n  loading?: boolean | { icon: React.ReactNode };\n}\n\nconst variantClasses: Record<string, string> = {\n  solid: '',\n  outlined: cn(\n    'border border-[color-mix(in_oklch,var(--btn-border),transparent_50%)]',\n    'bg-background text-foreground',\n    'hover:bg-accent',\n  ),\n  dashed: cn(\n    'border border-dashed border-[color-mix(in_oklch,var(--btn-border),transparent_50%)]',\n    'bg-background text-foreground',\n    'hover:bg-accent',\n  ),\n  filled: cn('bg-muted text-foreground', 'hover:bg-muted/80'),\n  text: cn('bg-transparent text-foreground', 'hover:bg-accent'),\n  link: cn(\n    'bg-transparent text-primary',\n    'underline-offset-4 hover:underline',\n    'hover:bg-primary/10',\n  ),\n};\n\nconst typeToVariant: Record<string, string> = {\n  primary: 'solid',\n  default: 'outlined',\n  dashed: 'dashed',\n  text: 'text',\n  link: 'link',\n};\n\nconst sizesClasses: Record<string, string> = {\n  small: 'h-6 px-3 text-sm',\n  middle: 'h-8 px-4 text-base',\n  large: 'h-10 px-5 text-lg',\n};\n\nconst iconClasses: Record<string, string> = {\n  small: `size-6 [&_svg:not([class*='size-'])]:size-3`,\n  middle: `size-8 [&_svg:not([class*='size-'])]:size-4`,\n  large: `size-10 [&_svg:not([class*='size-'])]:size-5`,\n};\n\nconst shapesClasses = {\n  default: 'rounded-sm',\n  circle: 'rounded-full',\n  round: 'rounded-2xl',\n};\n\nconst Button = ({\n  icon,\n  className,\n  type = 'default',\n  variant,\n  size = 'middle',\n  color = 'default',\n  shape = 'default',\n  block = false,\n  disabled,\n  loading,\n  danger,\n  children,\n  onMouseDown,\n  ...props\n}: Props) => {\n  const iconOnly = icon && !children;\n  const computedColor = danger ? 'danger' : color;\n  const colored = computedColor && computedColor !== 'default';\n  const resolvedVariant = variant ?? typeToVariant[type] ?? 'solid';\n\n  const displayIcon = loading ? (\n    typeof loading === 'object' ? (\n      loading.icon\n    ) : (\n      <LoaderCircle className=\"animate-spin\" />\n    )\n  ) : (\n    icon\n  );\n\n  return (\n    <Core\n      disabled={disabled}\n      variant=\"default\"\n      data-color={computedColor}\n      className={cn(\n        'inline-flex items-center justify-center gap-x-2',\n        'rounded-lg',\n        'cursor-pointer',\n        'h-auto py-0',\n        'transition-all',\n        variantClasses[resolvedVariant],\n        sizesClasses[size || 'medium'],\n        iconOnly && ['p-0', iconClasses[size || 'medium']],\n        shapesClasses[shape || 'default'],\n        block && 'w-full',\n        colored &&\n          (resolvedVariant === 'solid'\n            ? [\n                'bg-(--btn-bg)',\n                'hover:bg-(--btn-bg-hover)',\n                'active:bg-(--btn-bg-active)',\n                'text-(--btn-fg)',\n                'border-(--btn-border)',\n              ]\n            : [\n                'text-(--btn-bg)',\n                'border-[color-mix(in_oklch,var(--btn-border),transparent_50%)]',\n                //\n              ]),\n        className,\n        //\n      )}\n      onMouseDown={e => {\n        e.preventDefault();\n        onMouseDown?.(e);\n      }}\n      {...props}\n    >\n      {displayIcon}\n      {children}\n    </Core>\n  );\n};\n\nexport default Button;\n"],"mappings":";;;;;;;;;AAOA,MAAM,OAAOA;AA+Bb,MAAM,iBAAyC;CAC7C,OAAO;CACP,UAAU,GACR,yEACA,iCACA,kBACD;CACD,QAAQ,GACN,uFACA,iCACA,kBACD;CACD,QAAQ,GAAG,4BAA4B,oBAAoB;CAC3D,MAAM,GAAG,kCAAkC,kBAAkB;CAC7D,MAAM,GACJ,+BACA,sCACA,sBACD;CACF;AAED,MAAM,gBAAwC;CAC5C,SAAS;CACT,SAAS;CACT,QAAQ;CACR,MAAM;CACN,MAAM;CACP;AAED,MAAM,eAAuC;CAC3C,OAAO;CACP,QAAQ;CACR,OAAO;CACR;AAED,MAAM,cAAsC;CAC1C,OAAO;CACP,QAAQ;CACR,OAAO;CACR;AAED,MAAM,gBAAgB;CACpB,SAAS;CACT,QAAQ;CACR,OAAO;CACR;AAED,MAAM,UAAU,EACd,MACA,WACA,OAAO,WACP,SACA,OAAO,UACP,QAAQ,WACR,QAAQ,WACR,QAAQ,OACR,UACA,SACA,QACA,UACA,aACA,GAAG,YACQ;CACX,MAAM,WAAW,QAAQ,CAAC;CAC1B,MAAM,gBAAgB,SAAS,WAAW;CAC1C,MAAM,UAAU,iBAAiB,kBAAkB;CACnD,MAAM,kBAAkB,WAAW,cAAc,SAAS;CAE1D,MAAM,cAAc,UAClB,OAAO,YAAY,WACjB,QAAQ,OAER,oBAAC,gBAAa,WAAU,iBAAiB,GAG3C;AAGF,QACE,qBAAC;EACW;EACV,SAAQ;EACR,cAAY;EACZ,WAAW,GACT,mDACA,cACA,kBACA,eACA,kBACA,eAAe,kBACf,aAAa,QAAQ,WACrB,YAAY,CAAC,OAAO,YAAY,QAAQ,UAAU,EAClD,cAAc,SAAS,YACvB,SAAS,UACT,YACG,oBAAoB,UACjB;GACE;GACA;GACA;GACA;GACA;GACD,GACD,CACE,mBACA,iEAED,GACP,UAED;EACD,cAAa,MAAK;AAChB,KAAE,gBAAgB;AAClB,iBAAc,EAAE;;EAElB,GAAI;aAEH,aACA;GACI"}

package/dist/components/atoms/Checkbox/index.mjs

@@ -7,7 +7,7 @@ import "../../../core.mjs";
 import Group from "./Group/index.mjs";
 import { Square, SquareCheck } from "lucide-react";
 import { useId, useState } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/atoms/Checkbox/index.tsx
 const { Checkbox: CoreCheckbox } = checkbox_exports;
@@ -24,7 +24,7 @@ const Checkbox = ({ placement = "left", value = "", children, className, icons,
 		if (!controlled) setUncontrolledChecked(next);
 		_onChange(next);
 	};
-	const renderContent = icons ? /* @__PURE__ */ jsxs(Fragment, { children: [
+	const renderContent = icons ? /* @__PURE__ */ jsxs(Fragment$1, { children: [
 		/* @__PURE__ */ jsx("input", {
 			id,
 			hidden: true,
@@ -46,7 +46,7 @@ const Checkbox = ({ placement = "left", value = "", children, className, icons,
 			htmlFor: id,
 			children
 		})
-	] }) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(CoreCheckbox, {
+	] }) : /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(CoreCheckbox, {
 		id,
 		checked,
 		disabled,

package/dist/components/atoms/Checkbox/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":["checkbox","label"],"sources":["../../../../src/components/atoms/Checkbox/index.tsx"],"sourcesContent":["'use client';\n\nimport { useId, useState } from 'react';\n\nimport { Square, SquareCheck } from 'lucide-react';\n\nimport { checkbox, label } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nimport Group, { type OptionValue } from './Group';\n\nconst { Checkbox: CoreCheckbox } = checkbox;\nconst { Label: CoreLabel } = label;\n\nexport interface Props extends Omit<\n  React.ComponentPropsWithoutRef<'div'>,\n  'onChange'\n> {\n  placement?: 'left' | 'right';\n  defaultChecked?: boolean;\n  checked?: boolean;\n  value?: OptionValue;\n  disabled?: boolean;\n  icons?: { checked: React.ReactNode; unchecked: React.ReactNode };\n  children?: React.ReactNode;\n  onChange?: (checked: boolean) => void;\n}\n\nconst Checkbox = ({\n  placement = 'left',\n  value = '',\n  children,\n  className,\n  icons,\n  disabled,\n  defaultChecked,\n  checked: _checked,\n  onChange: _onChange = () => {},\n  ...props\n}: Props) => {\n  const [uncontrolledChecked, setUncontrolledChecked] = useState<boolean>(\n    defaultChecked || false,\n  );\n\n  const reactId = useId();\n\n  const id = typeof value === 'boolean' || !value ? reactId : String(value);\n  const controlled = _checked !== undefined;\n  const checked = controlled ? _checked : uncontrolledChecked;\n\n  const cursorClassName = disabled ? 'cursor-not-allowed' : 'cursor-pointer';\n\n  const onChange = (next: boolean) => {\n    if (disabled) {\n      return;\n    }\n\n    if (!controlled) {\n      setUncontrolledChecked(next);\n    }\n    _onChange(next);\n  };\n\n  const renderContent = icons ? (\n    <>\n      <input\n        id={id}\n        hidden\n        type=\"checkbox\"\n        checked={checked}\n        onChange={e => {\n          onChange(e.target.checked);\n        }}\n      />\n      <span\n        className={cn(cursorClassName, disabled && 'opacity-50')}\n        onClick={() => {\n          document.getElementById(id)?.click();\n        }}\n      >\n        {checked\n          ? (icons.checked ?? <SquareCheck />)\n          : (icons.unchecked ?? <Square />)}\n      </span>\n      {children && (\n        <label\n          className={cn(cursorClassName, disabled && 'opacity-50')}\n          htmlFor={id}\n        >\n          {children}\n        </label>\n      )}\n    </>\n  ) : (\n    <>\n      <CoreCheckbox\n        id={id}\n        checked={checked}\n        disabled={disabled}\n        className={cn(cursorClassName)}\n        onCheckedChange={onChange}\n      />\n      {children && (\n        <CoreLabel htmlFor={id} className={cn(cursorClassName, 'text-left')}>\n          {children}\n        </CoreLabel>\n      )}\n    </>\n  );\n\n  return (\n    <div\n      className={cn(\n        'flex items-center gap-x-2',\n        placement === 'right' && 'flex-row-reverse',\n        cursorClassName,\n        className,\n        //\n      )}\n      {...props}\n    >\n      {renderContent}\n    </div>\n  );\n};\n\nCheckbox.Group = Group;\n\nexport default Checkbox;\n"],"mappings":";;;;;;;;;;;;AAWA,MAAM,EAAE,UAAU,iBAAiBA;AACnC,MAAM,EAAE,OAAO,cAAcC;AAgB7B,MAAM,YAAY,EAChB,YAAY,QACZ,QAAQ,IACR,UACA,WACA,OACA,UACA,gBACA,SAAS,UACT,UAAU,kBAAkB,IAC5B,GAAG,YACQ;CACX,MAAM,CAAC,qBAAqB,0BAA0B,SACpD,kBAAkB,MACnB;CAED,MAAM,UAAU,OAAO;CAEvB,MAAM,KAAK,OAAO,UAAU,aAAa,CAAC,QAAQ,UAAU,OAAO,MAAM;CACzE,MAAM,aAAa,aAAa;CAChC,MAAM,UAAU,aAAa,WAAW;CAExC,MAAM,kBAAkB,WAAW,uBAAuB;CAE1D,MAAM,YAAY,SAAkB;AAClC,MAAI,SACF;AAGF,MAAI,CAAC,WACH,wBAAuB,KAAK;AAE9B,YAAU,KAAK;;CAGjB,MAAM,gBAAgB,QACpB;EACE,oBAAC;GACK;GACJ;GACA,MAAK;GACI;GACT,WAAU,MAAK;AACb,aAAS,EAAE,OAAO,QAAQ;;IAE5B;EACF,oBAAC;GACC,WAAW,GAAG,iBAAiB,YAAY,aAAa;GACxD,eAAe;AACb,aAAS,eAAe,GAAG,EAAE,OAAO;;aAGrC,UACI,MAAM,WAAW,oBAAC,gBAAc,GAChC,MAAM,aAAa,oBAAC,WAAS;IAC7B;EACN,YACC,oBAAC;GACC,WAAW,GAAG,iBAAiB,YAAY,aAAa;GACxD,SAAS;GAER;IACK;KAET,GAEH,4CACE,oBAAC;EACK;EACK;EACC;EACV,WAAW,GAAG,gBAAgB;EAC9B,iBAAiB;GACjB,EACD,YACC,oBAAC;EAAU,SAAS;EAAI,WAAW,GAAG,iBAAiB,YAAY;EAChE;GACS,IAEb;AAGL,QACE,oBAAC;EACC,WAAW,GACT,6BACA,cAAc,WAAW,oBACzB,iBACA,UAED;EACD,GAAI;YAEH;GACG;;AAIV,SAAS,QAAQ"}
+{"version":3,"file":"index.mjs","names":["checkbox","label"],"sources":["../../../../src/components/atoms/Checkbox/index.tsx"],"sourcesContent":["'use client';\n\nimport { useId, useState } from 'react';\n\nimport { Square, SquareCheck } from 'lucide-react';\n\nimport { checkbox, label } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nimport Group, { type OptionValue } from './Group';\n\nconst { Checkbox: CoreCheckbox } = checkbox;\nconst { Label: CoreLabel } = label;\n\nexport interface Props extends Omit<\n  React.ComponentPropsWithoutRef<'div'>,\n  'onChange'\n> {\n  placement?: 'left' | 'right';\n  defaultChecked?: boolean;\n  checked?: boolean;\n  value?: OptionValue;\n  disabled?: boolean;\n  icons?: { checked: React.ReactNode; unchecked: React.ReactNode };\n  children?: React.ReactNode;\n  onChange?: (checked: boolean) => void;\n}\n\nconst Checkbox = ({\n  placement = 'left',\n  value = '',\n  children,\n  className,\n  icons,\n  disabled,\n  defaultChecked,\n  checked: _checked,\n  onChange: _onChange = () => {},\n  ...props\n}: Props) => {\n  const [uncontrolledChecked, setUncontrolledChecked] = useState<boolean>(\n    defaultChecked || false,\n  );\n\n  const reactId = useId();\n\n  const id = typeof value === 'boolean' || !value ? reactId : String(value);\n  const controlled = _checked !== undefined;\n  const checked = controlled ? _checked : uncontrolledChecked;\n\n  const cursorClassName = disabled ? 'cursor-not-allowed' : 'cursor-pointer';\n\n  const onChange = (next: boolean) => {\n    if (disabled) {\n      return;\n    }\n\n    if (!controlled) {\n      setUncontrolledChecked(next);\n    }\n    _onChange(next);\n  };\n\n  const renderContent = icons ? (\n    <>\n      <input\n        id={id}\n        hidden\n        type=\"checkbox\"\n        checked={checked}\n        onChange={e => {\n          onChange(e.target.checked);\n        }}\n      />\n      <span\n        className={cn(cursorClassName, disabled && 'opacity-50')}\n        onClick={() => {\n          document.getElementById(id)?.click();\n        }}\n      >\n        {checked\n          ? (icons.checked ?? <SquareCheck />)\n          : (icons.unchecked ?? <Square />)}\n      </span>\n      {children && (\n        <label\n          className={cn(cursorClassName, disabled && 'opacity-50')}\n          htmlFor={id}\n        >\n          {children}\n        </label>\n      )}\n    </>\n  ) : (\n    <>\n      <CoreCheckbox\n        id={id}\n        checked={checked}\n        disabled={disabled}\n        className={cn(cursorClassName)}\n        onCheckedChange={onChange}\n      />\n      {children && (\n        <CoreLabel htmlFor={id} className={cn(cursorClassName, 'text-left')}>\n          {children}\n        </CoreLabel>\n      )}\n    </>\n  );\n\n  return (\n    <div\n      className={cn(\n        'flex items-center gap-x-2',\n        placement === 'right' && 'flex-row-reverse',\n        cursorClassName,\n        className,\n        //\n      )}\n      {...props}\n    >\n      {renderContent}\n    </div>\n  );\n};\n\nCheckbox.Group = Group;\n\nexport default Checkbox;\n"],"mappings":";;;;;;;;;;;;AAWA,MAAM,EAAE,UAAU,iBAAiBA;AACnC,MAAM,EAAE,OAAO,cAAcC;AAgB7B,MAAM,YAAY,EAChB,YAAY,QACZ,QAAQ,IACR,UACA,WACA,OACA,UACA,gBACA,SAAS,UACT,UAAU,kBAAkB,IAC5B,GAAG,YACQ;CACX,MAAM,CAAC,qBAAqB,0BAA0B,SACpD,kBAAkB,MACnB;CAED,MAAM,UAAU,OAAO;CAEvB,MAAM,KAAK,OAAO,UAAU,aAAa,CAAC,QAAQ,UAAU,OAAO,MAAM;CACzE,MAAM,aAAa,aAAa;CAChC,MAAM,UAAU,aAAa,WAAW;CAExC,MAAM,kBAAkB,WAAW,uBAAuB;CAE1D,MAAM,YAAY,SAAkB;AAClC,MAAI,SACF;AAGF,MAAI,CAAC,WACH,wBAAuB,KAAK;AAE9B,YAAU,KAAK;;CAGjB,MAAM,gBAAgB,QACpB;EACE,oBAAC;GACK;GACJ;GACA,MAAK;GACI;GACT,WAAU,MAAK;AACb,aAAS,EAAE,OAAO,QAAQ;;IAE5B;EACF,oBAAC;GACC,WAAW,GAAG,iBAAiB,YAAY,aAAa;GACxD,eAAe;AACb,aAAS,eAAe,GAAG,EAAE,OAAO;;aAGrC,UACI,MAAM,WAAW,oBAAC,gBAAc,GAChC,MAAM,aAAa,oBAAC,WAAS;IAC7B;EACN,YACC,oBAAC;GACC,WAAW,GAAG,iBAAiB,YAAY,aAAa;GACxD,SAAS;GAER;IACK;KAET,GAEH,8CACE,oBAAC;EACK;EACK;EACC;EACV,WAAW,GAAG,gBAAgB;EAC9B,iBAAiB;GACjB,EACD,YACC,oBAAC;EAAU,SAAS;EAAI,WAAW,GAAG,iBAAiB,YAAY;EAChE;GACS,IAEb;AAGL,QACE,oBAAC;EACC,WAAW,GACT,6BACA,cAAc,WAAW,oBACzB,iBACA,UAED;EACD,GAAI;YAEH;GACG;;AAIV,SAAS,QAAQ"}

package/dist/components/atoms/Radio/index.mjs

@@ -7,7 +7,7 @@ import "../../../core.mjs";
 import RadioGroup from "./Group/index.mjs";
 import { Circle, CircleCheck } from "lucide-react";
 import { useId, useState } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/atoms/Radio/index.tsx
 const { RadioGroup: Core, RadioGroupItem: Item } = radio_group_exports;
@@ -24,7 +24,7 @@ const Radio = ({ placement = "left", value = "", children, className, icons, dis
 		if (!controlled) setUncontrolledChecked(next);
 		_onChange(next);
 	};
-	const renderContent = icons ? /* @__PURE__ */ jsxs(Fragment, { children: [
+	const renderContent = icons ? /* @__PURE__ */ jsxs(Fragment$1, { children: [
 		/* @__PURE__ */ jsx("input", {
 			id,
 			hidden: true,

package/dist/components/atoms/Switch/index.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.mts","names":[],"sources":["../../../../src/components/atoms/Switch/index.tsx"],"mappings":";;;UA4BU,KAAA,SAAc,IAAA,CACtB,KAAA,CAAM,wBAAA;EAGN,UAAA;IACE,KAAA;IACA,MAAA;EAAA;EAEF,IAAA;EACA,cAAA;EACA,OAAA;EACA,QAAA;EACA,QAAA,IAAY,OAAA;EACZ,eAAA,GAAkB,KAAA,CAAM,SAAA;EACxB,iBAAA,GAAoB,KAAA,CAAM,SAAA;AAAA;AAAA,cAGtB,MAAA;EAAU,SAAA;EAAA,UAAA;EAAA,IAAA;EAAA,cAAA;EAAA,OAAA,EAAA,QAAA;EAAA,QAAA,EAAA,SAAA;EAAA,eAAA;EAAA,iBAAA;EAAA,GAAA;AAAA,GAUb,KAAA,KAAK,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"index.d.mts","names":[],"sources":["../../../../src/components/atoms/Switch/index.tsx"],"mappings":";;;UAgCU,KAAA,SAAc,IAAA,CACtB,KAAA,CAAM,wBAAA;EAGN,UAAA;IACE,KAAA;IACA,MAAA;EAAA;EAEF,IAAA;EACA,cAAA;EACA,OAAA;EACA,QAAA;EACA,QAAA,IAAY,OAAA;EACZ,eAAA,GAAkB,KAAA,CAAM,SAAA;EACxB,iBAAA,GAAoB,KAAA,CAAM,SAAA;AAAA;AAAA,cAGtB,MAAA;EAAU,SAAA;EAAA,UAAA;EAAA,IAAA;EAAA,cAAA;EAAA,OAAA,EAAA,QAAA;EAAA,QAAA,EAAA,SAAA;EAAA,eAAA;EAAA,iBAAA;EAAA,GAAA;AAAA,GAUb,KAAA,KAAK,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/atoms/Switch/index.mjs

@@ -11,17 +11,21 @@ const { Switch: Core } = switch_exports;
 const sizeConfig = {
 	medium: {
 		core: "default",
-		handleChecked: "data-[state=unchecked]:left-0 data-[state=checked]:left-[calc(100%-16px)]",
-		fontSize: "text-[9px]",
-		marginChecked: "mr-4.5 ml-1",
-		marginUnchecked: "mr-1 ml-4.5"
+		track: "h-8! w-12!",
+		handle: "size-6!",
+		handleChecked: "data-[state=unchecked]:left-0.5 data-[state=checked]:left-[calc(100%-26px)]",
+		fontSize: "text-xs",
+		marginChecked: "mr-7 ml-2",
+		marginUnchecked: "mr-2 ml-7"
 	},
 	small: {
 		core: "sm",
-		handleChecked: "data-[state=unchecked]:left-0 data-[state=checked]:left-[calc(100%-12px)]",
-		fontSize: "text-[7px]",
-		marginChecked: "mr-3.5 ml-0.5",
-		marginUnchecked: "mr-0.5 ml-3.5"
+		track: "h-6! w-10!",
+		handle: "size-5!",
+		handleChecked: "data-[state=unchecked]:left-0.5 data-[state=checked]:left-[calc(100%-22px)]",
+		fontSize: "text-[10px]",
+		marginChecked: "mr-6 ml-1.5",
+		marginUnchecked: "mr-1.5 ml-6"
 	}
 };
 const Switch = ({ className, classNames, size = "medium", defaultChecked, checked: _checked, onChange: _onChange = () => {}, checkedChildren, unCheckedChildren, ...props }) => {
@@ -37,18 +41,15 @@ const Switch = ({ className, classNames, size = "medium", defaultChecked, checke
 	return /* @__PURE__ */ jsx(Core, {
 		checked,
 		size: config.core,
-		className: cn("relative", hasChildren && "w-auto! overflow-hidden", className, classNames?.track),
-		handleClassName: cn(hasChildren && [
-			"!absolute top-1/2 !-translate-y-1/2 !translate-x-0",
-			"transition-[left] duration-200",
-			config.handleChecked
-		], classNames?.handle),
+		className: cn("relative", config.track, hasChildren && "w-auto! overflow-hidden", className, classNames?.track),
+		handleClassName: cn(config.handle, "!absolute top-1/2 !-translate-y-1/2 !translate-x-0", "transition-[left] duration-200 will-change-[left]", config.handleChecked, classNames?.handle),
 		onCheckedChange: (checked) => {
 			onChange(checked);
 		},
 		...props,
 		children: hasChildren && /* @__PURE__ */ jsxs("span", {
-			className: cn("grid leading-none text-white transition-[margin] duration-200", config.fontSize, checked ? config.marginChecked : config.marginUnchecked),
+			className: cn(`grid leading-none text-white transition-[margin] duration-200
+            will-change-[margin]`, config.fontSize, checked ? config.marginChecked : config.marginUnchecked),
 			children: [/* @__PURE__ */ jsx("span", {
 				className: cn("col-start-1 row-start-1 transition-opacity duration-200", checked ? "opacity-100" : "opacity-0"),
 				children: checkedChildren

package/dist/components/atoms/Switch/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":["switchComponent"],"sources":["../../../../src/components/atoms/Switch/index.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\n\nimport { switchComponent } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nconst { Switch: Core } = switchComponent;\n\nconst sizeConfig = {\n  medium: {\n    core: 'default' as const,\n    handleChecked:\n      'data-[state=unchecked]:left-0 data-[state=checked]:left-[calc(100%-16px)]',\n    fontSize: 'text-[9px]',\n    marginChecked: 'mr-4.5 ml-1',\n    marginUnchecked: 'mr-1 ml-4.5',\n  },\n  small: {\n    core: 'sm' as const,\n    handleChecked:\n      'data-[state=unchecked]:left-0 data-[state=checked]:left-[calc(100%-12px)]',\n    fontSize: 'text-[7px]',\n    marginChecked: 'mr-3.5 ml-0.5',\n    marginUnchecked: 'mr-0.5 ml-3.5',\n  },\n};\n\ninterface Props extends Omit<\n  React.ComponentPropsWithoutRef<'button'>,\n  'onChange'\n> {\n  classNames?: {\n    track?: string;\n    handle?: string;\n  };\n  size?: 'small' | 'medium';\n  defaultChecked?: boolean;\n  checked?: boolean;\n  disabled?: boolean;\n  onChange?: (checked: boolean) => void;\n  checkedChildren?: React.ReactNode;\n  unCheckedChildren?: React.ReactNode;\n}\n\nconst Switch = ({\n  className,\n  classNames,\n  size = 'medium',\n  defaultChecked,\n  checked: _checked,\n  onChange: _onChange = () => {},\n  checkedChildren,\n  unCheckedChildren,\n  ...props\n}: Props) => {\n  const [uncontrolledChecked, setUncontrolledChecked] = useState<boolean>(\n    defaultChecked || false,\n  );\n\n  const controlled = _checked !== undefined;\n  const checked = controlled ? _checked : uncontrolledChecked;\n\n  const onChange = (next: boolean) => {\n    if (!controlled) {\n      setUncontrolledChecked(next);\n    }\n    _onChange(next);\n  };\n\n  const hasChildren = !!(checkedChildren || unCheckedChildren);\n  const config = sizeConfig[size];\n\n  return (\n    <Core\n      checked={checked}\n      size={config.core}\n      className={cn(\n        'relative',\n        hasChildren && 'w-auto! overflow-hidden',\n        className,\n        classNames?.track,\n        //\n      )}\n      handleClassName={cn(\n        hasChildren && [\n          '!absolute top-1/2 !-translate-y-1/2 !translate-x-0',\n          'transition-[left] duration-200',\n          config.handleChecked,\n        ],\n        classNames?.handle,\n        //\n      )}\n      onCheckedChange={checked => {\n        onChange(checked);\n      }}\n      {...props}\n    >\n      {hasChildren && (\n        <span\n          className={cn(\n            'grid leading-none text-white transition-[margin] duration-200',\n            config.fontSize,\n            checked ? config.marginChecked : config.marginUnchecked,\n            //\n          )}\n        >\n          <span\n            className={cn(\n              'col-start-1 row-start-1 transition-opacity duration-200',\n              checked ? 'opacity-100' : 'opacity-0',\n            )}\n          >\n            {checkedChildren}\n          </span>\n          <span\n            className={cn(\n              'col-start-1 row-start-1 transition-opacity duration-200',\n              checked ? 'opacity-0' : 'opacity-100',\n            )}\n          >\n            {unCheckedChildren}\n          </span>\n        </span>\n      )}\n    </Core>\n  );\n};\n\nexport default Switch;\n"],"mappings":";;;;;;;;;AAOA,MAAM,EAAE,QAAQ,SAASA;AAEzB,MAAM,aAAa;CACjB,QAAQ;EACN,MAAM;EACN,eACE;EACF,UAAU;EACV,eAAe;EACf,iBAAiB;EAClB;CACD,OAAO;EACL,MAAM;EACN,eACE;EACF,UAAU;EACV,eAAe;EACf,iBAAiB;EAClB;CACF;AAmBD,MAAM,UAAU,EACd,WACA,YACA,OAAO,UACP,gBACA,SAAS,UACT,UAAU,kBAAkB,IAC5B,iBACA,mBACA,GAAG,YACQ;CACX,MAAM,CAAC,qBAAqB,0BAA0B,SACpD,kBAAkB,MACnB;CAED,MAAM,aAAa,aAAa;CAChC,MAAM,UAAU,aAAa,WAAW;CAExC,MAAM,YAAY,SAAkB;AAClC,MAAI,CAAC,WACH,wBAAuB,KAAK;AAE9B,YAAU,KAAK;;CAGjB,MAAM,cAAc,CAAC,EAAE,mBAAmB;CAC1C,MAAM,SAAS,WAAW;AAE1B,QACE,oBAAC;EACU;EACT,MAAM,OAAO;EACb,WAAW,GACT,YACA,eAAe,2BACf,WACA,YAAY,MAEb;EACD,iBAAiB,GACf,eAAe;GACb;GACA;GACA,OAAO;GACR,EACD,YAAY,OAEb;EACD,kBAAiB,YAAW;AAC1B,YAAS,QAAQ;;EAEnB,GAAI;YAEH,eACC,qBAAC;GACC,WAAW,GACT,iEACA,OAAO,UACP,UAAU,OAAO,gBAAgB,OAAO,gBAEzC;cAED,oBAAC;IACC,WAAW,GACT,2DACA,UAAU,gBAAgB,YAC3B;cAEA;KACI,EACP,oBAAC;IACC,WAAW,GACT,2DACA,UAAU,cAAc,cACzB;cAEA;KACI;IACF;GAEJ"}
+{"version":3,"file":"index.mjs","names":["switchComponent"],"sources":["../../../../src/components/atoms/Switch/index.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\n\nimport { switchComponent } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nconst { Switch: Core } = switchComponent;\n\nconst sizeConfig = {\n  medium: {\n    core: 'default' as const,\n    track: 'h-8! w-12!',\n    handle: 'size-6!',\n    handleChecked:\n      'data-[state=unchecked]:left-0.5 data-[state=checked]:left-[calc(100%-26px)]',\n    fontSize: 'text-xs',\n    marginChecked: 'mr-7 ml-2',\n    marginUnchecked: 'mr-2 ml-7',\n  },\n  small: {\n    core: 'sm' as const,\n    track: 'h-6! w-10!',\n    handle: 'size-5!',\n    handleChecked:\n      'data-[state=unchecked]:left-0.5 data-[state=checked]:left-[calc(100%-22px)]',\n    fontSize: 'text-[10px]',\n    marginChecked: 'mr-6 ml-1.5',\n    marginUnchecked: 'mr-1.5 ml-6',\n  },\n};\n\ninterface Props extends Omit<\n  React.ComponentPropsWithoutRef<'button'>,\n  'onChange'\n> {\n  classNames?: {\n    track?: string;\n    handle?: string;\n  };\n  size?: 'small' | 'medium';\n  defaultChecked?: boolean;\n  checked?: boolean;\n  disabled?: boolean;\n  onChange?: (checked: boolean) => void;\n  checkedChildren?: React.ReactNode;\n  unCheckedChildren?: React.ReactNode;\n}\n\nconst Switch = ({\n  className,\n  classNames,\n  size = 'medium',\n  defaultChecked,\n  checked: _checked,\n  onChange: _onChange = () => {},\n  checkedChildren,\n  unCheckedChildren,\n  ...props\n}: Props) => {\n  const [uncontrolledChecked, setUncontrolledChecked] = useState<boolean>(\n    defaultChecked || false,\n  );\n\n  const controlled = _checked !== undefined;\n  const checked = controlled ? _checked : uncontrolledChecked;\n\n  const onChange = (next: boolean) => {\n    if (!controlled) {\n      setUncontrolledChecked(next);\n    }\n    _onChange(next);\n  };\n\n  const hasChildren = !!(checkedChildren || unCheckedChildren);\n  const config = sizeConfig[size];\n\n  return (\n    <Core\n      checked={checked}\n      size={config.core}\n      className={cn(\n        'relative',\n        config.track,\n        hasChildren && 'w-auto! overflow-hidden',\n        className,\n        classNames?.track,\n        //\n      )}\n      handleClassName={cn(\n        config.handle,\n        '!absolute top-1/2 !-translate-y-1/2 !translate-x-0',\n        'transition-[left] duration-200 will-change-[left]',\n        config.handleChecked,\n        classNames?.handle,\n        //\n      )}\n      onCheckedChange={checked => {\n        onChange(checked);\n      }}\n      {...props}\n    >\n      {hasChildren && (\n        <span\n          className={cn(\n            `grid leading-none text-white transition-[margin] duration-200\n            will-change-[margin]`,\n            config.fontSize,\n            checked ? config.marginChecked : config.marginUnchecked,\n            //\n          )}\n        >\n          <span\n            className={cn(\n              'col-start-1 row-start-1 transition-opacity duration-200',\n              checked ? 'opacity-100' : 'opacity-0',\n            )}\n          >\n            {checkedChildren}\n          </span>\n          <span\n            className={cn(\n              'col-start-1 row-start-1 transition-opacity duration-200',\n              checked ? 'opacity-0' : 'opacity-100',\n            )}\n          >\n            {unCheckedChildren}\n          </span>\n        </span>\n      )}\n    </Core>\n  );\n};\n\nexport default Switch;\n"],"mappings":";;;;;;;;;AAOA,MAAM,EAAE,QAAQ,SAASA;AAEzB,MAAM,aAAa;CACjB,QAAQ;EACN,MAAM;EACN,OAAO;EACP,QAAQ;EACR,eACE;EACF,UAAU;EACV,eAAe;EACf,iBAAiB;EAClB;CACD,OAAO;EACL,MAAM;EACN,OAAO;EACP,QAAQ;EACR,eACE;EACF,UAAU;EACV,eAAe;EACf,iBAAiB;EAClB;CACF;AAmBD,MAAM,UAAU,EACd,WACA,YACA,OAAO,UACP,gBACA,SAAS,UACT,UAAU,kBAAkB,IAC5B,iBACA,mBACA,GAAG,YACQ;CACX,MAAM,CAAC,qBAAqB,0BAA0B,SACpD,kBAAkB,MACnB;CAED,MAAM,aAAa,aAAa;CAChC,MAAM,UAAU,aAAa,WAAW;CAExC,MAAM,YAAY,SAAkB;AAClC,MAAI,CAAC,WACH,wBAAuB,KAAK;AAE9B,YAAU,KAAK;;CAGjB,MAAM,cAAc,CAAC,EAAE,mBAAmB;CAC1C,MAAM,SAAS,WAAW;AAE1B,QACE,oBAAC;EACU;EACT,MAAM,OAAO;EACb,WAAW,GACT,YACA,OAAO,OACP,eAAe,2BACf,WACA,YAAY,MAEb;EACD,iBAAiB,GACf,OAAO,QACP,sDACA,qDACA,OAAO,eACP,YAAY,OAEb;EACD,kBAAiB,YAAW;AAC1B,YAAS,QAAQ;;EAEnB,GAAI;YAEH,eACC,qBAAC;GACC,WAAW,GACT;mCAEA,OAAO,UACP,UAAU,OAAO,gBAAgB,OAAO,gBAEzC;cAED,oBAAC;IACC,WAAW,GACT,2DACA,UAAU,gBAAgB,YAC3B;cAEA;KACI,EACP,oBAAC;IACC,WAAW,GACT,2DACA,UAAU,cAAc,cACzB;cAEA;KACI;IACF;GAEJ"}

package/dist/components/molecules/Marquees/Item/index.mjs

@@ -1,7 +1,7 @@
-import { gsapWithCSS } from "../../../../node_modules/gsap/index.mjs";
 import { useEffect, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useGSAP } from "@gsap/react";
+import { gsap } from "gsap";
 
 //#region src/components/molecules/Marquees/Item/index.tsx
 const Item = ({ width: _width, speed = 100, autoFill = false, pause: _pause = false, pauseOnHover = false, children }) => {
@@ -47,7 +47,7 @@ const Item = ({ width: _width, speed = 100, autoFill = false, pause: _pause = fa
 	useGSAP(() => {
 		if (!containerRef.current || typeof width === "string") return;
 		if (tweenRef.current) tweenRef.current.kill();
-		tweenRef.current = gsapWithCSS.fromTo(containerRef.current, { x: 0 }, {
+		tweenRef.current = gsap.fromTo(containerRef.current, { x: 0 }, {
 			x: -width,
 			duration: width / speed,
 			repeat: -1,

package/dist/components/molecules/Marquees/Item/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":["gsap"],"sources":["../../../../../src/components/molecules/Marquees/Item/index.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nimport { useGSAP } from '@gsap/react';\nimport { gsap } from 'gsap';\n\nexport interface ItemProps {\n  key?: React.Key;\n  speed?: number;\n  autoFill?: boolean | number;\n  pause?: boolean;\n  pauseOnHover?: boolean;\n  children?: React.ReactNode;\n}\n\nexport interface Props\n  extends Omit<React.ComponentPropsWithoutRef<'div'>, 'key'>, ItemProps {\n  width: string | number;\n}\n\nconst Item = ({\n  width: _width,\n  speed = 100,\n  autoFill = false,\n  pause: _pause = false,\n  pauseOnHover = false,\n  children,\n}: Props) => {\n  const itemRefs = useRef<HTMLDivElement[]>([]);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const tweenRef = useRef<gsap.core.Tween | null>(null);\n\n  const [width, setWidth] = useState<string | number>(_width);\n  const [pause, setPause] = useState(false);\n  const [repeatCount, setRepeatCount] = useState(\n    autoFill ? (typeof autoFill === 'boolean' ? 100 : autoFill) : 0,\n  );\n\n  const isPaused = _pause || pause;\n\n  const hoverEvents = pauseOnHover\n    ? {\n        onMouseEnter: () => {\n          setPause(true);\n        },\n        onMouseLeave: () => {\n          setPause(false);\n        },\n      }\n    : {};\n\n  useEffect(() => {\n    if (\n      !autoFill ||\n      !children ||\n      !itemRefs.current[0] ||\n      typeof width === 'string'\n    ) {\n      return;\n    }\n\n    const itemWidth = itemRefs.current[0].offsetWidth;\n\n    if (itemWidth >= width) {\n      setWidth(itemWidth);\n      setRepeatCount(0);\n      return;\n    }\n\n    let totalWidth = 0;\n    let repeatCount = 0;\n\n    while (totalWidth < width) {\n      totalWidth += itemWidth;\n      repeatCount += 1;\n    }\n\n    setWidth(totalWidth);\n    setRepeatCount(repeatCount - 1);\n  }, [autoFill, width, children]);\n\n  useEffect(() => {\n    setWidth(_width);\n  }, [_width]);\n\n  useGSAP(\n    () => {\n      if (!containerRef.current || typeof width === 'string') {\n        return;\n      }\n\n      if (tweenRef.current) {\n        tweenRef.current.kill();\n      }\n\n      tweenRef.current = gsap.fromTo(\n        containerRef.current,\n        { x: 0 },\n        {\n          x: -width,\n          duration: width / speed,\n          repeat: -1,\n          ease: 'linear',\n        },\n      );\n\n      return () => {\n        tweenRef.current?.kill();\n      };\n    },\n    {\n      scope: containerRef,\n      dependencies: [width, speed],\n    },\n  );\n\n  useEffect(() => {\n    if (!tweenRef.current) {\n      return;\n    }\n\n    if (isPaused) {\n      tweenRef.current.pause();\n    } else {\n      tweenRef.current.play();\n    }\n  }, [isPaused]);\n\n  useEffect(() => {\n    setRepeatCount(\n      autoFill ? (typeof autoFill === 'boolean' ? 100 : autoFill) : 0,\n    );\n  }, [autoFill]);\n\n  useEffect(() => {\n    const onResize = () => {\n      if (!tweenRef.current || !containerRef.current) {\n        return;\n      }\n      tweenRef.current.pause();\n    };\n\n    window.addEventListener('resize', onResize);\n\n    return () => {\n      window.removeEventListener('resize', onResize);\n    };\n  }, []);\n\n  return (\n    <div\n      className=\"flex overflow-hidden\"\n      {...hoverEvents}\n      //\n    >\n      <div ref={containerRef} className=\"flex flex-nowrap\">\n        {[...Array(2)].map((_, index) => (\n          <div\n            key={index}\n            style={{ minWidth: width }}\n            className=\"flex flex-nowrap\"\n          >\n            <div\n              ref={el => {\n                if (el) {\n                  itemRefs.current[index] = el;\n                }\n              }}\n            >\n              {children}\n            </div>\n            {[\n              ...Array(typeof autoFill === 'number' ? autoFill : repeatCount),\n            ].map((_, i) => (\n              <div key={i}>{children}</div>\n            ))}\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n};\n\nexport default Item;\n"],"mappings":";;;;;;AAmBA,MAAM,QAAQ,EACZ,OAAO,QACP,QAAQ,KACR,WAAW,OACX,OAAO,SAAS,OAChB,eAAe,OACf,eACW;CACX,MAAM,WAAW,OAAyB,EAAE,CAAC;CAC7C,MAAM,eAAe,OAAuB,KAAK;CACjD,MAAM,WAAW,OAA+B,KAAK;CAErD,MAAM,CAAC,OAAO,YAAY,SAA0B,OAAO;CAC3D,MAAM,CAAC,OAAO,YAAY,SAAS,MAAM;CACzC,MAAM,CAAC,aAAa,kBAAkB,SACpC,WAAY,OAAO,aAAa,YAAY,MAAM,WAAY,EAC/D;CAED,MAAM,WAAW,UAAU;CAE3B,MAAM,cAAc,eAChB;EACE,oBAAoB;AAClB,YAAS,KAAK;;EAEhB,oBAAoB;AAClB,YAAS,MAAM;;EAElB,GACD,EAAE;AAEN,iBAAgB;AACd,MACE,CAAC,YACD,CAAC,YACD,CAAC,SAAS,QAAQ,MAClB,OAAO,UAAU,SAEjB;EAGF,MAAM,YAAY,SAAS,QAAQ,GAAG;AAEtC,MAAI,aAAa,OAAO;AACtB,YAAS,UAAU;AACnB,kBAAe,EAAE;AACjB;;EAGF,IAAI,aAAa;EACjB,IAAI,cAAc;AAElB,SAAO,aAAa,OAAO;AACzB,iBAAc;AACd,kBAAe;;AAGjB,WAAS,WAAW;AACpB,iBAAe,cAAc,EAAE;IAC9B;EAAC;EAAU;EAAO;EAAS,CAAC;AAE/B,iBAAgB;AACd,WAAS,OAAO;IACf,CAAC,OAAO,CAAC;AAEZ,eACQ;AACJ,MAAI,CAAC,aAAa,WAAW,OAAO,UAAU,SAC5C;AAGF,MAAI,SAAS,QACX,UAAS,QAAQ,MAAM;AAGzB,WAAS,UAAUA,YAAK,OACtB,aAAa,SACb,EAAE,GAAG,GAAG,EACR;GACE,GAAG,CAAC;GACJ,UAAU,QAAQ;GAClB,QAAQ;GACR,MAAM;GACP,CACF;AAED,eAAa;AACX,YAAS,SAAS,MAAM;;IAG5B;EACE,OAAO;EACP,cAAc,CAAC,OAAO,MAAM;EAC7B,CACF;AAED,iBAAgB;AACd,MAAI,CAAC,SAAS,QACZ;AAGF,MAAI,SACF,UAAS,QAAQ,OAAO;MAExB,UAAS,QAAQ,MAAM;IAExB,CAAC,SAAS,CAAC;AAEd,iBAAgB;AACd,iBACE,WAAY,OAAO,aAAa,YAAY,MAAM,WAAY,EAC/D;IACA,CAAC,SAAS,CAAC;AAEd,iBAAgB;EACd,MAAM,iBAAiB;AACrB,OAAI,CAAC,SAAS,WAAW,CAAC,aAAa,QACrC;AAEF,YAAS,QAAQ,OAAO;;AAG1B,SAAO,iBAAiB,UAAU,SAAS;AAE3C,eAAa;AACX,UAAO,oBAAoB,UAAU,SAAS;;IAE/C,EAAE,CAAC;AAEN,QACE,oBAAC;EACC,WAAU;EACV,GAAI;YAGJ,oBAAC;GAAI,KAAK;GAAc,WAAU;aAC/B,CAAC,GAAG,MAAM,EAAE,CAAC,CAAC,KAAK,GAAG,UACrB,qBAAC;IAEC,OAAO,EAAE,UAAU,OAAO;IAC1B,WAAU;eAEV,oBAAC;KACC,MAAK,OAAM;AACT,UAAI,GACF,UAAS,QAAQ,SAAS;;KAI7B;MACG,EACL,CACC,GAAG,MAAM,OAAO,aAAa,WAAW,WAAW,YAAY,CAChE,CAAC,KAAK,GAAG,MACR,oBAAC,SAAa,YAAJ,EAAmB,CAC7B;MAjBG,MAkBD,CACN;IACE;GACF"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../../../src/components/molecules/Marquees/Item/index.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nimport { useGSAP } from '@gsap/react';\nimport { gsap } from 'gsap';\n\nexport interface ItemProps {\n  key?: React.Key;\n  speed?: number;\n  autoFill?: boolean | number;\n  pause?: boolean;\n  pauseOnHover?: boolean;\n  children?: React.ReactNode;\n}\n\nexport interface Props\n  extends Omit<React.ComponentPropsWithoutRef<'div'>, 'key'>, ItemProps {\n  width: string | number;\n}\n\nconst Item = ({\n  width: _width,\n  speed = 100,\n  autoFill = false,\n  pause: _pause = false,\n  pauseOnHover = false,\n  children,\n}: Props) => {\n  const itemRefs = useRef<HTMLDivElement[]>([]);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const tweenRef = useRef<gsap.core.Tween | null>(null);\n\n  const [width, setWidth] = useState<string | number>(_width);\n  const [pause, setPause] = useState(false);\n  const [repeatCount, setRepeatCount] = useState(\n    autoFill ? (typeof autoFill === 'boolean' ? 100 : autoFill) : 0,\n  );\n\n  const isPaused = _pause || pause;\n\n  const hoverEvents = pauseOnHover\n    ? {\n        onMouseEnter: () => {\n          setPause(true);\n        },\n        onMouseLeave: () => {\n          setPause(false);\n        },\n      }\n    : {};\n\n  useEffect(() => {\n    if (\n      !autoFill ||\n      !children ||\n      !itemRefs.current[0] ||\n      typeof width === 'string'\n    ) {\n      return;\n    }\n\n    const itemWidth = itemRefs.current[0].offsetWidth;\n\n    if (itemWidth >= width) {\n      setWidth(itemWidth);\n      setRepeatCount(0);\n      return;\n    }\n\n    let totalWidth = 0;\n    let repeatCount = 0;\n\n    while (totalWidth < width) {\n      totalWidth += itemWidth;\n      repeatCount += 1;\n    }\n\n    setWidth(totalWidth);\n    setRepeatCount(repeatCount - 1);\n  }, [autoFill, width, children]);\n\n  useEffect(() => {\n    setWidth(_width);\n  }, [_width]);\n\n  useGSAP(\n    () => {\n      if (!containerRef.current || typeof width === 'string') {\n        return;\n      }\n\n      if (tweenRef.current) {\n        tweenRef.current.kill();\n      }\n\n      tweenRef.current = gsap.fromTo(\n        containerRef.current,\n        { x: 0 },\n        {\n          x: -width,\n          duration: width / speed,\n          repeat: -1,\n          ease: 'linear',\n        },\n      );\n\n      return () => {\n        tweenRef.current?.kill();\n      };\n    },\n    {\n      scope: containerRef,\n      dependencies: [width, speed],\n    },\n  );\n\n  useEffect(() => {\n    if (!tweenRef.current) {\n      return;\n    }\n\n    if (isPaused) {\n      tweenRef.current.pause();\n    } else {\n      tweenRef.current.play();\n    }\n  }, [isPaused]);\n\n  useEffect(() => {\n    setRepeatCount(\n      autoFill ? (typeof autoFill === 'boolean' ? 100 : autoFill) : 0,\n    );\n  }, [autoFill]);\n\n  useEffect(() => {\n    const onResize = () => {\n      if (!tweenRef.current || !containerRef.current) {\n        return;\n      }\n      tweenRef.current.pause();\n    };\n\n    window.addEventListener('resize', onResize);\n\n    return () => {\n      window.removeEventListener('resize', onResize);\n    };\n  }, []);\n\n  return (\n    <div\n      className=\"flex overflow-hidden\"\n      {...hoverEvents}\n      //\n    >\n      <div ref={containerRef} className=\"flex flex-nowrap\">\n        {[...Array(2)].map((_, index) => (\n          <div\n            key={index}\n            style={{ minWidth: width }}\n            className=\"flex flex-nowrap\"\n          >\n            <div\n              ref={el => {\n                if (el) {\n                  itemRefs.current[index] = el;\n                }\n              }}\n            >\n              {children}\n            </div>\n            {[\n              ...Array(typeof autoFill === 'number' ? autoFill : repeatCount),\n            ].map((_, i) => (\n              <div key={i}>{children}</div>\n            ))}\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n};\n\nexport default Item;\n"],"mappings":";;;;;;AAmBA,MAAM,QAAQ,EACZ,OAAO,QACP,QAAQ,KACR,WAAW,OACX,OAAO,SAAS,OAChB,eAAe,OACf,eACW;CACX,MAAM,WAAW,OAAyB,EAAE,CAAC;CAC7C,MAAM,eAAe,OAAuB,KAAK;CACjD,MAAM,WAAW,OAA+B,KAAK;CAErD,MAAM,CAAC,OAAO,YAAY,SAA0B,OAAO;CAC3D,MAAM,CAAC,OAAO,YAAY,SAAS,MAAM;CACzC,MAAM,CAAC,aAAa,kBAAkB,SACpC,WAAY,OAAO,aAAa,YAAY,MAAM,WAAY,EAC/D;CAED,MAAM,WAAW,UAAU;CAE3B,MAAM,cAAc,eAChB;EACE,oBAAoB;AAClB,YAAS,KAAK;;EAEhB,oBAAoB;AAClB,YAAS,MAAM;;EAElB,GACD,EAAE;AAEN,iBAAgB;AACd,MACE,CAAC,YACD,CAAC,YACD,CAAC,SAAS,QAAQ,MAClB,OAAO,UAAU,SAEjB;EAGF,MAAM,YAAY,SAAS,QAAQ,GAAG;AAEtC,MAAI,aAAa,OAAO;AACtB,YAAS,UAAU;AACnB,kBAAe,EAAE;AACjB;;EAGF,IAAI,aAAa;EACjB,IAAI,cAAc;AAElB,SAAO,aAAa,OAAO;AACzB,iBAAc;AACd,kBAAe;;AAGjB,WAAS,WAAW;AACpB,iBAAe,cAAc,EAAE;IAC9B;EAAC;EAAU;EAAO;EAAS,CAAC;AAE/B,iBAAgB;AACd,WAAS,OAAO;IACf,CAAC,OAAO,CAAC;AAEZ,eACQ;AACJ,MAAI,CAAC,aAAa,WAAW,OAAO,UAAU,SAC5C;AAGF,MAAI,SAAS,QACX,UAAS,QAAQ,MAAM;AAGzB,WAAS,UAAU,KAAK,OACtB,aAAa,SACb,EAAE,GAAG,GAAG,EACR;GACE,GAAG,CAAC;GACJ,UAAU,QAAQ;GAClB,QAAQ;GACR,MAAM;GACP,CACF;AAED,eAAa;AACX,YAAS,SAAS,MAAM;;IAG5B;EACE,OAAO;EACP,cAAc,CAAC,OAAO,MAAM;EAC7B,CACF;AAED,iBAAgB;AACd,MAAI,CAAC,SAAS,QACZ;AAGF,MAAI,SACF,UAAS,QAAQ,OAAO;MAExB,UAAS,QAAQ,MAAM;IAExB,CAAC,SAAS,CAAC;AAEd,iBAAgB;AACd,iBACE,WAAY,OAAO,aAAa,YAAY,MAAM,WAAY,EAC/D;IACA,CAAC,SAAS,CAAC;AAEd,iBAAgB;EACd,MAAM,iBAAiB;AACrB,OAAI,CAAC,SAAS,WAAW,CAAC,aAAa,QACrC;AAEF,YAAS,QAAQ,OAAO;;AAG1B,SAAO,iBAAiB,UAAU,SAAS;AAE3C,eAAa;AACX,UAAO,oBAAoB,UAAU,SAAS;;IAE/C,EAAE,CAAC;AAEN,QACE,oBAAC;EACC,WAAU;EACV,GAAI;YAGJ,oBAAC;GAAI,KAAK;GAAc,WAAU;aAC/B,CAAC,GAAG,MAAM,EAAE,CAAC,CAAC,KAAK,GAAG,UACrB,qBAAC;IAEC,OAAO,EAAE,UAAU,OAAO;IAC1B,WAAU;eAEV,oBAAC;KACC,MAAK,OAAM;AACT,UAAI,GACF,UAAS,QAAQ,SAAS;;KAI7B;MACG,EACL,CACC,GAAG,MAAM,OAAO,aAAa,WAAW,WAAW,YAAY,CAChE,CAAC,KAAK,GAAG,MACR,oBAAC,SAAa,YAAJ,EAAmB,CAC7B;MAjBG,MAkBD,CACN;IACE;GACF"}

package/dist/components/molecules/Space/index.mjs

@@ -1,7 +1,7 @@
 import { cn } from "../../../utils.mjs";
 import Skeleton from "../../atoms/Skeleton/index.mjs";
 import { Children } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/molecules/Space/index.tsx
 const sizes = {
@@ -32,7 +32,7 @@ const Space = ({ loading, loader, children, size = "middle", orientation = "hori
 			...style
 		},
 		...props,
-		children: Children.map(children, (child, i) => /* @__PURE__ */ jsxs(Fragment, { children: [child, split && i < count - 1 && split] }))
+		children: Children.map(children, (child, i) => /* @__PURE__ */ jsxs(Fragment$1, { children: [child, split && i < count - 1 && split] }))
 	});
 };
 

package/dist/components/molecules/Space/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/molecules/Space/index.tsx"],"sourcesContent":["import { Children } from 'react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport Skeleton from '../../atoms/Skeleton';\n\ninterface Props extends React.ComponentPropsWithRef<'div'> {\n  loading?: boolean;\n  loader?: React.ReactNode;\n  orientation?: 'horizontal' | 'vertical';\n  size?: 'small' | 'middle' | 'large' | number | number[];\n  align?: 'start' | 'end' | 'center' | 'baseline';\n  wrap?: boolean;\n  split?: React.ReactNode;\n  grid?: {\n    rows?: number;\n    cols?: number;\n  };\n}\n\nconst sizes: Record<string, number[]> = {\n  small: [4, 4],\n  middle: [8, 8],\n  large: [16, 16],\n};\n\nconst aligns: Record<string, string> = {\n  start: 'items-start text-start',\n  end: 'items-end text-end',\n  center: 'items-center text-center',\n  baseline: 'items-baseline text-baseline',\n};\n\nconst Space = ({\n  loading,\n  loader,\n  children,\n  size = 'middle',\n  orientation = 'horizontal',\n  align = 'center',\n  wrap = false,\n  split,\n  className,\n  grid,\n  hidden,\n  style,\n  ...props\n}: Props) => {\n  const [x, y] =\n    typeof size === 'string'\n      ? sizes[size] || [0, 0]\n      : Array.isArray(size)\n        ? size\n        : [size, size];\n  const count = Children.count(children);\n\n  if (loading) {\n    return <div className={cn(className)}>{loader || <Skeleton />}</div>;\n  }\n\n  return (\n    <div\n      className={cn(\n        'flex flex-nowrap',\n        orientation === 'horizontal' ? 'flex-row' : 'flex-col',\n        wrap && 'flex-wrap',\n        aligns[align],\n        grid && 'grid',\n        hidden && 'hidden',\n        className,\n      )}\n      style={{\n        columnGap: x,\n        rowGap: y,\n        gridTemplateRows: grid?.rows\n          ? `repeat(${grid.rows}, minmax(0, 1fr))`\n          : undefined,\n        gridTemplateColumns: grid?.cols\n          ? `repeat(${grid.cols}, minmax(0, 1fr))`\n          : undefined,\n        ...style,\n      }}\n      {...props}\n    >\n      {Children.map(children, (child, i) => (\n        <>\n          {child}\n          {split && i < count - 1 && split}\n        </>\n      ))}\n    </div>\n  );\n};\n\nexport default Space;\n"],"mappings":";;;;;;AAoBA,MAAM,QAAkC;CACtC,OAAO,CAAC,GAAG,EAAE;CACb,QAAQ,CAAC,GAAG,EAAE;CACd,OAAO,CAAC,IAAI,GAAG;CAChB;AAED,MAAM,SAAiC;CACrC,OAAO;CACP,KAAK;CACL,QAAQ;CACR,UAAU;CACX;AAED,MAAM,SAAS,EACb,SACA,QACA,UACA,OAAO,UACP,cAAc,cACd,QAAQ,UACR,OAAO,OACP,OACA,WACA,MACA,QACA,OACA,GAAG,YACQ;CACX,MAAM,CAAC,GAAG,KACR,OAAO,SAAS,WACZ,MAAM,SAAS,CAAC,GAAG,EAAE,GACrB,MAAM,QAAQ,KAAK,GACjB,OACA,CAAC,MAAM,KAAK;CACpB,MAAM,QAAQ,SAAS,MAAM,SAAS;AAEtC,KAAI,QACF,QAAO,oBAAC;EAAI,WAAW,GAAG,UAAU;YAAG,UAAU,oBAAC,aAAW;GAAO;AAGtE,QACE,oBAAC;EACC,WAAW,GACT,oBACA,gBAAgB,eAAe,aAAa,YAC5C,QAAQ,aACR,OAAO,QACP,QAAQ,QACR,UAAU,UACV,UACD;EACD,OAAO;GACL,WAAW;GACX,QAAQ;GACR,kBAAkB,MAAM,OACpB,UAAU,KAAK,KAAK,qBACpB;GACJ,qBAAqB,MAAM,OACvB,UAAU,KAAK,KAAK,qBACpB;GACJ,GAAG;GACJ;EACD,GAAI;YAEH,SAAS,IAAI,WAAW,OAAO,MAC9B,4CACG,OACA,SAAS,IAAI,QAAQ,KAAK,SAC1B,CACH;GACE"}
+{"version":3,"file":"index.mjs","names":[],"sources":["../../../../src/components/molecules/Space/index.tsx"],"sourcesContent":["import { Children } from 'react';\n\nimport { cn } from '@repo/ui/utils';\n\nimport Skeleton from '../../atoms/Skeleton';\n\ninterface Props extends React.ComponentPropsWithRef<'div'> {\n  loading?: boolean;\n  loader?: React.ReactNode;\n  orientation?: 'horizontal' | 'vertical';\n  size?: 'small' | 'middle' | 'large' | number | number[];\n  align?: 'start' | 'end' | 'center' | 'baseline';\n  wrap?: boolean;\n  split?: React.ReactNode;\n  grid?: {\n    rows?: number;\n    cols?: number;\n  };\n}\n\nconst sizes: Record<string, number[]> = {\n  small: [4, 4],\n  middle: [8, 8],\n  large: [16, 16],\n};\n\nconst aligns: Record<string, string> = {\n  start: 'items-start text-start',\n  end: 'items-end text-end',\n  center: 'items-center text-center',\n  baseline: 'items-baseline text-baseline',\n};\n\nconst Space = ({\n  loading,\n  loader,\n  children,\n  size = 'middle',\n  orientation = 'horizontal',\n  align = 'center',\n  wrap = false,\n  split,\n  className,\n  grid,\n  hidden,\n  style,\n  ...props\n}: Props) => {\n  const [x, y] =\n    typeof size === 'string'\n      ? sizes[size] || [0, 0]\n      : Array.isArray(size)\n        ? size\n        : [size, size];\n  const count = Children.count(children);\n\n  if (loading) {\n    return <div className={cn(className)}>{loader || <Skeleton />}</div>;\n  }\n\n  return (\n    <div\n      className={cn(\n        'flex flex-nowrap',\n        orientation === 'horizontal' ? 'flex-row' : 'flex-col',\n        wrap && 'flex-wrap',\n        aligns[align],\n        grid && 'grid',\n        hidden && 'hidden',\n        className,\n      )}\n      style={{\n        columnGap: x,\n        rowGap: y,\n        gridTemplateRows: grid?.rows\n          ? `repeat(${grid.rows}, minmax(0, 1fr))`\n          : undefined,\n        gridTemplateColumns: grid?.cols\n          ? `repeat(${grid.cols}, minmax(0, 1fr))`\n          : undefined,\n        ...style,\n      }}\n      {...props}\n    >\n      {Children.map(children, (child, i) => (\n        <>\n          {child}\n          {split && i < count - 1 && split}\n        </>\n      ))}\n    </div>\n  );\n};\n\nexport default Space;\n"],"mappings":";;;;;;AAoBA,MAAM,QAAkC;CACtC,OAAO,CAAC,GAAG,EAAE;CACb,QAAQ,CAAC,GAAG,EAAE;CACd,OAAO,CAAC,IAAI,GAAG;CAChB;AAED,MAAM,SAAiC;CACrC,OAAO;CACP,KAAK;CACL,QAAQ;CACR,UAAU;CACX;AAED,MAAM,SAAS,EACb,SACA,QACA,UACA,OAAO,UACP,cAAc,cACd,QAAQ,UACR,OAAO,OACP,OACA,WACA,MACA,QACA,OACA,GAAG,YACQ;CACX,MAAM,CAAC,GAAG,KACR,OAAO,SAAS,WACZ,MAAM,SAAS,CAAC,GAAG,EAAE,GACrB,MAAM,QAAQ,KAAK,GACjB,OACA,CAAC,MAAM,KAAK;CACpB,MAAM,QAAQ,SAAS,MAAM,SAAS;AAEtC,KAAI,QACF,QAAO,oBAAC;EAAI,WAAW,GAAG,UAAU;YAAG,UAAU,oBAAC,aAAW;GAAO;AAGtE,QACE,oBAAC;EACC,WAAW,GACT,oBACA,gBAAgB,eAAe,aAAa,YAC5C,QAAQ,aACR,OAAO,QACP,QAAQ,QACR,UAAU,UACV,UACD;EACD,OAAO;GACL,WAAW;GACX,QAAQ;GACR,kBAAkB,MAAM,OACpB,UAAU,KAAK,KAAK,qBACpB;GACJ,qBAAqB,MAAM,OACvB,UAAU,KAAK,KAAK,qBACpB;GACJ,GAAG;GACJ;EACD,GAAI;YAEH,SAAS,IAAI,WAAW,OAAO,MAC9B,8CACG,OACA,SAAS,IAAI,QAAQ,KAAK,SAC1B,CACH;GACE"}

package/dist/components/molecules/Splitter/index.d.mts

@@ -0,0 +1,31 @@
+import { ResizablePanel as ResizablePanel$1, ResizablePanelGroup as ResizablePanelGroup$1 } from "../../../core/resizable.mjs";
+import "../../../core.mjs";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/molecules/Splitter/index.d.ts
+declare const ResizablePanel: typeof ResizablePanel$1, ResizablePanelGroup: typeof ResizablePanelGroup$1;
+type SplitterLayout = Parameters<NonNullable<React.ComponentProps<typeof ResizablePanelGroup>['onLayoutChanged']>>[0];
+interface SplitterPanelProps extends React.ComponentProps<typeof ResizablePanel> {
+  children: React.ReactNode;
+}
+interface Props extends Omit<React.ComponentProps<typeof ResizablePanelGroup>, 'children' | 'orientation' | 'onLayoutChange' | 'onLayoutChanged' | 'onResize'> {
+  children: React.ReactNode;
+  orientation?: 'horizontal' | 'vertical';
+  withHandle?: boolean;
+  handle?: React.ReactNode;
+  handleClassName?: string;
+  onResize?: (layout: SplitterLayout) => void;
+  onResizeEnd?: (layout: SplitterLayout) => void;
+}
+type SplitterComponent = ((props: Props) => React.ReactNode) & {
+  Panel: typeof SplitterPanel;
+};
+declare const SplitterPanel: ({
+  children,
+  className,
+  ...props
+}: SplitterPanelProps) => react_jsx_runtime0.JSX.Element;
+declare const Splitter: SplitterComponent;
+//#endregion
+export { Splitter };
+//# sourceMappingURL=index.d.mts.map

package/dist/components/molecules/Splitter/index.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.mts","names":[],"sources":["../../../../src/components/molecules/Splitter/index.tsx"],"mappings":";;;;;cAOyB,cAAA,SAAc,gBAAA,EAAE,mBAAA,SAAmB,qBAAA;AAAA,KAEvD,cAAA,GAAiB,UAAA,CACpB,WAAA,CACE,KAAA,CAAM,cAAA,QAAsB,mBAAA;AAAA,UAIf,kBAAA,SAA2B,KAAA,CAAM,cAAA,QACzC,cAAA;EAEP,QAAA,EAAU,KAAA,CAAM,SAAA;AAAA;AAAA,UAGD,KAAA,SAAc,IAAA,CAC7B,KAAA,CAAM,cAAA,QAAsB,mBAAA;EAG5B,QAAA,EAAU,KAAA,CAAM,SAAA;EAChB,WAAA;EACA,UAAA;EACA,MAAA,GAAS,KAAA,CAAM,SAAA;EACf,eAAA;EACA,QAAA,IAAY,MAAA,EAAQ,cAAA;EACpB,WAAA,IAAe,MAAA,EAAQ,cAAA;AAAA;AAAA,KAGpB,iBAAA,KAAsB,KAAA,EAAO,KAAA,KAAU,KAAA,CAAM,SAAA;EAChD,KAAA,SAAc,aAAA;AAAA;AAAA,cAGV,aAAA;EAAiB,QAAA;EAAA,SAAA;EAAA,GAAA;AAAA,GAIpB,kBAAA,KAAkB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,cAWf,QAAA,EA0CA,iBAAA"}

package/dist/components/molecules/Splitter/index.mjs

@@ -0,0 +1,37 @@
+'use client';
+
+import { cn } from "../../../utils.mjs";
+import { resizable_exports } from "../../../core/resizable.mjs";
+import "../../../core.mjs";
+import { Children, Fragment } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/molecules/Splitter/index.tsx
+const { ResizableHandle, ResizablePanel, ResizablePanelGroup } = resizable_exports;
+const SplitterPanel = ({ children, className, ...props }) => {
+	return /* @__PURE__ */ jsx(ResizablePanel, {
+		className: cn("min-h-0 min-w-0 overflow-auto", className),
+		...props,
+		children
+	});
+};
+const Splitter = (({ children, className, orientation = "horizontal", withHandle = true, handle, handleClassName, onResize, onResizeEnd, ...props }) => {
+	const panels = Children.toArray(children);
+	return /* @__PURE__ */ jsx(ResizablePanelGroup, {
+		className: cn("border-border/60 h-full w-full rounded-lg border", className),
+		orientation,
+		onLayoutChange: onResize,
+		onLayoutChanged: onResizeEnd,
+		...props,
+		children: panels.map((panel, index) => /* @__PURE__ */ jsxs(Fragment, { children: [panel, index < panels.length - 1 && /* @__PURE__ */ jsx(ResizableHandle, {
+			className: cn("hover:bg-border/80 data-separator-active:bg-border transition-colors", handleClassName),
+			withHandle: withHandle && handle === void 0,
+			children: handle
+		})] }, index))
+	});
+});
+Splitter.Panel = SplitterPanel;
+
+//#endregion
+export { Splitter as default };
+//# sourceMappingURL=index.mjs.map

package/dist/components/molecules/Splitter/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":["resizable"],"sources":["../../../../src/components/molecules/Splitter/index.tsx"],"sourcesContent":["'use client';\n\nimport { Children, Fragment } from 'react';\n\nimport { resizable } from '@repo/ui/core';\nimport { cn } from '@repo/ui/utils';\n\nconst { ResizableHandle, ResizablePanel, ResizablePanelGroup } = resizable;\n\ntype SplitterLayout = Parameters<\n  NonNullable<\n    React.ComponentProps<typeof ResizablePanelGroup>['onLayoutChanged']\n  >\n>[0];\n\nexport interface SplitterPanelProps extends React.ComponentProps<\n  typeof ResizablePanel\n> {\n  children: React.ReactNode;\n}\n\nexport interface Props extends Omit<\n  React.ComponentProps<typeof ResizablePanelGroup>,\n  'children' | 'orientation' | 'onLayoutChange' | 'onLayoutChanged' | 'onResize'\n> {\n  children: React.ReactNode;\n  orientation?: 'horizontal' | 'vertical';\n  withHandle?: boolean;\n  handle?: React.ReactNode;\n  handleClassName?: string;\n  onResize?: (layout: SplitterLayout) => void;\n  onResizeEnd?: (layout: SplitterLayout) => void;\n}\n\ntype SplitterComponent = ((props: Props) => React.ReactNode) & {\n  Panel: typeof SplitterPanel;\n};\n\nconst SplitterPanel = ({\n  children,\n  className,\n  ...props\n}: SplitterPanelProps) => {\n  return (\n    <ResizablePanel\n      className={cn('min-h-0 min-w-0 overflow-auto', className)}\n      {...props}\n    >\n      {children}\n    </ResizablePanel>\n  );\n};\n\nconst Splitter = (({\n  children,\n  className,\n  orientation = 'horizontal',\n  withHandle = true,\n  handle,\n  handleClassName,\n  onResize,\n  onResizeEnd,\n  ...props\n}: Props) => {\n  const panels = Children.toArray(children);\n\n  return (\n    <ResizablePanelGroup\n      className={cn(\n        'border-border/60 h-full w-full rounded-lg border',\n        className,\n      )}\n      orientation={orientation}\n      onLayoutChange={onResize}\n      onLayoutChanged={onResizeEnd}\n      {...props}\n    >\n      {panels.map((panel, index) => (\n        <Fragment key={index}>\n          {panel}\n          {index < panels.length - 1 && (\n            <ResizableHandle\n              className={cn(\n                'hover:bg-border/80 data-separator-active:bg-border transition-colors',\n                handleClassName,\n              )}\n              withHandle={withHandle && handle === undefined}\n            >\n              {handle}\n            </ResizableHandle>\n          )}\n        </Fragment>\n      ))}\n    </ResizablePanelGroup>\n  );\n}) as SplitterComponent;\n\nSplitter.Panel = SplitterPanel;\n\nexport default Splitter;\n"],"mappings":";;;;;;;;;AAOA,MAAM,EAAE,iBAAiB,gBAAgB,wBAAwBA;AA+BjE,MAAM,iBAAiB,EACrB,UACA,WACA,GAAG,YACqB;AACxB,QACE,oBAAC;EACC,WAAW,GAAG,iCAAiC,UAAU;EACzD,GAAI;EAEH;GACc;;AAIrB,MAAM,aAAa,EACjB,UACA,WACA,cAAc,cACd,aAAa,MACb,QACA,iBACA,UACA,aACA,GAAG,YACQ;CACX,MAAM,SAAS,SAAS,QAAQ,SAAS;AAEzC,QACE,oBAAC;EACC,WAAW,GACT,oDACA,UACD;EACY;EACb,gBAAgB;EAChB,iBAAiB;EACjB,GAAI;YAEH,OAAO,KAAK,OAAO,UAClB,qBAAC,uBACE,OACA,QAAQ,OAAO,SAAS,KACvB,oBAAC;GACC,WAAW,GACT,wEACA,gBACD;GACD,YAAY,cAAc,WAAW;aAEpC;IACe,KAXP,MAaJ,CACX;GACkB;;AAI1B,SAAS,QAAQ"}

package/dist/components/molecules/index.d.mts

@@ -4,4 +4,5 @@ import { Card } from "./Card/index.mjs";
 import { Collapse } from "./Collapse/index.mjs";
 import { Dropdown } from "./Dropdown/index.mjs";
 import { Marquees } from "./Marquees/index.mjs";
+import { Splitter } from "./Splitter/index.mjs";
 import { Space } from "./Space/index.mjs";

package/dist/components/molecules/index.mjs

@@ -4,6 +4,7 @@ import Menu from "../../Menu.mjs";
 import Dropdown from "./Dropdown/index.mjs";
 import Marquees from "./Marquees/index.mjs";
 import Reveals from "../../Reveals.mjs";
+import Splitter from "./Splitter/index.mjs";
 import Space from "./Space/index.mjs";
 
 export {  };

package/dist/components/organisms/Drawer/index.d.mts

@@ -5,10 +5,12 @@ interface Props {
   open: boolean;
   children?: React.ReactNode;
   title?: React.ReactNode;
+  extra?: React.ReactNode;
   footer?: React.ReactNode;
   closable?: boolean;
   closeIcon?: React.ReactNode;
   direction?: 'top' | 'bottom' | 'left' | 'right';
+  size?: 'small' | 'medium' | 'large' | 'full' | string;
   maskClosable?: boolean;
   handlebar?: boolean;
   draggable?: boolean;
@@ -23,6 +25,7 @@ interface Props {
     header?: string;
     title?: string;
     close?: string;
+    extra?: string;
     body?: string;
     footer?: string;
   };
@@ -32,10 +35,12 @@ interface Props {
 declare const Drawer: ({
   open,
   title,
+  extra,
   footer,
   closable,
   closeIcon,
   direction,
+  size,
   maskClosable,
   handlebar,
   draggable,
@@ -48,7 +53,7 @@ declare const Drawer: ({
   container,
   onClose,
   ...props
-}: Props) => react_jsx_runtime0.JSX.Element | null;
+}: Props) => react_jsx_runtime0.JSX.Element;
 //#endregion
-export { Drawer };
+export { Drawer, Props };
 //# sourceMappingURL=index.d.mts.map

package/dist/components/organisms/Drawer/index.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.mts","names":[],"sources":["../../../../src/components/organisms/Drawer/index.tsx"],"mappings":";;;UAkBU,KAAA;EACR,IAAA;EACA,QAAA,GAAW,KAAA,CAAM,SAAA;EACjB,KAAA,GAAQ,KAAA,CAAM,SAAA;EACd,MAAA,GAAS,KAAA,CAAM,SAAA;EACf,QAAA;EACA,SAAA,GAAY,KAAA,CAAM,SAAA;EAClB,SAAA;EACA,YAAA;EACA,SAAA;EACA,SAAA;EACA,OAAA;EACA,IAAA;EACA,SAAA;EACA,KAAA,GAAQ,KAAA,CAAM,aAAA;EACd,UAAA;IACE,IAAA;IACA,OAAA;IACA,SAAA;IACA,MAAA;IACA,KAAA;IACA,KAAA;IACA,IAAA;IACA,MAAA;EAAA;EAEF,SAAA,GAAY,WAAA;EACZ,OAAA;AAAA;AAAA,cAGI,MAAA;EAAU,IAAA;EAAA,KAAA;EAAA,MAAA;EAAA,QAAA;EAAA,SAAA;EAAA,SAAA;EAAA,YAAA;EAAA,SAAA;EAAA,SAAA;EAAA,OAAA;EAAA,IAAA;EAAA,SAAA;EAAA,UAAA;EAAA,KAAA;EAAA,QAAA;EAAA,SAAA;EAAA,OAAA;EAAA,GAAA;AAAA,GAmBb,KAAA,KAAK,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"index.d.mts","names":[],"sources":["../../../../src/components/organisms/Drawer/index.tsx"],"mappings":";;;UAoBiB,KAAA;EACf,IAAA;EACA,QAAA,GAAW,KAAA,CAAM,SAAA;EACjB,KAAA,GAAQ,KAAA,CAAM,SAAA;EACd,KAAA,GAAQ,KAAA,CAAM,SAAA;EACd,MAAA,GAAS,KAAA,CAAM,SAAA;EACf,QAAA;EACA,SAAA,GAAY,KAAA,CAAM,SAAA;EAClB,SAAA;EACA,IAAA;EACA,YAAA;EACA,SAAA;EACA,SAAA;EACA,OAAA;EACA,IAAA;EACA,SAAA;EACA,KAAA,GAAQ,KAAA,CAAM,aAAA;EACd,UAAA;IACE,IAAA;IACA,OAAA;IACA,SAAA;IACA,MAAA;IACA,KAAA;IACA,KAAA;IACA,KAAA;IACA,IAAA;IACA,MAAA;EAAA;EAEF,SAAA,GAAY,WAAA;EACZ,OAAA;AAAA;AAAA,cAqBI,MAAA;EAAU,IAAA;EAAA,KAAA;EAAA,KAAA;EAAA,MAAA;EAAA,QAAA;EAAA,SAAA;EAAA,SAAA;EAAA,IAAA;EAAA,YAAA;EAAA,SAAA;EAAA,SAAA;EAAA,OAAA;EAAA,IAAA;EAAA,SAAA;EAAA,UAAA;EAAA,KAAA;EAAA,QAAA;EAAA,SAAA;EAAA,OAAA;EAAA,GAAA;AAAA,GAqBb,KAAA,KAAK,kBAAA,CAAA,GAAA,CAAA,OAAA"}