@punkbit/cui 0.0.251-rc.16 → 0.2.0

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../../src/components/SidebarNavigationTitle/SidebarNavigationTitle.tsx"],"sourcesContent":["import { styled } from 'styled-components';\nimport { IconWrapper } from '@/components/Collapsible/IconWrapper';\nimport { SidebarNavigationTitleProps } from './SidebarNavigationTitle.types';\n\nexport const SidebarNavigationTitle = ({\n  label,\n  icon,\n  iconDir,\n  selected,\n  type = 'main',\n  ...props\n}: SidebarNavigationTitleProps) => {\n  return (\n    <SidebarTitleWrapper\n      data-selected={selected}\n      $type={type}\n      {...props}\n    >\n      <IconWrapper\n        icon={icon}\n        iconDir={iconDir}\n      >\n        {label}\n      </IconWrapper>\n    </SidebarTitleWrapper>\n  );\n};\nexport const SidebarTitleWrapper = styled.button<{\n  $collapsible?: boolean;\n  $type: 'main' | 'sqlSidebar';\n}>`\n  display: inline-flex;\n  align-items: center;\n  background: transparent;\n  border: none;\n  width: 100%;\n  width: -webkit-fill-available;\n  width: fill-available;\n  width: stretch;\n  white-space: nowrap;\n  overflow: hidden;\n  cursor: pointer;\n  ${({ theme, $collapsible = false, $type }) => `\n    padding: 0;\n    padding-left: ${$collapsible ? 0 : theme.click.image.sm.size.width};\n    font: ${theme.click.sidebar.navigation.title.typography.default};\n    color: ${theme.click.sidebar[$type].navigation.title.color.default};\n\n    &:hover {\n      font: ${theme.click.sidebar.navigation.title.typography.hover};\n      color: ${theme.click.sidebar[$type].navigation.title.color.hover};\n    }\n\n    &:active, &[data-state=\"open\"], &[data-selected=\"true\"] {\n      font: ${theme.click.sidebar.navigation.title.typography.active};\n      color: ${theme.click.sidebar[$type].navigation.title.color.active};\n    }\n  `}\n\n  a {\n    color: inherit;\n    text-decoration: none;\n\n    &:active {\n      color: inherit;\n    }\n  }\n`;\n"],"names":["SidebarNavigationTitle","label","icon","iconDir","selected","type","props","jsx","IconWrapper","SidebarTitleWrapper","styled","button","withConfig","componentId","theme","$collapsible","$type","click","image","sm","size","width","sidebar","navigation","title","typography","default","color","hover","active"],"mappings":";;;;;;;;AAIO,MAAMA,yBAAyBA,CAAC;AAAA,EACrCC,KAAAA;AAAAA,EACAC,IAAAA;AAAAA,EACAC,OAAAA;AAAAA,EACAC,QAAAA;AAAAA,EACAC,IAAAA,GAAO,MAAA;AAAA,EACP,GAAGC;AACwB,CAAA,KAAM;AACjC,EAAA,uBACEC,cAAA,CAAC,mBAAA,EAAA,EACC,eAAA,EAAeH,QAAAA,EACf,KAAA,EAAOC,IAAAA,EACP,GAAIC,KAAAA,EAEJ,QAAA,kBAAAC,cAAA,CAACC,uBAAA,EAAA,EACC,IAAA,EACA,OAAA,EAECP,iBACH,CAAA,EACF,CAAA;AAEJ;AACO,MAAMQ,mBAAAA,GAAsBC,uBAAAA,CAAOC,MAAAA,CAAMC,UAAAA,CAAA;AAAA,EAAAC,WAAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,yMAAA,EAAA,iEAAA,GAe5C,CAAC;AAAA,EAAEC,KAAAA;AAAAA,EAAOC,YAAAA,GAAe,KAAA;AAAA,EAAOC;AAAM,CAAA,KAAM;AAAA;AAAA,kBAAA,EAE5BD,eAAe,CAAA,GAAID,KAAAA,CAAMG,MAAMC,KAAAA,CAAMC,EAAAA,CAAGC,KAAKC,KAAK,CAAA;AAAA,UAAA,EAC1DP,MAAMG,KAAAA,CAAMK,OAAAA,CAAQC,UAAAA,CAAWC,KAAAA,CAAMC,WAAWC,OAAO,CAAA;AAAA,WAAA,EACtDZ,KAAAA,CAAMG,MAAMK,OAAAA,CAAQN,KAAK,EAAEO,UAAAA,CAAWC,KAAAA,CAAMG,MAAMD,OAAO,CAAA;;AAAA;AAAA,YAAA,EAGxDZ,MAAMG,KAAAA,CAAMK,OAAAA,CAAQC,UAAAA,CAAWC,KAAAA,CAAMC,WAAWG,KAAK,CAAA;AAAA,aAAA,EACpDd,KAAAA,CAAMG,MAAMK,OAAAA,CAAQN,KAAK,EAAEO,UAAAA,CAAWC,KAAAA,CAAMG,MAAMC,KAAK,CAAA;AAAA;;AAAA;AAAA,YAAA,EAIxDd,MAAMG,KAAAA,CAAMK,OAAAA,CAAQC,UAAAA,CAAWC,KAAAA,CAAMC,WAAWI,MAAM,CAAA;AAAA,aAAA,EACrDf,KAAAA,CAAMG,MAAMK,OAAAA,CAAQN,KAAK,EAAEO,UAAAA,CAAWC,KAAAA,CAAMG,MAAME,MAAM,CAAA;AAAA;AAAA,EAAA,CAEpE;;;;;"}

