@startdownnotez404/ui 1.0.0 → 1.3.5

package/dist/chunk-SGCUDWO3.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/elemental/Autocomplete/src/GitHubPicker/GitHubPicker.tsx","../src/_utils/_func/array.ts"],"sourcesContent":["'use client'\nimport {useState, useMemo, useId, Suspense, lazy} from 'react'\nimport { Box } from '@/ele/Box'\nimport { Typography } from '@/ele/Typography'\nimport { IconButton } from '@/ele/Button'\nimport { Badge } from '@/ele/Badge'\nimport { ClickAwayListener } from '@/ele/Overlay'\nimport { FilterIcon, KeyboardArrowDownIcon } from '@/icons/MuiIcon'\nimport { sortByKey } from '@/_utils/_func'\n\nimport OptionRenderer from './OptionRenderer'\nimport { PickerField, gitHubPickerRootSx } from './theme'\nimport {\n\tOptionClass,\n\ttype OptionId, type OptionIds,\n\ttype MinimalOption,\n} from './_utils'\nimport {\n\tLocalSelectedProvider, useLocalSelectedContext,\n} from './states'\n\nconst PopperMenu = lazy(() => import('./PopperMenu'))\ntype PopperMenuProps = React.ComponentProps<typeof import('./PopperMenu').default>\n\nexport type GitHubPickerVariant = 'field' | 'icon'\nexport type GitHubPickerColor =\n\t| 'primary'\n\t| 'secondary'\n\t| 'error'\n\t| 'info'\n\t| 'success'\n\t| 'warning'\n\t| 'system'\n\t| 'insight'\n\nconst PICKER_ACCENT: Record<GitHubPickerColor, string> = {\n\tprimary: 'var(--mui-palette-primary-emphasis)',\n\tsecondary: 'var(--mui-palette-secondary-main)',\n\terror: 'var(--mui-palette-error-main)',\n\tinfo: 'var(--mui-palette-info-main)',\n\tsuccess: 'var(--mui-palette-success-main)',\n\twarning: 'var(--mui-palette-warning-main)',\n\tsystem: 'var(--mui-palette-system-main)',\n\tinsight: 'var(--mui-palette-insight-main)',\n}\n\ntype GitHubPickerProps = Omit<React.ComponentProps<typeof Picker>,\"localStates\" | \"anchorEl\" | \"setAnchorEl\"> & {\n  multiple?: boolean;\n  /** `field` is the full selector. `icon` is a compact IconButton with a badge. */\n  variant?: GitHubPickerVariant;\n}\n/**\n * Field + catalog autocomplete. Searchable grouped options with\n * chip-based selected values. Pass `variant=\"icon\"` for a compact trigger.\n *\n * [Doc](https://mui.com/material-ui/api/autocomplete/)\n *\n * @param selectedIdProps - is always an array of ids\n * @param options.filterKey - is for searching\n */\nexport default function GitHubPicker({\n\tmultiple=true,\n\t...p\n}:GitHubPickerProps){\n\tconst _selectedIdProps = p.selectedIdProps[0]\n\tconst [anchorEl, setAnchorEl] = useState<HTMLElement|null>(null)\n\n\treturn (<LocalSelectedProvider selectedIds={_selectedIdProps} options={p.options} isMultiple={multiple} open={Boolean(anchorEl)}>\n\t\t<Picker {...p} multiple={multiple} anchorEl={anchorEl} setAnchorEl={setAnchorEl}/>\n\t</LocalSelectedProvider>)\n}\n\nfunction Picker(p:{\n\tselectedIdProps: [OptionIds, React.Dispatch<React.SetStateAction<OptionIds>>];\n\toptions: OptionClass[];\n\tadditionSort?: Parameters<typeof getMinimalOptions>[1]; // sort function for groups\n\n\tonChange: (ids: OptionIds) => void;\n\tonDelete: (id: OptionId) => void;\n\terror?: boolean;\n\ttitle?: string;\n\tsubtitle?: string;\n\ttitleIcon?: React.ReactNode;\n\n\tmultiple?: boolean; // allow multiple selection\n\tdisabled?: boolean;\n\n\tuseGroup?: boolean; // group the options\n\tisAddOptionEnabled?: boolean; // allow adding new option\n\taddOptionHandler?:PopperMenuProps[\"addOptionHandler\"]; // handler for adding new option\n\n\tisPopperFreezed?:PopperMenuProps[\"isPopperFreezed\"]; // disable the popper\n\tvariant?: GitHubPickerVariant;\n\t/** Icon, badge, and field accent. `error` still wins when true. */\n\tcolor?: GitHubPickerColor;\n\tanchorEl: HTMLElement | null;\n\tsetAnchorEl: React.Dispatch<React.SetStateAction<HTMLElement | null>>;\n}){\n  const {\n    selectedIdProps,\n    options=[], // options for rendering and autocomplete\n    additionSort,\n\n    title, subtitle,\n    titleIcon,\n    onChange, onDelete,\n    error=false,\n    multiple, // default value set in Parent\n    disabled=false,\n    useGroup=true,\n    isAddOptionEnabled=false,\n    addOptionHandler,\n\n    isPopperFreezed,\n    variant = 'field',\n    color = 'secondary',\n    anchorEl,\n    setAnchorEl,\n  } = p\n\tconst tone: GitHubPickerColor = error ? 'error' : color\n\tconst accent = PICKER_ACCENT[tone]\n\tconst pickerId = useId()\n\tconst menuId = `${pickerId}-menu`\n\tconst listboxId = `${pickerId}-listbox`\n\n\tconst [selectedIds, sIds] = selectedIdProps // [{id,label,filterKey,disabled,group},...]\n\t// option pass to autocomplete, seperate icon\n\tconst allMinimalOptions = useMemo(() => getMinimalOptions(options,additionSort),[options,additionSort])\n\tconst selectedOpt = allMinimalOptions.filter(itm=>selectedIds.includes(itm.id))\n\tconst { state, select } = useLocalSelectedContext()\n\tconst open = Boolean(anchorEl)\n\n\t// handle popper close\n\tconst closeHandler:PopperMenuProps[\"closeHandler\"] = (passedState?) => {\n\t\t// `minimal: null` is a real clear. `??` would fall back to the previous selection.\n\t\tconst newValue = passedState === undefined ? state.minimal : passedState.minimal\n\t\tconst nextIds = idsFromSelection(Boolean(multiple), newValue)\n\t\tsIds(nextIds)\n\t\tonChange(nextIds)\n\n\t\tif(anchorEl){ anchorEl.focus() }\n\t\tsetAnchorEl(null)\n\t}\n\n\tconst removeItemHandler:React.ComponentProps<typeof DisplaySelected>[\"removeItemHandler\"]  = id => () => {\n\t\tonDelete(id)\n\t\tsIds(old=>old.filter(itm => itm !== id))\n\t\t// Keep LocalSelected in sync while open — closeHandler commits state.minimal,\n\t\t// so skipping this would restore the removed chip after the menu closes.\n\t\tif (multiple) {\n\t\t\tconst current = Array.isArray(state.minimal) ? state.minimal : []\n\t\t\tselect(current.filter((opt) => opt.id !== id))\n\t\t} else if (!Array.isArray(state.minimal) && state.minimal?.id === id) {\n\t\t\tselect(null)\n\t\t} else if (Array.isArray(state.minimal)) {\n\t\t\tselect(state.minimal.filter((opt) => opt.id !== id))\n\t\t}\n\t}\n\n\tconst togglePicker = (element: HTMLElement) => {\n\t\tif (disabled) return\n\t\tif (open) {\n\t\t\tif (isPopperFreezed) return\n\t\t\tcloseHandler()\n\t\t\treturn\n\t\t}\n\t\tsetAnchorEl(element)\n\t}\n\n\treturn (\n\t\t<ClickAwayListener\n\t\t\tonClickAway={() => {\n\t\t\t\tif (!open || isPopperFreezed) return\n\t\t\t\tcloseHandler()\n\t\t\t}}\n\t\t>\n\t\t\t<Box>\n\t\t\t{variant === 'icon' ? (\n\t\t\t\t<IconTrigger\n\t\t\t\t\tid={pickerId}\n\t\t\t\t\tmenuId={menuId}\n\t\t\t\t\topen={open}\n\t\t\t\t\tcolor={tone}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\ttitle={title}\n\t\t\t\t\ttitleIcon={titleIcon}\n\t\t\t\t\tselectedCount={selectedOpt.length}\n\t\t\t\t\tselectedLabels={selectedOpt.map((opt) => opt.label)}\n\t\t\t\t\tonToggle={togglePicker}\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<FieldTrigger\n\t\t\t\t\tid={pickerId}\n\t\t\t\t\tmenuId={menuId}\n\t\t\t\t\topen={open}\n\t\t\t\t\terror={error}\n\t\t\t\t\taccent={accent}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\ttitle={title}\n\t\t\t\t\ttitleIcon={titleIcon}\n\t\t\t\t\tselectedOpt={selectedOpt}\n\t\t\t\t\toptions={options}\n\t\t\t\t\tremoveItemHandler={removeItemHandler}\n\t\t\t\t\tmultiple={Boolean(multiple)}\n\t\t\t\t\tonToggle={togglePicker}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t{anchorEl ? (\n\t\t\t\t<Suspense fallback={null}>\n\t\t\t\t\t<PopperMenu\n\t\t\t\t\t\tid={menuId}\n\t\t\t\t\t\tlistboxId={listboxId}\n\t\t\t\t\t\tanchorEl={anchorEl}\n\t\t\t\t\t\tallMinimalOptions={allMinimalOptions}\n\t\t\t\t\t\toptions={options}\n\t\t\t\t\t\tcloseHandler={closeHandler}\n\t\t\t\t\t\tmultiple={multiple}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\ttitle={subtitle ?? title}\n\t\t\t\t\t\tuseGroup={useGroup}\n\t\t\t\t\t\tisAddOptionEnabled={isAddOptionEnabled}\n\t\t\t\t\t\taddOptionHandler={addOptionHandler}\n\t\t\t\t\t\tisPopperFreezed={isPopperFreezed}\n\t\t\t\t\t/>\n\t\t\t\t</Suspense>\n\t\t\t) : null}\n\t\t\t</Box>\n\t\t</ClickAwayListener>\n\t)\n}\n\n/**\n * function to return minimal options\n * excluding the component and functions from the options\n * i.e. icon, minimal(),\n * \n * sort by disabled (higher priority)\n * sort by group, then filterKey\n */\nfunction idsFromSelection(\n\tmultiple: boolean,\n\tnewValue: MinimalOption[] | MinimalOption | null | undefined,\n): OptionIds {\n\tif (multiple) {\n\t\tconst list = Array.isArray(newValue) ? newValue : []\n\t\treturn sortByKey(list, 'filterKey').map((item) => item.id)\n\t}\n\tconst single = Array.isArray(newValue) ? newValue[0] : newValue\n\treturn single?.id ? [single.id] : []\n}\n\nfunction getMinimalOptions(options:OptionClass[],additionSort?:(a: MinimalOption|null, b: MinimalOption|null) => number):ReturnType<OptionClass[\"minimal\"]>[] {\n\tconst minimal = options.map(itm => itm.minimal())\n\tconst sortedByFilterKey = sortByKey(minimal,\"filterKey\")\n\tconst afterAdditionSort = additionSort ? sortedByFilterKey.sort(additionSort) : sortedByFilterKey\n\tconst sortedByGroup = sortByKey(afterAdditionSort, \"group\")\n\tconst sortedByDisabled = sortByKey(sortedByGroup,\"disabled\",)\n\treturn sortedByDisabled\n}\n\nfunction FieldTrigger(p:{\n\tid: string;\n\tmenuId: string;\n\topen: boolean;\n\terror: boolean;\n\taccent: string;\n\tdisabled: boolean;\n\ttitle?: string;\n\ttitleIcon?: React.ReactNode;\n\tselectedOpt: MinimalOption[];\n\toptions: OptionClass[];\n\tremoveItemHandler: (id: OptionId) => () => void;\n\tmultiple: boolean;\n\tonToggle: (element: HTMLElement) => void;\n}) {\n\tconst { id, menuId, open, error, accent, disabled, title, titleIcon, selectedOpt, options, removeItemHandler, multiple, onToggle } = p\n\n\treturn (\n\t\t<PickerField\n\t\t\tid={id}\n\t\t\topen={open}\n\t\t\terror={error}\n\t\t\tdisabled={disabled}\n\t\t\trole=\"combobox\"\n\t\t\ttabIndex={disabled ? -1 : 0}\n\t\t\taria-expanded={open}\n\t\t\taria-haspopup=\"listbox\"\n\t\t\taria-controls={open ? menuId : undefined}\n\t\t\taria-disabled={disabled}\n\t\t\tstyle={{\n\t\t\t\t'--picker-border-emphasis': accent,\n\t\t\t\t'--picker-check': accent,\n\t\t\t\t'--picker-focus-ring': `color-mix(in lab, ${accent}, transparent 82%)`,\n\t\t\t} as React.CSSProperties}\n\t\t\tonClick={(event) => onToggle(event.currentTarget)}\n\t\t\tonKeyDown={(event) => {\n\t\t\t\tif (event.key === 'Enter' || event.key === ' ') {\n\t\t\t\t\tevent.preventDefault()\n\t\t\t\t\tonToggle(event.currentTarget)\n\t\t\t\t}\n\t\t\t}}\n\t\t>\n\t\t\t<Box\n\t\t\t\tsx={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\talignItems: 'center',\n\t\t\t\t\tgap: 1,\n\t\t\t\t\tminHeight: 20,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{titleIcon ? (\n\t\t\t\t\t<Box\n\t\t\t\t\t\tsx={{\n\t\t\t\t\t\t\tdisplay: 'inline-flex',\n\t\t\t\t\t\t\tcolor: 'var(--picker-check)',\n\t\t\t\t\t\t\t'& svg': { fontSize: '1.05rem' },\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{titleIcon}\n\t\t\t\t\t</Box>\n\t\t\t\t) : null}\n\t\t\t\t{title ? (\n\t\t\t\t\t<Typography\n\t\t\t\t\t\tcomponent=\"span\"\n\t\t\t\t\t\tsx={{\n\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\tminWidth: 0,\n\t\t\t\t\t\t\tfontSize: '0.68rem',\n\t\t\t\t\t\t\tfontWeight: 700,\n\t\t\t\t\t\t\tletterSpacing: '0.08em',\n\t\t\t\t\t\t\ttextTransform: 'uppercase',\n\t\t\t\t\t\t\tcolor: 'var(--picker-text-secondary)',\n\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\ttextOverflow: 'ellipsis',\n\t\t\t\t\t\t\twhiteSpace: 'nowrap',\n\t\t\t\t\t\t\tm: 0,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{title}\n\t\t\t\t\t</Typography>\n\t\t\t\t) : (\n\t\t\t\t\t<Box sx={{ flex: 1 }} />\n\t\t\t\t)}\n\t\t\t\t<KeyboardArrowDownIcon\n\t\t\t\t\tsx={{\n\t\t\t\t\t\tfontSize: 20,\n\t\t\t\t\t\tcolor: 'var(--picker-text-secondary)',\n\t\t\t\t\t\tflexShrink: 0,\n\t\t\t\t\t\ttransform: open ? 'rotate(180deg)' : 'rotate(0deg)',\n\t\t\t\t\t\ttransition: 'transform 180ms ease',\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</Box>\n\n\t\t\t<DisplaySelected\n\t\t\t\tselectedOpt={selectedOpt}\n\t\t\t\toptions={options}\n\t\t\t\tremoveItemHandler={removeItemHandler}\n\t\t\t\tdisabled={disabled}\n\t\t\t\tmultiple={multiple}\n\t\t\t/>\n\t\t</PickerField>\n\t)\n}\n\nfunction IconTrigger(p:{\n\tid: string;\n\tmenuId: string;\n\topen: boolean;\n\tcolor: GitHubPickerColor;\n\tdisabled: boolean;\n\ttitle?: string;\n\ttitleIcon?: React.ReactNode;\n\tselectedCount: number;\n\tselectedLabels: string[];\n\tonToggle: (element: HTMLElement) => void;\n}) {\n\tconst { id, menuId, open, color, disabled, title, titleIcon, selectedCount, selectedLabels, onToggle } = p\n\tconst tooltip = selectedLabels.length > 0\n\t\t? selectedLabels.join(', ')\n\t\t: (title ?? 'Select')\n\n\treturn (\n\t\t<Badge\n\t\t\tbadgeContent={selectedCount}\n\t\t\tinvisible={selectedCount === 0}\n\t\t\tcolor={color}\n\t\t\tstyle_variant=\"filled\"\n\t\t\toverlap=\"circular\"\n\t\t\tsx={gitHubPickerRootSx}\n\t\t\tmax={99}\n\t\t>\n\t\t\t<Box sx={{ display: 'inline-flex' }}>\n\t\t\t\t<IconButton\n\t\t\t\t\tid={id}\n\t\t\t\t\ttitle={open ? '' : tooltip}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tselected={open}\n\t\t\t\t\tcolor={color}\n\t\t\t\t\taria-label={title ?? 'Select'}\n\t\t\t\t\taria-expanded={open}\n\t\t\t\t\taria-haspopup=\"listbox\"\n\t\t\t\t\taria-controls={open ? menuId : undefined}\n\t\t\t\t\tonClick={(event) => onToggle(event.currentTarget)}\n\t\t\t\t>\n\t\t\t\t\t{titleIcon ?? <FilterIcon />}\n\t\t\t\t</IconButton>\n\t\t\t</Box>\n\t\t</Badge>\n\t)\n}\n\nfunction DisplaySelected(p:{\n\tselectedOpt:MinimalOption[];\n\toptions:OptionClass[];\n\tremoveItemHandler:(id:OptionId)=>()=>void;\n\tdisabled:boolean;\n\tmultiple:boolean;\n}){\n  const {selectedOpt,options,removeItemHandler,disabled,multiple} = p\n\tconst selectedIds = selectedOpt.map(itm=>itm.id)\n\tconst displaySelectedOptions = options.filter(itm => selectedIds.includes(itm.id))\n\n\tif (displaySelectedOptions.length === 0) {\n\t\treturn (\n\t\t\t<Typography\n\t\t\t\tsx={{\n\t\t\t\t\tfontSize: '0.9rem',\n\t\t\t\t\tfontWeight: 500,\n\t\t\t\t\tcolor: 'var(--picker-text-secondary)',\n\t\t\t\t\topacity: 0.78,\n\t\t\t\t\tlineHeight: 1.4,\n\t\t\t\t\tm: 0,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{multiple ? 'Select options' : 'Select an option'}\n\t\t\t</Typography>\n\t\t)\n\t}\n\n\treturn (\n\t\t<Box sx={{\n\t\t\toverflow:\"hidden\",\n\t\t\tdisplay:\"flex\",flexWrap:\"wrap\",\n\t\t\tgap:\"6px\",\n\t\t}}>\n\t\t\t{displaySelectedOptions.map((o) => {\n\t\t\t\treturn (\n\t\t\t\t\t<Box key={o.id} sx={{\n\t\t\t\t\t\toverflow:\"hidden\",\n\t\t\t\t\t\tmaxWidth:\"100%\",\n\t\t\t\t\t}}>\n\t\t\t\t\t\t<OptionRenderer\n\t\t\t\t\t\t\toption={o}\n\t\t\t\t\t\t\tselected={true}\n\t\t\t\t\t\t\tisIconClickable={true}\n\t\t\t\t\t\t\tremoveItemHandler={removeItemHandler(o?.id)}\n\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\tslotProps={{\n\t\t\t\t\t\t\t\tDM:{\n\t\t\t\t\t\t\t\t\tisShowDescription:false,\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</Box>\n\t\t\t\t)\n\t\t\t})}\n\t\t</Box>\n\t)\n}\n","export function hasIntersect<T>(a:T[], b:T[]) {\n  return a.some((x) => b.includes(x))\n}\n/**\n * a function to get the intersection of two arrays\n */\nexport function getIntersect<T>(a:T[], b:T[]) {\n  return a.filter((x) => b.includes(x))\n}\n/**\n * Check if two arrays are the same\n * even if they are in different order\n */\nexport function isSameArray<T>(a:T[], b:T[]) {\n  return a.length === b.length && a.every((x) => b.includes(x))\n}\n/**\n * sort array with certain condition\n */\nexport function sortByCondi<\n  T,\n  K extends keyof T,\n>(array:T[], key:K, condition:(a:T[K],b:T[K])=>boolean,reverse=false) {\n  const anchor = reverse ? -1 : 1\n  const sorted = [...array]\n  sorted.sort((a, b) => {\n      if (condition(a[key], b[key])) {\n          return -anchor\n      } else {\n          return anchor\n      }\n  })\n  return sorted\n}\n/**\n * sort array by key\n */\nexport function sortByKey<\n  T, \n  K extends keyof T,\n>(array: T[], key: K, reverse = false) {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const condi = (a: any, b: any) => { return a < b }\n\n  const sorted = sortByCondi(array, key, condi, reverse)\n  return sorted\n}\n/**\n * sort by key with a certain order\n */\nexport function sortByArr<\n  T, \n  K extends keyof T,\n>(array: T[], key: K, order: unknown[], reverse = false) {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const condi = (a: any, b: any) => {\n    return order.indexOf(a) < order.indexOf(b)\n  }\n\n  const sorted = sortByCondi(array, key, condi, reverse)\n  return sorted\n}"],"mappings":"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","names":["default"]}

