@startdownnotez404/ui 1.0.0 → 1.3.5

package/dist/switch.d.ts

@@ -0,0 +1,151 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { SwitchProps } from '@mui/material/Switch';
+import { SxProps, Theme } from '@mui/material/styles';
+
+/**
+ * MuiSwitch
+ *
+ * [Doc](https://mui.com/material-ui/api/switch/)
+ */
+declare function MuiSwitch({ onChange, checked, label, error, required, labelPlacement, helperText, ...props }: {
+    onChange?: SwitchProps['onChange'];
+    checked?: boolean;
+    label?: React.ReactNode;
+    error?: boolean;
+    required?: boolean;
+    labelPlacement?: 'start' | 'end' | 'top' | 'bottom';
+    helperText?: React.ReactNode;
+} & SwitchProps): react_jsx_runtime.JSX.Element;
+
+type SwitchSoftProps = {
+    onChange?: SwitchProps['onChange'];
+    checked?: boolean;
+    label?: React.ReactNode;
+    error?: boolean;
+    required?: boolean;
+    labelPlacement?: 'start' | 'end' | 'top' | 'bottom';
+    helperText?: React.ReactNode;
+    size?: 'small' | 'medium';
+} & Omit<SwitchProps, 'size'>;
+/**
+ * Simple themed switch. Geometry is MUI’s; colors come from the theme.
+ */
+declare function SwitchSoft({ onChange, checked, label, error, required, labelPlacement, helperText, size, sx, ...props }: SwitchSoftProps): react_jsx_runtime.JSX.Element;
+
+/** MuiSwitch tokens: inset track, stable thumb, emphasis only on the on-track. */
+declare const switchTheme: {
+    readonly defaultProps: {
+        readonly disableFocusRipple: true;
+        readonly disableRipple: true;
+        readonly disableTouchRipple: true;
+    };
+    readonly styleOverrides: {
+        readonly root: {
+            readonly '--switch-thumb': "color-mix(in lab, var(--mui-palette-background-default) 72%, var(--mui-palette-text-primary) 28%)";
+            readonly '--switch-thumb-on': "var(--mui-palette-background-default)";
+            readonly '--switch-track-off': "var(--mui-palette-background-grey-1)";
+            readonly '--switch-track-on': "var(--mui-palette-primary-emphasis)";
+            readonly '--switch-track-on-disabled': "color-mix(in lab, var(--switch-track-on) 28%, var(--mui-palette-background-default))";
+            readonly overflow: "visible";
+            readonly width: 40;
+            readonly height: 22;
+            readonly padding: 0;
+            readonly '&:has(.MuiSwitch-colorError)': {
+                readonly '--switch-track-on': "var(--mui-palette-error-main)";
+            };
+            readonly '&:has(.MuiSwitch-colorSuccess)': {
+                readonly '--switch-track-on': "var(--mui-palette-success-main)";
+            };
+            readonly '&:has(.MuiSwitch-colorWarning)': {
+                readonly '--switch-track-on': "var(--mui-palette-warning-main)";
+            };
+            readonly '&:has(.MuiSwitch-colorInfo)': {
+                readonly '--switch-track-on': "var(--mui-palette-info-main)";
+            };
+            readonly '&:has(.MuiSwitch-colorSystem)': {
+                readonly '--switch-track-on': "var(--mui-palette-system-main)";
+            };
+            readonly '&:has(.MuiSwitch-colorInsight)': {
+                readonly '--switch-track-on': "var(--mui-palette-insight-main)";
+            };
+            readonly '&:has(.MuiSwitch-colorSecondary)': {
+                readonly '--switch-track-on': "var(--mui-palette-secondary-main)";
+            };
+            readonly '& .MuiSwitch-switchBase': {
+                readonly boxSizing: "border-box";
+                readonly top: 0;
+                readonly left: 0;
+                readonly padding: 2;
+                readonly width: 22;
+                readonly height: 22;
+                readonly color: "var(--switch-thumb)";
+                readonly transition: "transform 160ms ease";
+                readonly '&:hover': {
+                    readonly backgroundColor: "transparent";
+                };
+                readonly '&.Mui-checked': {
+                    readonly transform: "translateX(18px)";
+                    readonly color: "var(--switch-thumb-on)";
+                    readonly '& .MuiSwitch-thumb': {
+                        readonly backgroundColor: "var(--switch-thumb-on)";
+                    };
+                };
+                readonly '&.Mui-checked + .MuiSwitch-track': {
+                    readonly backgroundColor: "var(--switch-track-on)";
+                    readonly opacity: 1;
+                };
+                readonly '&.Mui-checked.Mui-disabled + .MuiSwitch-track': {
+                    readonly backgroundColor: "var(--switch-track-on-disabled)";
+                };
+                readonly '&.Mui-focusVisible': {
+                    readonly outline: "2px solid var(--mui-palette-focus-1)";
+                    readonly outlineOffset: 2;
+                };
+            };
+            readonly '& .MuiSwitch-thumb': {
+                readonly width: 18;
+                readonly height: 18;
+                readonly boxShadow: "none";
+                readonly backgroundColor: "var(--switch-thumb)";
+            };
+            readonly '& .MuiSwitch-track': {
+                readonly width: "100%";
+                readonly height: "100%";
+                readonly borderRadius: 11;
+                readonly opacity: 1;
+                readonly backgroundColor: "var(--switch-track-off)";
+                readonly transition: "background-color 160ms ease";
+                readonly '&::before, &::after': {
+                    readonly display: "none";
+                    readonly content: "none";
+                    readonly backgroundImage: "none";
+                };
+            };
+            readonly '&.MuiSwitch-sizeSmall': {
+                readonly width: 32;
+                readonly height: 18;
+                readonly '& .MuiSwitch-switchBase': {
+                    readonly padding: 2;
+                    readonly width: 18;
+                    readonly height: 18;
+                    readonly '&.Mui-checked': {
+                        readonly transform: "translateX(14px)";
+                    };
+                };
+                readonly '& .MuiSwitch-thumb': {
+                    readonly width: 14;
+                    readonly height: 14;
+                };
+                readonly '& .MuiSwitch-track': {
+                    readonly borderRadius: 9;
+                };
+            };
+        };
+    };
+};
+/** Static palette aliases for MuiSwitch wrapper root element */
+declare const muiSwitchRootSx: SxProps<Theme>;
+/** Wrapper tokens for SwitchSoft (same control as Switch, label/error only). */
+declare const switchSoftRootSx: SxProps<Theme>;
+
+export { MuiSwitch as Switch, SwitchSoft, type SwitchSoftProps, muiSwitchRootSx, switchSoftRootSx, switchTheme };