package/dist/cjs/components/Spacer/index.cjs

@@ -0,0 +1,19 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const styledComponents = require('styled-components');
+
+const CUISpacer = styledComponents.styled.div.withConfig({
+  componentId: "sc-1g6zovs-0"
+})(["background:transparent;display:flex;padding:", ";"], ({
+  theme,
+  $size = "md"
+}) => `${theme.click.spacer.horizontal.space.y[$size]} ${theme.click.spacer.horizontal.space.x.all}`);
+const Spacer = ({
+  size
+}) => /* @__PURE__ */ jsxRuntime.jsx(CUISpacer, { $size: size });
+
+exports.Spacer = Spacer;
+//# sourceMappingURL=index.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../../src/components/Spacer/Spacer.tsx"],"sourcesContent":["import { styled } from 'styled-components';\nimport { SpacerProps, SizeType } from './Spacer.types';\n\nconst CUISpacer = styled.div<{\n  $size?: SizeType;\n}>`\n  background: transparent;\n  display: flex;\n  padding: ${({ theme, $size = 'md' }) =>\n    `${theme.click.spacer.horizontal.space.y[$size]} ${theme.click.spacer.horizontal.space.x.all}`};\n`;\n\nexport const Spacer = ({ size }: SpacerProps) => <CUISpacer $size={size} />;\n"],"names":["CUISpacer","styled","div","withConfig","componentId","theme","$size","click","spacer","horizontal","space","y","x","all","Spacer","size","jsx"],"mappings":";;;;;;;AAGA,MAAMA,SAAAA,GAAYC,uBAAAA,CAAOC,GAAAA,CAAGC,UAAAA,CAAA;AAAA,EAAAC,WAAAA,EAAA;AAAA,CAAA,CAAA,CAAA,CAAA,8CAAA,EAAA,GAAA,GAKf,CAAC;AAAA,EAAEC,KAAAA;AAAAA,EAAOC,KAAAA,GAAQ;AAAK,CAAA,KAChC,GAAGD,KAAAA,CAAME,KAAAA,CAAMC,MAAAA,CAAOC,UAAAA,CAAWC,MAAMC,CAAAA,CAAEL,KAAK,CAAC,CAAA,CAAA,EAAID,MAAME,KAAAA,CAAMC,MAAAA,CAAOC,WAAWC,KAAAA,CAAME,CAAAA,CAAEC,GAAG,CAAA,CAAE,CAAA;AAG3F,MAAMC,SAASA,CAAC;AAAA,EAAEC;AAAkB,CAAA,qBAAMC,cAAA,CAAC,SAAA,EAAA,EAAU,KAAA,EAAOD,IAAAA,EAAK;;;;"}