package/dist/chunk-SRWPHN2N.mjs

@@ -0,0 +1,188 @@
+import {
+  IconButton_default
+} from "./chunk-JIU5GVM7.mjs";
+
+// src/components/elemental/Timeline/MuiTimeline/MuiTimeline.tsx
+import Timeline from "@mui/lab/Timeline";
+import TimelineItem from "@mui/lab/TimelineItem";
+import TimelineSeparator from "@mui/lab/TimelineSeparator";
+import TimelineConnector from "@mui/lab/TimelineConnector";
+import TimelineContent from "@mui/lab/TimelineContent";
+import TimelineOppositeContent from "@mui/lab/TimelineOppositeContent";
+import TimelineDot from "@mui/lab/TimelineDot";
+import { styled } from "@mui/material/styles";
+
+// src/components/elemental/Timeline/MuiTimeline/theme.ts
+var muiTimelineRootSx = {
+  "--content-text": "var(--mui-palette-text-subscript)",
+  "--connector-border-color": "var(--mui-palette-focus-1)",
+  "--connector-focus-color": "var(--mui-palette-focus-1)",
+  "--connector-non-focus-color": "var(--mui-palette-background-grey-1)"
+};
+
+// src/components/elemental/Timeline/MuiTimeline/MuiTimeline.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var nodeSpacing = "2px";
+var MuiTLContainer = Timeline;
+function MuiTLItem({
+  content,
+  icon,
+  title,
+  oppsiteContent,
+  iconOnClick,
+  isAnimated = false,
+  isCompleted = false,
+  isIconDisabled = false,
+  sx,
+  ...rest
+}) {
+  return /* @__PURE__ */ jsxs(StyledTLI, { isIconDisabled, ...rest, sx, children: [
+    oppsiteContent && /* @__PURE__ */ jsx(
+      TimelineOppositeContent,
+      {
+        sx: {
+          marginTop: nodeSpacing,
+          color: "var(--content-text)",
+          paddingTop: "2px"
+        },
+        children: oppsiteContent
+      }
+    ),
+    /* @__PURE__ */ jsxs(TimelineSeparator, { children: [
+      /* @__PURE__ */ jsx(TimelineDot, { sx: {
+        "&.MuiTimelineDot-root": {
+          padding: 0,
+          background: "transparent",
+          border: "unset",
+          height: "25px",
+          width: "25px",
+          overflow: "hidden",
+          borderRadius: "50%",
+          margin: `${nodeSpacing} 0`,
+          "&>span": {
+            width: "100%",
+            height: "100%"
+          }
+        },
+        "& .MuiButtonBase-root": {
+          height: "100%",
+          width: "100%",
+          borderRadius: "50%",
+          "& svg": {
+            fontSize: "1em"
+          }
+        }
+      }, children: /* @__PURE__ */ jsx(IconButton_default, { onClick: iconOnClick, disabled: isIconDisabled, sx: { padding: 0 }, children: icon }) }),
+      /* @__PURE__ */ jsx(StyledTLConnector, { isAnimated, isCompleted })
+    ] }),
+    /* @__PURE__ */ jsxs(TimelineContent, { sx: {
+      color: "var(--content-text)",
+      marginTop: `${nodeSpacing}`,
+      "&.MuiTimelineContent-root": {
+        padding: "12px 16px",
+        paddingTop: "2px"
+      }
+    }, children: [
+      title,
+      content
+    ] })
+  ] });
+}
+var StyledTLI = styled(TimelineItem, {
+  shouldForwardProp: (prop) => prop !== "isIconDisabled"
+})(() => ({
+  ...muiTimelineRootSx,
+  "& .MuiTimelineDot-root": {
+    boxShadow: "none",
+    borderRadius: "50%"
+  },
+  // hover effect 
+  "&.MuiTimelineItem-root:hover .MuiTimelineSeparator-root": {
+    // change separator color
+    "& .MuiTimelineConnector-root": {},
+    // change dot color
+    "& .MuiTimelineDot-root": {
+      boxShadow: "var(--shadow)",
+      borderRadius: "50%"
+    }
+  },
+  variants: [
+    {
+      props: (p) => p.isIconDisabled,
+      style: {
+        // orginal shadow
+        "--shadow": "none"
+      }
+    },
+    {
+      props: (p) => !p.isIconDisabled,
+      style: {
+        "--shadow": "var(--shadow-outset-1)"
+      }
+    }
+  ]
+}));
+var StyledTLConnector = styled(TimelineConnector, {
+  shouldForwardProp: (prop) => prop !== "isAnimated" && prop !== "isCompleted"
+})(() => ({
+  backgroundColor: "var(--bg)",
+  position: "relative",
+  overflow: "hidden",
+  "&::before": {
+    content: '""',
+    position: "absolute",
+    top: "-100%",
+    left: 0,
+    width: "0%",
+    height: "200%",
+    borderRight: "2px dashed var(--border-color)",
+    animation: "var(--animated-connector)"
+  },
+  "@keyframes dash": {
+    "to": { transform: "translateY(50%)" }
+  },
+  variants: [
+    // animation + isCompleted
+    {
+      props: (p) => p.isAnimated && p.isCompleted,
+      style: {
+        "--animated-connector": "dash 10s linear infinite",
+        "--bg": "transparent",
+        "--border-color": "var(--connector-border-color)"
+      }
+    },
+    // no animation + isCompleted
+    {
+      props: (p) => !p.isAnimated && p.isCompleted,
+      style: {
+        "--animated-connector": "none",
+        "--bg": "var(--connector-focus-color)",
+        "--border-color": "transparent"
+      }
+    },
+    // animation + not isCompleted
+    {
+      props: (p) => p.isAnimated && !p.isCompleted,
+      style: {
+        "--animated-connector": "dash 1s linear infinite",
+        "--bg": "transparent",
+        "--border-color": "var(--connector-border-color)"
+      }
+    },
+    // no animation + not isCompleted
+    {
+      props: (p) => !p.isAnimated && !p.isCompleted,
+      style: {
+        "--animated-connector": "none",
+        "--bg": "var(--connector-non-focus-color)",
+        "--border-color": "transparent"
+      }
+    }
+  ]
+}));
+
+export {
+  MuiTLContainer,
+  MuiTLItem
+};
+//# sourceMappingURL=chunk-SRWPHN2N.mjs.map