package/dist/switch.js

@@ -0,0 +1,289 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/elemental/Switch/index.ts
+var Switch_exports = {};
+__export(Switch_exports, {
+  Switch: () => MuiSwitch,
+  SwitchSoft: () => SwitchSoft,
+  muiSwitchRootSx: () => muiSwitchRootSx,
+  switchSoftRootSx: () => switchSoftRootSx,
+  switchTheme: () => switchTheme
+});
+module.exports = __toCommonJS(Switch_exports);
+
+// src/components/elemental/Switch/src/Switch/MuiSwitch.tsx
+var import_Switch = __toESM(require("@mui/material/Switch"));
+
+// src/components/elemental/Form/src/FormControlLabel/FormControlLabel.tsx
+var import_FormControlLabel = __toESM(require("@mui/material/FormControlLabel"));
+var import_jsx_runtime = require("react/jsx-runtime");
+function MuiFormControlLabel(props) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_FormControlLabel.default, { ...props });
+}
+
+// src/components/elemental/Form/src/index.ts
+var import_FormControl = __toESM(require("@mui/material/FormControl"));
+var import_FormHelperText = __toESM(require("@mui/material/FormHelperText"));
+var import_InputAdornment = __toESM(require("@mui/material/InputAdornment"));
+var import_InputLabel = __toESM(require("@mui/material/InputLabel"));
+
+// 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
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function MuiSwitch({
+  onChange,
+  checked,
+  label,
+  error = false,
+  required = false,
+  labelPlacement = "start",
+  helperText,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_FormControl.default, { error, sx: muiSwitchRootSx, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+      MuiFormControlLabel,
+      {
+        labelPlacement,
+        required,
+        label,
+        control: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          import_Switch.default,
+          {
+            disableRipple: true,
+            ...{ onChange, checked },
+            ...props
+          }
+        )
+      }
+    ),
+    helperText && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_FormHelperText.default, { children: helperText })
+  ] });
+}
+
+// src/components/elemental/Switch/src/Switch/SwitchSoft.tsx
+var import_Switch2 = __toESM(require("@mui/material/Switch"));
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function SwitchSoft({
+  onChange,
+  checked,
+  label,
+  error = false,
+  required = false,
+  labelPlacement = "end",
+  helperText,
+  size = "medium",
+  sx,
+  ...props
+}) {
+  const control = /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    import_Switch2.default,
+    {
+      ...props,
+      className: ["ui-SwitchSoft", props.className].filter(Boolean).join(" "),
+      disableRipple: true,
+      disableFocusRipple: true,
+      disableTouchRipple: true,
+      size,
+      checked,
+      onChange,
+      sx
+    }
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
+    import_FormControl.default,
+    {
+      error,
+      sx: switchSoftRootSx,
+      children: [
+        label != null && label !== "" ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+          MuiFormControlLabel,
+          {
+            labelPlacement,
+            required,
+            label,
+            control
+          }
+        ) : control,
+        helperText ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_FormHelperText.default, { children: helperText }) : null
+      ]
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Switch,
+  SwitchSoft,
+  muiSwitchRootSx,
+  switchSoftRootSx,
+  switchTheme
+});
+//# sourceMappingURL=switch.js.map