package/dist/cjs/components/SplitButton/index.cjs

@@ -0,0 +1,161 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const react = require('react');
+const styledComponents = require('styled-components');
+const BaseButton = require('../Button/BaseButton.cjs');
+const IconWrapper = require('../IconWrapper/index.cjs');
+const Dropdown = require('../Dropdown/index.cjs');
+const Icon = require('../Icon/index.cjs');
+
+const SplitButton = ({
+  type = "primary",
+  disabled,
+  menu,
+  dir,
+  open,
+  defaultOpen,
+  onOpenChange,
+  modal,
+  side,
+  fillWidth,
+  children,
+  icon,
+  iconDir = "start",
+  ...props
+}) => {
+  const ref = react.useRef(null);
+  const [width, setWidth] = react.useState(0);
+  react.useEffect(() => {
+    const targetDiv = ref.current;
+    if (!targetDiv) {
+      return;
+    }
+    const resizeObserver = new ResizeObserver((entries) => {
+      for (const entry of entries) {
+        setWidth(entry.target.clientWidth);
+      }
+    });
+    resizeObserver.observe(targetDiv);
+    return () => {
+      resizeObserver.unobserve(targetDiv);
+    };
+  }, []);
+  return /* @__PURE__ */ jsxRuntime.jsxs(Dropdown.Dropdown, { dir, open, defaultOpen, onOpenChange, modal, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(SplitButtonTrigger, { $disabled: disabled, $fillWidth: fillWidth, ref, $type: type, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(PrimaryButton, { disabled, $type: type, $fillWidth: fillWidth, ...props, children: /* @__PURE__ */ jsxRuntime.jsx(ButtonData, { as: IconWrapper.IconWrapper, icon, iconDir, children }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(SecondaryButton, { as: Dropdown.Dropdown.Trigger, disabled, $type: type, asChild: true, "data-testid": "split-button-dropdown", children: /* @__PURE__ */ jsxRuntime.jsx("span", { children: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { name: "chevron-down", size: "sm" }) }) })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(DropdownContent, { as: Dropdown.Dropdown.Content, side, $width: width, sideOffset: 4, align: "end", children: menu.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(MenuContentItem, { parentKey: `split-menu-option-${index}`, ...item }, `split-menu-option-${index}`)) })
+  ] });
+};
+const DropdownContent = styledComponents.styled.div.withConfig({
+  componentId: "sc-3eqh4s-0"
+})(["min-width:", "px;"], ({
+  $width
+}) => $width);
+const MenuContentItem = ({
+  items = [],
+  type = "item",
+  label,
+  icon,
+  iconDir = "start",
+  parentKey,
+  ...props
+}) => {
+  if (type === "item") {
+    return /* @__PURE__ */ jsxRuntime.jsx(Dropdown.Dropdown.Item, { ...props, children: /* @__PURE__ */ jsxRuntime.jsx(IconWrapper.IconWrapper, { icon, iconDir, children: label }) });
+  }
+  if (type === "group") {
+    return /* @__PURE__ */ jsxRuntime.jsx(Dropdown.Dropdown.Group, { children: items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(MenuContentItem, { parentKey: `${parentKey}-group-${index}`, ...item }, `${parentKey}-group-${index}`)) });
+  }
+  if (type === "sub-menu") {
+    return /* @__PURE__ */ jsxRuntime.jsxs(Dropdown.Dropdown.Sub, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Dropdown.Dropdown.Trigger, { sub: true, ...props, children: /* @__PURE__ */ jsxRuntime.jsx(IconWrapper.IconWrapper, { icon, iconDir, children: label }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(Dropdown.Dropdown.Content, { sub: true, children: items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(MenuContentItem, { parentKey: `${parentKey}-sub-menu-${index}`, ...item }, `${parentKey}-sub-menu-${index}`)) })
+    ] });
+  }
+};
+const SplitButtonTrigger = styledComponents.styled.div.withConfig({
+  componentId: "sc-3eqh4s-1"
+})(["display:inline-flex;align-items:center;overflow:hidden;user-select:none;", ""], ({
+  theme,
+  $disabled = false,
+  $type,
+  $fillWidth
+}) => `
+    width: ${$fillWidth ? "100%" : "revert"};
+    border-radius: ${theme.click.button.radii.all};
+    border: 1px solid ${theme.click.button.split[$type].stroke.default};
+    ${$disabled ? `
+          cursor: not-allowed;
+          border-color: ${theme.click.button.split[$type].stroke.disabled};
+        ` : `
+          &:hover {
+            border-color: ${theme.click.button.split[$type].stroke.hover};
+          }
+          &:focus-within {
+            border-color: ${theme.click.button.split[$type].stroke.active};
+          }
+        `}
+  `);
+const PrimaryButton = styledComponents.styled(BaseButton.BaseButton).withConfig({
+  componentId: "sc-3eqh4s-2"
+})(["border:none;align-self:stretch;border-radius:0;align-items:center;padding:", ";", ""], ({
+  theme
+}) => `${theme.click.button.split.space.y} ${theme.click.button.split.space.x}`, ({
+  theme,
+  $type,
+  $fillWidth
+}) => `
+    width: ${$fillWidth ? "100%" : "revert"};
+    justify-content: center;
+    background: ${theme.click.button.split[$type].background.main.default};
+    color: ${theme.click.button.split[$type].text.default};
+    font: ${theme.click.button.split.typography.label.default};
+    &:hover {
+      background: ${theme.click.button.split[$type].background.main.hover};
+      color: ${theme.click.button.split[$type].text.hover};
+      font: ${theme.click.button.split.typography.label.hover};
+    }
+    &:focus {
+      background: ${theme.click.button.split[$type].background.main.active};
+      color: ${theme.click.button.split[$type].text.active};
+      font: ${theme.click.button.split.typography.label.active};
+    }
+    &:disabled {
+      background: ${theme.click.button.split[$type].background.main.disabled};
+      color: ${theme.click.button.split[$type].text.disabled};
+      font: ${theme.click.button.split.typography.label.disabled};
+    }
+  `);
+const SecondaryButton = styledComponents.styled(BaseButton.BaseButton).withConfig({
+  componentId: "sc-3eqh4s-3"
+})(["border:none;align-self:stretch;border-radius:0;", ""], ({
+  theme,
+  $type
+}) => `
+    padding: ${theme.click.button.split.icon.space.y} ${theme.click.button.split.icon.space.x};
+    background: ${theme.click.button.split[$type].background.action.default};
+    color: ${theme.click.button.split[$type].text.default};
+    &:hover {
+      background: ${theme.click.button.split[$type].background.action.hover};
+      color: ${theme.click.button.split[$type].text.hover};
+    }
+    &:focus {
+      background: ${theme.click.button.split[$type].background.action.active};
+      color: ${theme.click.button.split[$type].text.active};
+    }
+    &[data-disabled] {
+      background: ${theme.click.button.split[$type].background.action.disabled};
+      color: ${theme.click.button.split[$type].text.disabled};
+    }
+  `);
+const ButtonData = styledComponents.styled.div.withConfig({
+  componentId: "sc-3eqh4s-4"
+})(["width:auto;"]);
+
+exports.SplitButton = SplitButton;
+//# sourceMappingURL=index.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../../src/components/SplitButton/SplitButton.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport { styled } from 'styled-components';\nimport { Dropdown } from '@/components/Dropdown';\nimport { BaseButton } from '@/components/Button/BaseButton';\nimport { IconWrapper } from '@/components/IconWrapper';\nimport { Icon } from '@/components/Icon';\nimport { SplitButtonProps, Menu, ButtonType } from './SplitButton.types';\n\nexport const SplitButton = ({\n  type = 'primary',\n  disabled,\n  menu,\n  dir,\n  open,\n  defaultOpen,\n  onOpenChange,\n  modal,\n  side,\n  fillWidth,\n  children,\n  icon,\n  iconDir = 'start',\n  ...props\n}: SplitButtonProps) => {\n  const ref = useRef<HTMLDivElement>(null);\n  const [width, setWidth] = useState(0);\n\n  useEffect(() => {\n    const targetDiv = ref.current;\n    if (!targetDiv) {\n      return;\n    }\n\n    const resizeObserver = new ResizeObserver(entries => {\n      for (const entry of entries) {\n        setWidth(entry.target.clientWidth);\n      }\n    });\n\n    resizeObserver.observe(targetDiv);\n\n    return () => {\n      resizeObserver.unobserve(targetDiv);\n    };\n  }, []);\n\n  return (\n    <Dropdown\n      dir={dir}\n      open={open}\n      defaultOpen={defaultOpen}\n      onOpenChange={onOpenChange}\n      modal={modal}\n    >\n      <SplitButtonTrigger\n        $disabled={disabled}\n        $fillWidth={fillWidth}\n        ref={ref}\n        $type={type}\n      >\n        <PrimaryButton\n          disabled={disabled}\n          $type={type}\n          $fillWidth={fillWidth}\n          {...props}\n        >\n          <ButtonData\n            as={IconWrapper}\n            icon={icon}\n            iconDir={iconDir}\n          >\n            {children}\n          </ButtonData>\n        </PrimaryButton>\n        <SecondaryButton\n          as={Dropdown.Trigger}\n          disabled={disabled}\n          $type={type}\n          asChild\n          data-testid=\"split-button-dropdown\"\n        >\n          <span>\n            <Icon\n              name=\"chevron-down\"\n              size=\"sm\"\n            />\n          </span>\n        </SecondaryButton>\n      </SplitButtonTrigger>\n      <DropdownContent\n        as={Dropdown.Content}\n        side={side}\n        $width={width}\n        sideOffset={4}\n        align=\"end\"\n      >\n        {menu.map((item: Menu, index: number) => (\n          <MenuContentItem\n            key={`split-menu-option-${index}`}\n            parentKey={`split-menu-option-${index}`}\n            {...item}\n          />\n        ))}\n      </DropdownContent>\n    </Dropdown>\n  );\n};\n\nconst DropdownContent = styled.div<{ $width: number }>`\n  min-width: ${({ $width }) => $width}px;\n`;\n\nconst MenuContentItem = ({\n  items = [],\n  type = 'item',\n  label,\n  icon,\n  iconDir = 'start',\n  parentKey,\n  ...props\n}: Menu & { parentKey: string }) => {\n  if (type === 'item') {\n    return (\n      <Dropdown.Item {...props}>\n        <IconWrapper\n          icon={icon}\n          iconDir={iconDir}\n        >\n          {label}\n        </IconWrapper>\n      </Dropdown.Item>\n    );\n  }\n  if (type === 'group') {\n    return (\n      <Dropdown.Group>\n        {items.map((item, index) => (\n          <MenuContentItem\n            key={`${parentKey}-group-${index}`}\n            parentKey={`${parentKey}-group-${index}`}\n            {...item}\n          />\n        ))}\n      </Dropdown.Group>\n    );\n  }\n  if (type === 'sub-menu') {\n    return (\n      <Dropdown.Sub>\n        <Dropdown.Trigger\n          sub\n          {...props}\n        >\n          <IconWrapper\n            icon={icon}\n            iconDir={iconDir}\n          >\n            {label}\n          </IconWrapper>\n        </Dropdown.Trigger>\n        <Dropdown.Content sub>\n          {items.map((item, index) => (\n            <MenuContentItem\n              key={`${parentKey}-sub-menu-${index}`}\n              parentKey={`${parentKey}-sub-menu-${index}`}\n              {...item}\n            />\n          ))}\n        </Dropdown.Content>\n      </Dropdown.Sub>\n    );\n  }\n};\n\nconst SplitButtonTrigger = styled.div<{\n  $disabled?: boolean;\n  $type: ButtonType;\n  $fillWidth?: boolean;\n}>`\n  display: inline-flex;\n  align-items: center;\n  overflow: hidden;\n  user-select: none;\n  ${({ theme, $disabled = false, $type, $fillWidth }) => `\n    width: ${$fillWidth ? '100%' : 'revert'};\n    border-radius: ${theme.click.button.radii.all};\n    border: 1px solid ${theme.click.button.split[$type].stroke.default};\n    ${\n      $disabled\n        ? `\n          cursor: not-allowed;\n          border-color: ${theme.click.button.split[$type].stroke.disabled};\n        `\n        : `\n          &:hover {\n            border-color: ${theme.click.button.split[$type].stroke.hover};\n          }\n          &:focus-within {\n            border-color: ${theme.click.button.split[$type].stroke.active};\n          }\n        `\n    }\n  `}\n`;\n\nconst PrimaryButton = styled(BaseButton)<{\n  $type: ButtonType;\n  $fillWidth?: boolean;\n}>`\n  border: none;\n  align-self: stretch;\n  border-radius: 0;\n  align-items: center;\n  padding: ${({ theme }) =>\n    `${theme.click.button.split.space.y} ${theme.click.button.split.space.x}`};\n  ${({ theme, $type, $fillWidth }) => `\n    width: ${$fillWidth ? '100%' : 'revert'};\n    justify-content: center;\n    background: ${theme.click.button.split[$type].background.main.default};\n    color: ${theme.click.button.split[$type].text.default};\n    font: ${theme.click.button.split.typography.label.default};\n    &:hover {\n      background: ${theme.click.button.split[$type].background.main.hover};\n      color: ${theme.click.button.split[$type].text.hover};\n      font: ${theme.click.button.split.typography.label.hover};\n    }\n    &:focus {\n      background: ${theme.click.button.split[$type].background.main.active};\n      color: ${theme.click.button.split[$type].text.active};\n      font: ${theme.click.button.split.typography.label.active};\n    }\n    &:disabled {\n      background: ${theme.click.button.split[$type].background.main.disabled};\n      color: ${theme.click.button.split[$type].text.disabled};\n      font: ${theme.click.button.split.typography.label.disabled};\n    }\n  `}\n`;\n\nconst SecondaryButton = styled(BaseButton)<{ $type: ButtonType }>`\n  border: none;\n  align-self: stretch;\n  border-radius: 0;\n  ${({ theme, $type }) => `\n    padding: ${theme.click.button.split.icon.space.y} ${theme.click.button.split.icon.space.x};\n    background: ${theme.click.button.split[$type].background.action.default};\n    color: ${theme.click.button.split[$type].text.default};\n    &:hover {\n      background: ${theme.click.button.split[$type].background.action.hover};\n      color: ${theme.click.button.split[$type].text.hover};\n    }\n    &:focus {\n      background: ${theme.click.button.split[$type].background.action.active};\n      color: ${theme.click.button.split[$type].text.active};\n    }\n    &[data-disabled] {\n      background: ${theme.click.button.split[$type].background.action.disabled};\n      color: ${theme.click.button.split[$type].text.disabled};\n    }\n  `}\n`;\n\nconst ButtonData = styled.div`\n  width: auto;\n`;\n"],"names":["SplitButton","type","disabled","menu","dir","open","defaultOpen","onOpenChange","modal","side","fillWidth","children","icon","iconDir","props","ref","useRef","width","setWidth","useState","useEffect","targetDiv","current","resizeObserver","ResizeObserver","entries","entry","target","clientWidth","observe","unobserve","Dropdown","jsxs","jsx","IconWrapper","Trigger","Icon","Content","map","item","index","DropdownContent","styled","div","withConfig","componentId","$width","MenuContentItem","items","label","parentKey","SplitButtonTrigger","theme","$disabled","$type","$fillWidth","click","button","radii","all","split","stroke","default","hover","active","PrimaryButton","BaseButton","space","y","x","background","main","text","typography","SecondaryButton","action","ButtonData"],"mappings":"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"}