package/dist/chunk-SRWPHN2N.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/elemental/Timeline/MuiTimeline/MuiTimeline.tsx","../src/components/elemental/Timeline/MuiTimeline/theme.ts"],"sourcesContent":["'use client'\nimport Timeline from '@mui/lab/Timeline'\nimport TimelineItem from '@mui/lab/TimelineItem'\nimport TimelineSeparator from '@mui/lab/TimelineSeparator'\nimport TimelineConnector from '@mui/lab/TimelineConnector'\nimport TimelineContent from '@mui/lab/TimelineContent'\nimport TimelineOppositeContent from '@mui/lab/TimelineOppositeContent'\nimport TimelineDot from '@mui/lab/TimelineDot'\nimport { styled } from '@mui/material/styles'\nimport type { SxProps, Theme } from '@mui/material/styles'\nimport { IconButton } from '@/ele/Button'\nimport { muiTimelineRootSx } from './theme'\n\nconst nodeSpacing = \"2px\" as const;\n\n/**\n * Mui Timeline\n * \n * [Doc] (https://mui.com/material-ui/api/timeline/)\n */\nexport const MuiTLContainer = Timeline\n\n/**\n * Mui Timeline Item\n * \n * [Doc] (https://mui.com/material-ui/api/timeline-item/)\n */\nexport function MuiTLItem({\n  content,\n  icon, title, oppsiteContent,\n  iconOnClick,\n  isAnimated=false,\n  isCompleted=false,\n  isIconDisabled=false,\n  sx,\n  ...rest\n}: {\n  oppsiteContent?:React.ReactNode,\n  icon?: React.ReactNode,\n  title?:React.ReactNode,\n  content?:React.ReactNode,\n  iconOnClick?:()=>void,\n  isAnimated?:boolean,\n  isCompleted?:boolean,\n  isIconDisabled?:boolean,\n  sx?: SxProps<Theme>;\n} & Omit<React.ComponentProps<typeof TimelineItem>, \"content\" | \"sx\" | \"title\">) {\n\n  return (\n    <StyledTLI isIconDisabled={isIconDisabled} {...rest} sx={sx}>\n      {oppsiteContent && <TimelineOppositeContent\n        sx={{ \n          marginTop: nodeSpacing,\n          color:\"var(--content-text)\",\n          paddingTop:\"2px\",\n        }}\n        >\n        {oppsiteContent}\n      </TimelineOppositeContent>}\n      <TimelineSeparator>\n        <TimelineDot sx={{\n          \"&.MuiTimelineDot-root\":{\n            padding:0,\n            background:\"transparent\",\n            border:\"unset\",\n            height:\"25px\",\n            width:\"25px\",\n            overflow:\"hidden\",\n            borderRadius:\"50%\",\n            margin:`${nodeSpacing} 0`,\n            \"&>span\":{\n              width:\"100%\",\n              height:\"100%\",\n            },\n          },\n          \"& .MuiButtonBase-root\":{\n            height:\"100%\",\n            width:\"100%\",\n            borderRadius:\"50%\",\n            \"& svg\":{\n              fontSize:\"1em\",\n            }\n          },\n        }}>\n        <IconButton onClick={iconOnClick} disabled={isIconDisabled} sx={{padding: 0}}>\n          {icon}\n        </IconButton>\n        </TimelineDot>\n\n        <StyledTLConnector isAnimated={isAnimated} isCompleted={isCompleted}/>\n\n      </TimelineSeparator>  \n      <TimelineContent sx={{ \n        color:\"var(--content-text)\",\n        marginTop: `${nodeSpacing}`,\n        \"&.MuiTimelineContent-root\":{\n          padding: '12px 16px',\n          paddingTop:\"2px\",\n        },\n      }}>\n        {title}\n        {content}\n      </TimelineContent>\n    </StyledTLI>\n  )\n}\n\nconst StyledTLI = styled(TimelineItem,{\n  shouldForwardProp: (prop:string) => (\n    prop !== 'isIconDisabled'\n  )\n})<{isIconDisabled:boolean;}>(() => ({\n  ...muiTimelineRootSx as object,\n\n  \"& .MuiTimelineDot-root\":{\n    boxShadow: \"none\",\n    borderRadius: \"50%\",\n  },\n  // hover effect \n  \"&.MuiTimelineItem-root:hover .MuiTimelineSeparator-root\":{\n    // change separator color\n    \"& .MuiTimelineConnector-root\":{\n    },\n    // change dot color\n    \"& .MuiTimelineDot-root\":{\n      boxShadow: \"var(--shadow)\",\n      borderRadius: \"50%\",\n    },\n  },\n  variants:[\n    {\n      props: p=>p.isIconDisabled,\n      style: {\n        // orginal shadow\n        '--shadow': 'none',\n      }\n    },\n    {\n      props: p=>!p.isIconDisabled,\n      style: {\n        '--shadow': 'var(--shadow-outset-1)',\n      }\n    }\n  ]\n}))\nconst StyledTLConnector = styled(TimelineConnector,{\n  shouldForwardProp: (prop:string) => (\n    prop !== 'isAnimated'\n    && prop !== 'isCompleted'\n  ),\n})<{isAnimated:boolean;isCompleted:boolean;}>(() => ({\n  backgroundColor:\"var(--bg)\",\n  position: \"relative\",\n  overflow: \"hidden\",\n  \"&::before\": {\n    content: '\"\"',\n    position: \"absolute\",\n    top: \"-100%\",\n    left: 0,\n    width: \"0%\",\n    height: \"200%\",\n    borderRight: \"2px dashed var(--border-color)\",\n    animation: \"var(--animated-connector)\",\n  },\n  \"@keyframes dash\": {\n    \"to\": { transform: \"translateY(50%)\"},\n  },\n  variants:[\n    // animation + isCompleted\n    {\n      props: p=>p.isAnimated && p.isCompleted,\n      style: {\n        \"--animated-connector\": \"dash 10s linear infinite\",\n        \"--bg\": \"transparent\",\n        \"--border-color\": \"var(--connector-border-color)\",\n      }\n    },\n    // no animation + isCompleted\n    {\n      props: p=>!p.isAnimated && p.isCompleted,\n      style: {\n        \"--animated-connector\": \"none\",\n        \"--bg\": \"var(--connector-focus-color)\",\n        \"--border-color\": \"transparent\",\n      }\n    },\n    // animation + not isCompleted\n    {\n      props: p=>p.isAnimated && !p.isCompleted,\n      style: {\n        \"--animated-connector\": \"dash 1s linear infinite\",\n        \"--bg\": \"transparent\",\n        \"--border-color\": \"var(--connector-border-color)\",\n      }\n    },\n    // no animation + not isCompleted\n    {\n      props: p=>!p.isAnimated && !p.isCompleted,\n      style: {\n        \"--animated-connector\": \"none\",\n        \"--bg\": \"var(--connector-non-focus-color)\",\n        \"--border-color\": \"transparent\",\n      }\n    },\n  ]\n}))\n","import type { SxProps, Theme } from '@mui/material/styles'\n\nexport const muiTimelineRootSx: SxProps<Theme> = {\n  '--content-text': 'var(--mui-palette-text-subscript)',\n  '--connector-border-color': 'var(--mui-palette-focus-1)',\n  '--connector-focus-color': 'var(--mui-palette-focus-1)',\n  '--connector-non-focus-color': 'var(--mui-palette-background-grey-1)',\n} as const satisfies SxProps<Theme>\n"],"mappings":"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","names":[]}