package/dist/switch.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/elemental/Switch/index.ts","../src/components/elemental/Switch/src/Switch/MuiSwitch.tsx","../src/components/elemental/Form/src/FormControlLabel/FormControlLabel.tsx","../src/components/elemental/Form/src/index.ts","../src/components/elemental/Switch/src/Switch/themes.ts","../src/components/elemental/Switch/src/Switch/SwitchSoft.tsx"],"sourcesContent":["export * from './src'\n","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 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","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'\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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,oBAAyC;;;ACAzC,8BAA6D;AAMpD;AADM,SAAR,oBAAqC,OAA8B;AACxE,SAAO,4CAAC,wBAAAA,SAAA,EAAkB,GAAG,OAAO;AACtC;;;ACHA,yBAAqC;AACrC,4BAAwC;AACxC,4BAAwC;AACxC,wBAAoC;;;ACF7B,IAAM,cAAc;AAAA,EACzB,cAAc;AAAA,IACZ,oBAAoB;AAAA,IACpB,eAAe;AAAA,IACf,oBAAoB;AAAA,EAEtB;AAAA,EACA,gBAAgB;AAAA,IACd,MAAM;AAAA,MACJ,kBAAkB;AAAA,MAClB,qBAAqB;AAAA,MACrB,sBAAsB;AAAA,MACtB,qBAAqB;AAAA,MACrB,8BAA8B;AAAA,MAC9B,UAAU;AAAA,MACV,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,gCAAgC;AAAA,QAC9B,qBAAqB;AAAA,MACvB;AAAA,MACA,kCAAkC;AAAA,QAChC,qBAAqB;AAAA,MACvB;AAAA,MACA,kCAAkC;AAAA,QAChC,qBAAqB;AAAA,MACvB;AAAA,MACA,+BAA+B;AAAA,QAC7B,qBAAqB;AAAA,MACvB;AAAA,MACA,iCAAiC;AAAA,QAC/B,qBAAqB;AAAA,MACvB;AAAA,MACA,kCAAkC;AAAA,QAChC,qBAAqB;AAAA,MACvB;AAAA,MACA,oCAAoC;AAAA,QAClC,qBAAqB;AAAA,MACvB;AAAA,MACA,2BAA2B;AAAA,QACzB,WAAW;AAAA,QACX,KAAK;AAAA,QACL,MAAM;AAAA,QACN,SAAS;AAAA,QACT,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,YAAY;AAAA,QACZ,WAAW;AAAA,UACT,iBAAiB;AAAA,QACnB;AAAA,QACA,iBAAiB;AAAA,UACf,WAAW;AAAA,UACX,OAAO;AAAA,UACP,sBAAsB;AAAA,YACpB,iBAAiB;AAAA,UACnB;AAAA,QACF;AAAA,QACA,oCAAoC;AAAA,UAClC,iBAAiB;AAAA,UACjB,SAAS;AAAA,QACX;AAAA,QACA,iDAAiD;AAAA,UAC/C,iBAAiB;AAAA,QACnB;AAAA,QACA,sBAAsB;AAAA,UACpB,SAAS;AAAA,UACT,eAAe;AAAA,QACjB;AAAA,MACF;AAAA,MACA,sBAAsB;AAAA,QACpB,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,WAAW;AAAA,QACX,iBAAiB;AAAA,MACnB;AAAA,MACA,sBAAsB;AAAA,QACpB,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,cAAc;AAAA,QACd,SAAS;AAAA,QACT,iBAAiB;AAAA,QACjB,YAAY;AAAA,QACZ,uBAAuB;AAAA,UACrB,SAAS;AAAA,UACT,SAAS;AAAA,UACT,iBAAiB;AAAA,QACnB;AAAA,MACF;AAAA,MACA,yBAAyB;AAAA,QACvB,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,2BAA2B;AAAA,UACzB,SAAS;AAAA,UACT,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,iBAAiB;AAAA,YACf,WAAW;AAAA,UACb;AAAA,QACF;AAAA,QACA,sBAAsB;AAAA,UACpB,OAAO;AAAA,UACP,QAAQ;AAAA,QACV;AAAA,QACA,sBAAsB;AAAA,UACpB,cAAc;AAAA,QAChB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;AAGO,IAAM,kBAAkC;AAAA,EAC7C,wBAA6B;AAAA,EAC7B,2BAA6B;AAAA,EAC7B,YAAY;AAAA,EACZ,+BAA+B;AAAA,IAC7B,KAAK;AAAA,IACL,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,UAAU;AAAA,EACZ;AAAA,EACA,mRAAmR;AAAA,IACjR,QAAQ;AAAA,EACV;AAAA,EACA,gCAAgC;AAAA,IAC9B,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,OAAO;AAAA,IACP,UAAU;AAAA,IACV,cAAc;AAAA,IACd,YAAY;AAAA,EACd;AAAA,EACA,gCAAgC;AAAA,IAC9B,iBAAiB;AAAA,EACnB;AACF;AAGO,IAAM,mBAAmC;AAAA,EAC9C,GAAG;AAAA,EACH,wBAAwB;AAC1B;;;AH3HI,IAAAC,sBAAA;AAjBW,SAAR,UAA2B;AAAA,EAChC;AAAA,EAAU;AAAA,EAAS;AAAA,EACnB,QAAQ;AAAA,EAAO,WAAW;AAAA,EAC1B,iBAAiB;AAAA,EACjB;AAAA,EACA,GAAG;AACL,GAQiB;AAEf,SACE,8CAAC,8BAAY,OAAc,IAAI,iBAC7B;AAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QAAoB;AAAA,QACpB,SAAS;AAAA,UAAC,cAAAC;AAAA,UAAA;AAAA,YACR,eAAa;AAAA,YACZ,GAAG,EAAE,UAAU,QAAS;AAAA,YACxB,GAAG;AAAA;AAAA,QAAO;AAAA;AAAA,IAEf;AAAA,IACC,cAAc,6CAAC,iCAAgB,sBAAW;AAAA,KAC7C;AAEJ;;;AIvCA,IAAAC,iBAAyC;AA+BrC,IAAAC,sBAAA;AAbW,SAAR,WAA4B;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,iBAAiB;AAAA,EACjB;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA,GAAG;AACL,GAAoB;AAClB,QAAM,UACJ;AAAA,IAAC,eAAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW,CAAC,iBAAiB,MAAM,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,MACtE,eAAa;AAAA,MACb,oBAAkB;AAAA,MAClB,oBAAkB;AAAA,MAClB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,EACF;AAGF,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,IAAI;AAAA,MAEH;AAAA,iBAAS,QAAQ,UAAU,KAC1B;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACF,IACE;AAAA,QACH,aAAa,6CAAC,iCAAgB,sBAAW,IAAoB;AAAA;AAAA;AAAA,EAChE;AAEJ;","names":["FormControlLabel","import_jsx_runtime","Switch","import_Switch","import_jsx_runtime","Switch"]}