package/dist/cjs/components/Switch/index.cjs

@@ -0,0 +1,115 @@
+'use strict';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+
+const jsxRuntime = require('react/jsx-runtime');
+const RadixSwitch = require('@radix-ui/react-switch');
+const react = require('react');
+const styledComponents = require('styled-components');
+const GenericLabel = require('../GenericLabel/index.cjs');
+const FormRoot = require('../FormContainer/FormRoot.cjs');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
+  if (e) {
+    for (const k in e) {
+      if (k !== 'default') {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+const RadixSwitch__namespace = /*#__PURE__*/_interopNamespace(RadixSwitch);
+
+const Wrapper = styledComponents.styled(FormRoot.FormRoot).withConfig({
+  componentId: "sc-1326402-0"
+})(["align-items:center;max-width:fit-content;"]);
+const Switch = react.forwardRef(({
+  checked,
+  disabled,
+  orientation,
+  dir,
+  label,
+  id,
+  ...props
+}, ref) => {
+  const defaultId = react.useId();
+  return /* @__PURE__ */ jsxRuntime.jsxs(Wrapper, { $orientation: orientation, $dir: dir, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(SwitchRoot, { ref, id: id ?? defaultId, disabled, "aria-label": `${label}`, checked, ...props, children: /* @__PURE__ */ jsxRuntime.jsx(SwitchThumb, { $checked: checked, $disabled: disabled }) }),
+    label && /* @__PURE__ */ jsxRuntime.jsx(GenericLabel.GenericLabel, { htmlFor: id ?? defaultId, disabled, children: label })
+  ] });
+});
+const getRootVars = (theme, disabled, checked) => {
+  if (disabled) {
+    return {
+      backgroundColor: theme.click.switch.color.background.disabled,
+      border: `1px solid ${theme.click.switch.color.stroke.disabled}`
+    };
+  } else if (checked) {
+    return {
+      backgroundColor: theme.click.switch.color.background.active,
+      border: `1px solid ${theme.click.switch.color.stroke.active}`
+    };
+  } else {
+    return {
+      backgroundColor: theme.click.switch.color.background.default,
+      border: `1px solid ${theme.click.switch.color.stroke.default}`
+    };
+  }
+};
+const getThumbVars = (theme, disabled, checked) => {
+  if (disabled) {
+    return {
+      backgroundColor: theme.click.switch.color.indicator.disabled
+    };
+  } else if (checked) {
+    return {
+      backgroundColor: theme.click.switch.color.indicator.active
+    };
+  } else {
+    return {
+      backgroundColor: theme.click.switch.color.indicator.default
+    };
+  }
+};
+const SwitchRoot = styledComponents.styled(RadixSwitch__namespace.Root).withConfig({
+  componentId: "sc-1326402-1"
+})((props) => {
+  const vars = getRootVars(props.theme, props.disabled ?? false, props.checked ?? false);
+  return {
+    width: props.theme.click.switch.size.width,
+    height: props.theme.click.switch.size.height,
+    backgroundColor: vars.backgroundColor,
+    border: vars.border,
+    borderRadius: props.theme.click.switch.radii.all,
+    position: "relative",
+    padding: 0,
+    cursor: props.disabled ? "not-allowed" : "pointer"
+  };
+});
+const SwitchThumb = styledComponents.styled(RadixSwitch__namespace.Thumb).withConfig({
+  componentId: "sc-1326402-2"
+})((props) => {
+  const vars = getThumbVars(props.theme, props.$disabled, props.$checked);
+  return {
+    display: "block",
+    width: "12px",
+    height: "12px",
+    backgroundColor: vars.backgroundColor,
+    borderRadius: props.theme.click.switch.radii.all,
+    transition: "transform 100ms",
+    transform: props.$checked ? "translateX(15px)" : "translateX(2px)",
+    willChange: "transform"
+  };
+});
+
+exports.Switch = Switch;
+//# sourceMappingURL=index.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import * as RadixSwitch from '@radix-ui/react-switch';\nimport { forwardRef, useId } from 'react';\nimport { styled } from 'styled-components';\nimport { FormRoot } from '@/components/FormContainer';\nimport { GenericLabel } from '@/components/GenericLabel';\nimport { SwitchProps } from './Switch.types';\nimport type { Theme } from '@/theme/theme.types';\n\ninterface ThumbProps {\n  $checked: boolean;\n  $disabled?: boolean;\n}\n\nconst Wrapper = styled(FormRoot)`\n  align-items: center;\n  max-width: fit-content;\n`;\n\nexport const Switch = forwardRef<HTMLButtonElement, SwitchProps>(\n  ({ checked, disabled, orientation, dir, label, id, ...props }, ref) => {\n    const defaultId = useId();\n    return (\n      <Wrapper\n        $orientation={orientation}\n        $dir={dir}\n      >\n        <SwitchRoot\n          ref={ref}\n          id={id ?? defaultId}\n          disabled={disabled}\n          aria-label={`${label}`}\n          checked={checked}\n          {...props}\n        >\n          <SwitchThumb\n            $checked={checked}\n            $disabled={disabled}\n          />\n        </SwitchRoot>\n        {label && (\n          <GenericLabel\n            htmlFor={id ?? defaultId}\n            disabled={disabled}\n          >\n            {label}\n          </GenericLabel>\n        )}\n      </Wrapper>\n    );\n  }\n);\n\nconst getRootVars = (theme: Theme, disabled: boolean | undefined, checked: boolean) => {\n  if (disabled) {\n    return {\n      backgroundColor: theme.click.switch.color.background.disabled,\n      border: `1px solid ${theme.click.switch.color.stroke.disabled}`,\n    };\n  } else if (checked) {\n    return {\n      backgroundColor: theme.click.switch.color.background.active,\n      border: `1px solid ${theme.click.switch.color.stroke.active}`,\n    };\n  } else {\n    return {\n      backgroundColor: theme.click.switch.color.background.default,\n      border: `1px solid ${theme.click.switch.color.stroke.default}`,\n    };\n  }\n};\n\nconst getThumbVars = (theme: Theme, disabled: boolean | undefined, checked: boolean) => {\n  if (disabled) {\n    return {\n      backgroundColor: theme.click.switch.color.indicator.disabled,\n    };\n  } else if (checked) {\n    return {\n      backgroundColor: theme.click.switch.color.indicator.active,\n    };\n  } else {\n    return {\n      backgroundColor: theme.click.switch.color.indicator.default,\n    };\n  }\n};\n\nconst SwitchRoot = styled(RadixSwitch.Root)(props => {\n  const vars = getRootVars(props.theme, props.disabled ?? false, props.checked ?? false);\n\n  return {\n    width: props.theme.click.switch.size.width,\n    height: props.theme.click.switch.size.height,\n    backgroundColor: vars.backgroundColor,\n    border: vars.border,\n    borderRadius: props.theme.click.switch.radii.all,\n    position: 'relative',\n    padding: 0,\n    cursor: props.disabled ? 'not-allowed' : 'pointer',\n  };\n});\n\nconst SwitchThumb = styled(RadixSwitch.Thumb)<ThumbProps>(props => {\n  const vars = getThumbVars(props.theme, props.$disabled, props.$checked);\n\n  return {\n    display: 'block',\n    width: '12px',\n    height: '12px',\n    backgroundColor: vars.backgroundColor,\n    borderRadius: props.theme.click.switch.radii.all,\n    transition: 'transform 100ms',\n    transform: props.$checked ? 'translateX(15px)' : 'translateX(2px)',\n    willChange: 'transform',\n  };\n});\n"],"names":["Wrapper","styled","FormRoot","withConfig","componentId","Switch","forwardRef","checked","disabled","orientation","dir","label","id","props","ref","defaultId","useId","jsxs","jsx","GenericLabel","getRootVars","theme","backgroundColor","click","switch","color","background","border","stroke","active","default","getThumbVars","indicator","SwitchRoot","RadixSwitch","Root","vars","width","size","height","borderRadius","radii","all","position","padding","cursor","SwitchThumb","Thumb","$disabled","$checked","display","transition","transform","willChange"],"mappings":"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"}