package/dist/chunk-T34IULP5.mjs

@@ -0,0 +1,242 @@
+import {
+  MuiFormControlLabel,
+  default as default2,
+  default2 as default3
+} from "./chunk-T4X375IG.mjs";
+
+// src/components/elemental/Switch/src/Switch/MuiSwitch.tsx
+import Switch from "@mui/material/Switch";
+
+// src/components/elemental/Switch/src/Switch/themes.ts
+var switchTheme = {
+  defaultProps: {
+    disableFocusRipple: true,
+    disableRipple: true,
+    disableTouchRipple: true
+  },
+  styleOverrides: {
+    root: {
+      "--switch-thumb": "color-mix(in lab, var(--mui-palette-background-default) 72%, var(--mui-palette-text-primary) 28%)",
+      "--switch-thumb-on": "var(--mui-palette-background-default)",
+      "--switch-track-off": "var(--mui-palette-background-grey-1)",
+      "--switch-track-on": "var(--mui-palette-primary-emphasis)",
+      "--switch-track-on-disabled": "color-mix(in lab, var(--switch-track-on) 28%, var(--mui-palette-background-default))",
+      overflow: "visible",
+      width: 40,
+      height: 22,
+      padding: 0,
+      "&:has(.MuiSwitch-colorError)": {
+        "--switch-track-on": "var(--mui-palette-error-main)"
+      },
+      "&:has(.MuiSwitch-colorSuccess)": {
+        "--switch-track-on": "var(--mui-palette-success-main)"
+      },
+      "&:has(.MuiSwitch-colorWarning)": {
+        "--switch-track-on": "var(--mui-palette-warning-main)"
+      },
+      "&:has(.MuiSwitch-colorInfo)": {
+        "--switch-track-on": "var(--mui-palette-info-main)"
+      },
+      "&:has(.MuiSwitch-colorSystem)": {
+        "--switch-track-on": "var(--mui-palette-system-main)"
+      },
+      "&:has(.MuiSwitch-colorInsight)": {
+        "--switch-track-on": "var(--mui-palette-insight-main)"
+      },
+      "&:has(.MuiSwitch-colorSecondary)": {
+        "--switch-track-on": "var(--mui-palette-secondary-main)"
+      },
+      "& .MuiSwitch-switchBase": {
+        boxSizing: "border-box",
+        top: 0,
+        left: 0,
+        padding: 2,
+        width: 22,
+        height: 22,
+        color: "var(--switch-thumb)",
+        transition: "transform 160ms ease",
+        "&:hover": {
+          backgroundColor: "transparent"
+        },
+        "&.Mui-checked": {
+          transform: "translateX(18px)",
+          color: "var(--switch-thumb-on)",
+          "& .MuiSwitch-thumb": {
+            backgroundColor: "var(--switch-thumb-on)"
+          }
+        },
+        "&.Mui-checked + .MuiSwitch-track": {
+          backgroundColor: "var(--switch-track-on)",
+          opacity: 1
+        },
+        "&.Mui-checked.Mui-disabled + .MuiSwitch-track": {
+          backgroundColor: "var(--switch-track-on-disabled)"
+        },
+        "&.Mui-focusVisible": {
+          outline: "2px solid var(--mui-palette-focus-1)",
+          outlineOffset: 2
+        }
+      },
+      "& .MuiSwitch-thumb": {
+        width: 18,
+        height: 18,
+        boxShadow: "none",
+        backgroundColor: "var(--switch-thumb)"
+      },
+      "& .MuiSwitch-track": {
+        width: "100%",
+        height: "100%",
+        borderRadius: 11,
+        opacity: 1,
+        backgroundColor: "var(--switch-track-off)",
+        transition: "background-color 160ms ease",
+        "&::before, &::after": {
+          display: "none",
+          content: "none",
+          backgroundImage: "none"
+        }
+      },
+      "&.MuiSwitch-sizeSmall": {
+        width: 32,
+        height: 18,
+        "& .MuiSwitch-switchBase": {
+          padding: 2,
+          width: 18,
+          height: 18,
+          "&.Mui-checked": {
+            transform: "translateX(14px)"
+          }
+        },
+        "& .MuiSwitch-thumb": {
+          width: 14,
+          height: 14
+        },
+        "& .MuiSwitch-track": {
+          borderRadius: 9
+        }
+      }
+    }
+  }
+};
+var muiSwitchRootSx = {
+  "--switch-label-color": "var(--mui-palette-text-grey-1)",
+  "--switch-error-track-bg": "var(--mui-palette-error-main)",
+  alignItems: "flex-start",
+  "& .MuiFormControlLabel-root": {
+    gap: "8px",
+    margin: 0,
+    alignItems: "center",
+    overflow: "visible",
+    maxWidth: "none"
+  },
+  "& .MuiFormControlLabel-root.MuiFormControlLabel-labelPlacementStart, & .MuiFormControlLabel-root.MuiFormControlLabel-labelPlacementEnd, & .MuiFormControlLabel-root.MuiFormControlLabel-labelPlacementTop, & .MuiFormControlLabel-root.MuiFormControlLabel-labelPlacementBottom": {
+    margin: 0
+  },
+  "& .MuiFormControlLabel-label": {
+    fontSize: "12px",
+    userSelect: "none",
+    color: "var(--switch-label-color)",
+    overflow: "visible",
+    textOverflow: "clip",
+    flexShrink: 0
+  },
+  "&.Mui-error .MuiSwitch-track": {
+    backgroundColor: "var(--switch-error-track-bg)"
+  }
+};
+var switchSoftRootSx = {
+  ...muiSwitchRootSx,
+  "--switch-label-color": "var(--mui-palette-text-primary)"
+};
+
+// src/components/elemental/Switch/src/Switch/MuiSwitch.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+function MuiSwitch({
+  onChange,
+  checked,
+  label,
+  error = false,
+  required = false,
+  labelPlacement = "start",
+  helperText,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(default2, { error, sx: muiSwitchRootSx, children: [
+    /* @__PURE__ */ jsx(
+      MuiFormControlLabel,
+      {
+        labelPlacement,
+        required,
+        label,
+        control: /* @__PURE__ */ jsx(
+          Switch,
+          {
+            disableRipple: true,
+            ...{ onChange, checked },
+            ...props
+          }
+        )
+      }
+    ),
+    helperText && /* @__PURE__ */ jsx(default3, { children: helperText })
+  ] });
+}
+
+// src/components/elemental/Switch/src/Switch/SwitchSoft.tsx
+import Switch2 from "@mui/material/Switch";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function SwitchSoft({
+  onChange,
+  checked,
+  label,
+  error = false,
+  required = false,
+  labelPlacement = "end",
+  helperText,
+  size = "medium",
+  sx,
+  ...props
+}) {
+  const control = /* @__PURE__ */ jsx2(
+    Switch2,
+    {
+      ...props,
+      className: ["ui-SwitchSoft", props.className].filter(Boolean).join(" "),
+      disableRipple: true,
+      disableFocusRipple: true,
+      disableTouchRipple: true,
+      size,
+      checked,
+      onChange,
+      sx
+    }
+  );
+  return /* @__PURE__ */ jsxs2(
+    default2,
+    {
+      error,
+      sx: switchSoftRootSx,
+      children: [
+        label != null && label !== "" ? /* @__PURE__ */ jsx2(
+          MuiFormControlLabel,
+          {
+            labelPlacement,
+            required,
+            label,
+            control
+          }
+        ) : control,
+        helperText ? /* @__PURE__ */ jsx2(default3, { children: helperText }) : null
+      ]
+    }
+  );
+}
+
+export {
+  switchTheme,
+  muiSwitchRootSx,
+  switchSoftRootSx,
+  MuiSwitch,
+  SwitchSoft
+};
+//# sourceMappingURL=chunk-T34IULP5.mjs.map