package/dist/switch.mjs

@@ -0,0 +1,17 @@
+import {
+  MuiSwitch,
+  SwitchSoft,
+  muiSwitchRootSx,
+  switchSoftRootSx,
+  switchTheme
+} from "./chunk-T34IULP5.mjs";
+import "./chunk-T4X375IG.mjs";
+import "./chunk-FJ6ZGZIA.mjs";
+export {
+  MuiSwitch as Switch,
+  SwitchSoft,
+  muiSwitchRootSx,
+  switchSoftRootSx,
+  switchTheme
+};
+//# sourceMappingURL=switch.mjs.map

package/dist/switch.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/tab.d.mts

@@ -0,0 +1,182 @@
+import * as _mui_material_Tab from '@mui/material/Tab';
+export { default as Tab, TabProps } from '@mui/material/Tab';
+export { default as Tabs, TabsProps } from '@mui/material/Tabs';
+import * as csstype from 'csstype';
+import * as _mui_material_styles from '@mui/material/styles';
+import { SxProps, Theme } from '@mui/material/styles';
+import * as react from 'react';
+import { ReactNode } from 'react';
+import * as _mui_material_OverridableComponent from '@mui/material/OverridableComponent';
+import * as _mui_material_ButtonBase from '@mui/material/ButtonBase';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+declare const tabTheme: {
+    readonly defaultProps: {
+        readonly disableRipple: true;
+    };
+    readonly styleOverrides: {
+        readonly root: ({ theme }: _mui_material_Tab.TabOwnProps & Omit<_mui_material_ButtonBase.ButtonBaseOwnProps, "classes"> & _mui_material_OverridableComponent.CommonProps & Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "className" | "style" | "classes" | "action" | "centerRipple" | "children" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "icon" | "iconPosition" | "label" | "value" | "wrapped"> & {
+            component?: React.ElementType | undefined;
+        } & Record<string, unknown> & {
+            ownerState: _mui_material_Tab.TabOwnProps & Omit<_mui_material_ButtonBase.ButtonBaseOwnProps, "classes"> & _mui_material_OverridableComponent.CommonProps & Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "className" | "style" | "classes" | "action" | "centerRipple" | "children" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "icon" | "iconPosition" | "label" | "value" | "wrapped"> & {
+                component?: React.ElementType | undefined;
+            } & Record<string, unknown>;
+        } & {
+            theme: Omit<_mui_material_styles.Theme, "components" | "palette"> & _mui_material_styles.CssVarsTheme;
+        }) => {
+            minHeight: number;
+            minWidth: number;
+            paddingInline: string;
+            paddingBlock: string;
+            borderRadius: string | number;
+            textTransform: "none";
+            fontWeight: csstype.Property.FontWeight | undefined;
+            color: "var(--mui-palette-text-secondary)";
+            transition: string;
+            '&:hover': {
+                color: string;
+                backgroundColor: string;
+            };
+            '&.Mui-selected': {
+                color: string;
+                backgroundColor: string;
+            };
+            '&.Mui-selected:hover': {
+                backgroundColor: string;
+            };
+            '&.Mui-disabled': {
+                color: string;
+            };
+        };
+    };
+};
+declare const tabsTheme: {
+    readonly styleOverrides: {
+        readonly root: {
+            readonly minHeight: 44;
+        };
+        readonly list: {
+            readonly gap: 4;
+        };
+        readonly indicator: {
+            readonly height: 3;
+            readonly borderRadius: 999;
+            readonly backgroundColor: "var(--mui-palette-primary-emphasis)";
+        };
+        readonly scrollButtons: {
+            readonly color: "var(--mui-palette-text-secondary)";
+            readonly '&.Mui-disabled': {
+                readonly opacity: 0.4;
+            };
+        };
+    };
+};
+
+/**
+ * Default TabPanel CSS variables — set on the root wrapper via `sx`.
+ * Override with `sx`, `slotProps.root.sx`, or `slotProps.root.style`.
+ */
+declare const tabPanelRootSx: {
+    readonly '--tabpanel-accent': "var(--mui-palette-primary-emphasis)";
+    readonly '--tabpanel-track-bg': "color-mix(in lab, var(--tabpanel-accent), transparent 92%)";
+    readonly '--tabpanel-tab-color': "var(--mui-palette-text-secondary)";
+    readonly '--tabpanel-tab-color-active': "var(--tabpanel-accent)";
+    readonly '--tabpanel-tab-color-disabled': "var(--mui-palette-text-disabled)";
+    readonly '--tabpanel-badge-color': "var(--mui-palette-error-main)";
+    readonly '--tabpanel-badge-bg': "color-mix(in lab, var(--mui-palette-error-main), transparent 86%)";
+    readonly '--tabpanel-focus-bg': "color-mix(in lab, var(--mui-palette-background-paper), transparent 78%)";
+    readonly '--tabpanel-focus-bg-dark': "color-mix(in lab, var(--mui-palette-background-paper), transparent 55%)";
+    readonly '--tabpanel-focus-shadow': string;
+    readonly '--tabpanel-focus-shadow-dark': string;
+    readonly '--tabpanel-focus-radius': "10px";
+    readonly '--tabpanel-track-radius': "12px";
+    readonly '--tabpanel-track-pad': "3px";
+    readonly '--tabpanel-item-gap': "1px";
+    readonly '--tabpanel-indicator-ease': "cubic-bezier(0.32, 0.72, 0, 1)";
+    readonly '--tabpanel-indicator-ms': "380ms";
+};
+type TabPanelStyleVars = {
+    accent?: string;
+    trackBg?: string;
+    tabColor?: string;
+    tabColorActive?: string;
+    tabColorDisabled?: string;
+    badgeColor?: string;
+    badgeBg?: string;
+    focusBg?: string;
+    focusBgDark?: string;
+    focusShadow?: string;
+    focusShadowDark?: string;
+    focusRadius?: string;
+    trackRadius?: string;
+};
+/** Maps typed style tokens onto CSS custom properties for the root wrapper. */
+declare function tabPanelStyleToCssVars(style?: TabPanelStyleVars): Record<string, string>;
+
+type TabPanelItem = {
+    id: string;
+    label: string;
+    icon?: ReactNode;
+    badge?: number | string;
+    disabled?: boolean;
+    content?: ReactNode;
+};
+type TabPanelSlotProps = {
+    root?: {
+        /** Typed color / token overrides → CSS vars on the root wrapper. */
+        style?: TabPanelStyleVars;
+        sx?: SxProps<Theme>;
+    };
+    strip?: {
+        sx?: SxProps<Theme>;
+    };
+    indicator?: {
+        sx?: SxProps<Theme>;
+    };
+    tab?: {
+        sx?: SxProps<Theme>;
+    };
+    menu?: {
+        sx?: SxProps<Theme>;
+    };
+    panel?: {
+        sx?: SxProps<Theme>;
+    };
+};
+type TabPanelProps = {
+    items: TabPanelItem[];
+    value?: string;
+    defaultValue?: string;
+    onChange?: (id: string) => void;
+    /**
+     * When false, the fitted strip prefers icons (labels stay for a11y / overflow menu).
+     * Defaults to true.
+     */
+    showLabels?: boolean;
+    /**
+     * Corner radius of the selected focus highlight (and tab hit targets).
+     * Number = px (avoids MUI theme multiplier). Default: `10`.
+     * Sets `--tabpanel-focus-radius` (overridable via `slotProps.root.style` / `sx`).
+     */
+    focusRadius?: number | string;
+    /**
+     * Corner radius of the outer track. Number = px. Default: `12`.
+     * Sets `--tabpanel-track-radius` (overridable via `slotProps.root.style` / `sx`).
+     */
+    trackRadius?: number | string;
+    /** Root wrapper `sx` — merge after default CSS vars. */
+    sx?: SxProps<Theme>;
+    className?: string;
+    slotProps?: TabPanelSlotProps;
+};
+
+/**
+ * Adaptive content tabs: soft liquid track + morphing pill.
+ * Overflow cuts trailing tabs into a More dropdown (selected stays visible).
+ *
+ * Colors / radii are CSS vars on the root (`tabPanelRootSx`). Override via
+ * `sx`, `slotProps.root.style`, or `slotProps.root.sx`.
+ */
+declare function TabPanel({ items, value, defaultValue, onChange, showLabels, focusRadius, trackRadius, sx, className, slotProps, }: TabPanelProps): react_jsx_runtime.JSX.Element;
+
+export { TabPanel, type TabPanelItem, type TabPanelProps, type TabPanelSlotProps, type TabPanelStyleVars, tabPanelRootSx, tabPanelStyleToCssVars, tabTheme, tabsTheme };