package/dist/chunk-T34IULP5.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/elemental/Switch/src/Switch/MuiSwitch.tsx","../src/components/elemental/Switch/src/Switch/themes.ts","../src/components/elemental/Switch/src/Switch/SwitchSoft.tsx"],"sourcesContent":["import Switch, { type SwitchProps } from '@mui/material/Switch'\nimport { FormControl, FormControlLabel, FormHelperText } from '@/ele/Form'\nimport { muiSwitchRootSx } from './themes'\n\n/**\n * MuiSwitch\n * \n * [Doc](https://mui.com/material-ui/api/switch/)\n */\nexport default function MuiSwitch({\n  onChange, checked, label,\n  error = false, required = false,\n  labelPlacement = \"start\",\n  helperText,\n  ...props\n}: {\n  onChange?: SwitchProps['onChange'],\n  checked?: boolean,\n  label?: React.ReactNode,\n  error?: boolean,\n  required?: boolean,\n  labelPlacement?: 'start' | 'end' | 'top' | 'bottom',\n  helperText?: React.ReactNode,\n} & SwitchProps) {\n\n  return (\n    <FormControl error={error} sx={muiSwitchRootSx as object}>\n      <FormControlLabel\n        labelPlacement={labelPlacement}\n        required={required} label={label}\n        control={<Switch\n          disableRipple\n          {...{ onChange, checked, }}\n          {...props} />\n        }\n      />\n      {helperText && <FormHelperText>{helperText}</FormHelperText>}\n    </FormControl>\n  )\n}","import type { MuiComponentTheme } from '@/_utils/_types'\nimport type { SxProps, Theme } from '@mui/material/styles'\n\n/** MuiSwitch tokens: inset track, stable thumb, emphasis only on the on-track. */\n\nexport const switchTheme = {\n  defaultProps: {\n    disableFocusRipple: true,\n    disableRipple: true,\n    disableTouchRipple: true,\n    \n  },\n  styleOverrides: {\n    root: {\n      '--switch-thumb': 'color-mix(in lab, var(--mui-palette-background-default) 72%, var(--mui-palette-text-primary) 28%)',\n      '--switch-thumb-on': 'var(--mui-palette-background-default)',\n      '--switch-track-off': 'var(--mui-palette-background-grey-1)',\n      '--switch-track-on': 'var(--mui-palette-primary-emphasis)',\n      '--switch-track-on-disabled': 'color-mix(in lab, var(--switch-track-on) 28%, var(--mui-palette-background-default))',\n      overflow: 'visible',\n      width: 40,\n      height: 22,\n      padding: 0,\n      '&:has(.MuiSwitch-colorError)': {\n        '--switch-track-on': 'var(--mui-palette-error-main)',\n      },\n      '&:has(.MuiSwitch-colorSuccess)': {\n        '--switch-track-on': 'var(--mui-palette-success-main)',\n      },\n      '&:has(.MuiSwitch-colorWarning)': {\n        '--switch-track-on': 'var(--mui-palette-warning-main)',\n      },\n      '&:has(.MuiSwitch-colorInfo)': {\n        '--switch-track-on': 'var(--mui-palette-info-main)',\n      },\n      '&:has(.MuiSwitch-colorSystem)': {\n        '--switch-track-on': 'var(--mui-palette-system-main)',\n      },\n      '&:has(.MuiSwitch-colorInsight)': {\n        '--switch-track-on': 'var(--mui-palette-insight-main)',\n      },\n      '&:has(.MuiSwitch-colorSecondary)': {\n        '--switch-track-on': 'var(--mui-palette-secondary-main)',\n      },\n      '& .MuiSwitch-switchBase': {\n        boxSizing: 'border-box',\n        top: 0,\n        left: 0,\n        padding: 2,\n        width: 22,\n        height: 22,\n        color: 'var(--switch-thumb)',\n        transition: 'transform 160ms ease',\n        '&:hover': {\n          backgroundColor: 'transparent',\n        },\n        '&.Mui-checked': {\n          transform: 'translateX(18px)',\n          color: 'var(--switch-thumb-on)',\n          '& .MuiSwitch-thumb': {\n            backgroundColor: 'var(--switch-thumb-on)',\n          },\n        },\n        '&.Mui-checked + .MuiSwitch-track': {\n          backgroundColor: 'var(--switch-track-on)',\n          opacity: 1,\n        },\n        '&.Mui-checked.Mui-disabled + .MuiSwitch-track': {\n          backgroundColor: 'var(--switch-track-on-disabled)',\n        },\n        '&.Mui-focusVisible': {\n          outline: '2px solid var(--mui-palette-focus-1)',\n          outlineOffset: 2,\n        },\n      },\n      '& .MuiSwitch-thumb': {\n        width: 18,\n        height: 18,\n        boxShadow: 'none',\n        backgroundColor: 'var(--switch-thumb)',\n      },\n      '& .MuiSwitch-track': {\n        width: '100%',\n        height: '100%',\n        borderRadius: 11,\n        opacity: 1,\n        backgroundColor: 'var(--switch-track-off)',\n        transition: 'background-color 160ms ease',\n        '&::before, &::after': {\n          display: 'none',\n          content: 'none',\n          backgroundImage: 'none',\n        },\n      },\n      '&.MuiSwitch-sizeSmall': {\n        width: 32,\n        height: 18,\n        '& .MuiSwitch-switchBase': {\n          padding: 2,\n          width: 18,\n          height: 18,\n          '&.Mui-checked': {\n            transform: 'translateX(14px)',\n          },\n        },\n        '& .MuiSwitch-thumb': {\n          width: 14,\n          height: 14,\n        },\n        '& .MuiSwitch-track': {\n          borderRadius: 9,\n        },\n      },\n    },\n  },\n} as const satisfies MuiComponentTheme<'MuiSwitch'>\n\n/** Static palette aliases for MuiSwitch wrapper root element */\nexport const muiSwitchRootSx: SxProps<Theme> = {\n  '--switch-label-color':      'var(--mui-palette-text-grey-1)',\n  '--switch-error-track-bg':   'var(--mui-palette-error-main)',\n  alignItems: 'flex-start',\n  '& .MuiFormControlLabel-root': {\n    gap: '8px',\n    margin: 0,\n    alignItems: 'center',\n    overflow: 'visible',\n    maxWidth: 'none',\n  },\n  '& .MuiFormControlLabel-root.MuiFormControlLabel-labelPlacementStart, & .MuiFormControlLabel-root.MuiFormControlLabel-labelPlacementEnd, & .MuiFormControlLabel-root.MuiFormControlLabel-labelPlacementTop, & .MuiFormControlLabel-root.MuiFormControlLabel-labelPlacementBottom': {\n    margin: 0,\n  },\n  '& .MuiFormControlLabel-label': {\n    fontSize: '12px',\n    userSelect: 'none',\n    color: 'var(--switch-label-color)',\n    overflow: 'visible',\n    textOverflow: 'clip',\n    flexShrink: 0,\n  },\n  '&.Mui-error .MuiSwitch-track': {\n    backgroundColor: 'var(--switch-error-track-bg)',\n  },\n} as const satisfies SxProps<Theme>\n\n/** Wrapper tokens for SwitchSoft (same control as Switch, label/error only). */\nexport const switchSoftRootSx: SxProps<Theme> = {\n  ...muiSwitchRootSx,\n  '--switch-label-color': 'var(--mui-palette-text-primary)',\n} as const satisfies SxProps<Theme>\n","import Switch, { type SwitchProps } from '@mui/material/Switch'\nimport { FormControl, FormControlLabel, FormHelperText } from '@/ele/Form'\nimport { switchSoftRootSx } from './themes'\n\nexport type SwitchSoftProps = {\n  onChange?: SwitchProps['onChange']\n  checked?: boolean\n  label?: React.ReactNode\n  error?: boolean\n  required?: boolean\n  labelPlacement?: 'start' | 'end' | 'top' | 'bottom'\n  helperText?: React.ReactNode\n  size?: 'small' | 'medium'\n} & Omit<SwitchProps, 'size'>\n\n/**\n * Simple themed switch. Geometry is MUI’s; colors come from the theme.\n */\nexport default function SwitchSoft({\n  onChange,\n  checked,\n  label,\n  error = false,\n  required = false,\n  labelPlacement = 'end',\n  helperText,\n  size = 'medium',\n  sx,\n  ...props\n}: SwitchSoftProps) {\n  const control = (\n    <Switch\n      {...props}\n      className={['ui-SwitchSoft', props.className].filter(Boolean).join(' ')}\n      disableRipple\n      disableFocusRipple\n      disableTouchRipple\n      size={size}\n      checked={checked}\n      onChange={onChange}\n      sx={sx}\n    />\n  )\n\n  return (\n    <FormControl\n      error={error}\n      sx={switchSoftRootSx as object}\n    >\n      {label != null && label !== '' ? (\n        <FormControlLabel\n          labelPlacement={labelPlacement}\n          required={required}\n          label={label}\n          control={control}\n        />\n      ) : control}\n      {helperText ? <FormHelperText>{helperText}</FormHelperText> : null}\n    </FormControl>\n  )\n}\n"],"mappings":"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","names":["default","Switch","jsx","jsxs","Switch","default"]}

package/dist/chunk-T4X375IG.mjs

@@ -0,0 +1,100 @@
+// src/components/elemental/Form/src/FormLabel/FormLabel.tsx
+import FormLabel from "@mui/material/FormLabel";
+import { jsx } from "react/jsx-runtime";
+function MuiFormLabel(props) {
+  return /* @__PURE__ */ jsx(FormLabel, { ...props });
+}
+
+// src/components/elemental/Form/src/FormLabel/theme.ts
+var formLabelTheme = {
+  defaultProps: {},
+  styleOverrides: {
+    root: {
+      "--form-label-color": "var(--mui-palette-text-secondary)",
+      color: "var(--form-label-color)",
+      maxWidth: "100%",
+      textOverflow: "ellipsis",
+      overflow: "hidden",
+      whiteSpace: "nowrap",
+      "&.MuiFormLabel-colorSuccess": {
+        color: "var(--mui-palette-success-main)"
+      },
+      "&.MuiFormLabel-colorError": {
+        color: "var(--mui-palette-error-main)"
+      },
+      "&.MuiFormLabel-colorInfo": {
+        color: "var(--mui-palette-info-main)"
+      },
+      "&.MuiFormLabel-colorWarning": {
+        color: "var(--mui-palette-warning-main)"
+      },
+      "&.MuiFormLabel-colorPrimary": {
+        "--form-label-color": "var(--mui-palette-primary-emphasis)",
+        color: "var(--form-label-color)"
+      },
+      "&.MuiFormLabel-colorSecondary": {
+        color: "var(--mui-palette-secondary-main)"
+      },
+      "&.Mui-disabled": {
+        color: "var(--mui-palette-text-disabled)"
+      },
+      "&.Mui-error": {
+        color: "var(--mui-palette-error-main)"
+      }
+    }
+  }
+};
+
+// src/components/elemental/Form/src/FormControlLabel/FormControlLabel.tsx
+import FormControlLabel from "@mui/material/FormControlLabel";
+import { jsx as jsx2 } from "react/jsx-runtime";
+function MuiFormControlLabel(props) {
+  return /* @__PURE__ */ jsx2(FormControlLabel, { ...props });
+}
+
+// src/components/elemental/Form/src/FormControlLabel/theme.ts
+var formControlLabelTheme = {
+  defaultProps: {},
+  styleOverrides: {
+    root: {
+      "--form-control-label-color": "var(--mui-palette-text-primary)",
+      color: "var(--form-control-label-color)",
+      maxWidth: "100%",
+      textOverflow: "ellipsis",
+      overflow: "hidden",
+      whiteSpace: "nowrap",
+      "&.Mui-disabled": {
+        color: "var(--mui-palette-text-disabled)"
+      }
+    }
+  }
+};
+
+// src/components/elemental/Form/src/index.ts
+import { default as default2 } from "@mui/material/FormControl";
+import { default as default3 } from "@mui/material/FormHelperText";
+import { default as default4 } from "@mui/material/InputAdornment";
+import { default as default5 } from "@mui/material/InputLabel";
+
+// src/components/elemental/Form/src/themes.ts
+var formHelperTextTheme = {
+  defaultProps: {},
+  styleOverrides: {
+    root: {
+      color: "var(--mui-palette-text-subscript)"
+    }
+  }
+};
+
+export {
+  MuiFormLabel,
+  formLabelTheme,
+  MuiFormControlLabel,
+  formControlLabelTheme,
+  formHelperTextTheme,
+  default2 as default,
+  default3 as default2,
+  default4 as default3,
+  default5 as default4
+};
+//# sourceMappingURL=chunk-T4X375IG.mjs.map

package/dist/chunk-T4X375IG.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/elemental/Form/src/FormLabel/FormLabel.tsx","../src/components/elemental/Form/src/FormLabel/theme.ts","../src/components/elemental/Form/src/FormControlLabel/FormControlLabel.tsx","../src/components/elemental/Form/src/FormControlLabel/theme.ts","../src/components/elemental/Form/src/index.ts","../src/components/elemental/Form/src/themes.ts"],"sourcesContent":["import FormLabel, { type FormLabelProps } from '@mui/material/FormLabel'\n\n/**\n * A wrapper for Mui FormLabel\n */\nexport default function MuiFormLabel(props: FormLabelProps) {\n  return <FormLabel {...props} />\n}\n","import type { MuiComponentTheme } from '@/_utils/_types'\n\nexport const formLabelTheme = {\n  defaultProps: {\n  },\n  styleOverrides: {\n    root: ({\n      '--form-label-color': 'var(--mui-palette-text-secondary)',\n      color: 'var(--form-label-color)',\n      \n      maxWidth: \"100%\",\n      textOverflow: \"ellipsis\",\n      overflow: \"hidden\",\n      whiteSpace: \"nowrap\",\n\n      \"&.MuiFormLabel-colorSuccess\":{\n        color:\"var(--mui-palette-success-main)\",\n      },\n      \"&.MuiFormLabel-colorError\":{\n        color:\"var(--mui-palette-error-main)\",\n      },\n      \"&.MuiFormLabel-colorInfo\":{\n        color:\"var(--mui-palette-info-main)\",\n      },\n      \"&.MuiFormLabel-colorWarning\":{\n        color:\"var(--mui-palette-warning-main)\",\n      },\n      \"&.MuiFormLabel-colorPrimary\":{\n        '--form-label-color':\"var(--mui-palette-primary-emphasis)\",\n        color:\"var(--form-label-color)\",\n      },\n      \"&.MuiFormLabel-colorSecondary\":{\n        color:\"var(--mui-palette-secondary-main)\",\n      },\n      \"&.Mui-disabled\":{\n        color:\"var(--mui-palette-text-disabled)\",\n      },\n      \"&.Mui-error\":{ \n        color:\"var(--mui-palette-error-main)\", \n      },\n    }),\n  }\n\n} as const satisfies MuiComponentTheme<\"MuiFormLabel\">","import FormControlLabel, { type FormControlLabelProps } from '@mui/material/FormControlLabel'\n\n/**\n * A wrapper for Mui FormControlLabel\n */\nexport default function MuiFormControlLabel(props: FormControlLabelProps) {\n  return <FormControlLabel {...props} />\n}\n","import type { MuiComponentTheme } from '@/_utils/_types'\n\nexport const formControlLabelTheme = {\n  defaultProps: {\n  },\n  styleOverrides: {\n    root: ({\n      '--form-control-label-color': 'var(--mui-palette-text-primary)',\n      color: 'var(--form-control-label-color)',\n\n      maxWidth: \"100%\",\n      textOverflow: \"ellipsis\",\n      overflow: \"hidden\",\n      whiteSpace: \"nowrap\",\n\n      \"&.Mui-disabled\":{\n        color:\"var(--mui-palette-text-disabled)\",\n      },\n    }),\n  }\n\n} as const satisfies MuiComponentTheme<\"MuiFormControlLabel\">","export * from './FormLabel'\n\nexport * from './FormControlLabel'\n\nexport {default as FormControl} from '@mui/material/FormControl'\nexport {default as FormHelperText} from '@mui/material/FormHelperText'\nexport {default as InputAdornment} from '@mui/material/InputAdornment'\nexport {default as InputLabel} from '@mui/material/InputLabel'\nexport * from './themes'","import type { MuiComponentTheme } from '@/_utils/_types'\n\nexport const formHelperTextTheme = {\n  defaultProps: {\n  },\n  styleOverrides: {\n    root: {\n      color: 'var(--mui-palette-text-subscript)',\n    }\n  },\n} as const satisfies MuiComponentTheme<\"MuiFormHelperText\">"],"mappings":";AAAA,OAAO,eAAwC;AAMtC;AADM,SAAR,aAA8B,OAAuB;AAC1D,SAAO,oBAAC,aAAW,GAAG,OAAO;AAC/B;;;ACLO,IAAM,iBAAiB;AAAA,EAC5B,cAAc,CACd;AAAA,EACA,gBAAgB;AAAA,IACd,MAAO;AAAA,MACL,sBAAsB;AAAA,MACtB,OAAO;AAAA,MAEP,UAAU;AAAA,MACV,cAAc;AAAA,MACd,UAAU;AAAA,MACV,YAAY;AAAA,MAEZ,+BAA8B;AAAA,QAC5B,OAAM;AAAA,MACR;AAAA,MACA,6BAA4B;AAAA,QAC1B,OAAM;AAAA,MACR;AAAA,MACA,4BAA2B;AAAA,QACzB,OAAM;AAAA,MACR;AAAA,MACA,+BAA8B;AAAA,QAC5B,OAAM;AAAA,MACR;AAAA,MACA,+BAA8B;AAAA,QAC5B,sBAAqB;AAAA,QACrB,OAAM;AAAA,MACR;AAAA,MACA,iCAAgC;AAAA,QAC9B,OAAM;AAAA,MACR;AAAA,MACA,kBAAiB;AAAA,QACf,OAAM;AAAA,MACR;AAAA,MACA,eAAc;AAAA,QACZ,OAAM;AAAA,MACR;AAAA,IACF;AAAA,EACF;AAEF;;;AC3CA,OAAO,sBAAsD;AAMpD,gBAAAA,YAAA;AADM,SAAR,oBAAqC,OAA8B;AACxE,SAAO,gBAAAA,KAAC,oBAAkB,GAAG,OAAO;AACtC;;;ACLO,IAAM,wBAAwB;AAAA,EACnC,cAAc,CACd;AAAA,EACA,gBAAgB;AAAA,IACd,MAAO;AAAA,MACL,8BAA8B;AAAA,MAC9B,OAAO;AAAA,MAEP,UAAU;AAAA,MACV,cAAc;AAAA,MACd,UAAU;AAAA,MACV,YAAY;AAAA,MAEZ,kBAAiB;AAAA,QACf,OAAM;AAAA,MACR;AAAA,IACF;AAAA,EACF;AAEF;;;ACjBA,SAAmB,WAAXC,gBAA6B;AACrC,SAAmB,WAAXA,gBAAgC;AACxC,SAAmB,WAAXA,gBAAgC;AACxC,SAAmB,WAAXA,gBAA4B;;;ACL7B,IAAM,sBAAsB;AAAA,EACjC,cAAc,CACd;AAAA,EACA,gBAAgB;AAAA,IACd,MAAM;AAAA,MACJ,OAAO;AAAA,IACT;AAAA,EACF;AACF;","names":["jsx","default"]}