@caseparts-org/caseblocks 0.0.164 → 0.0.165

package/dist/assets/ToggleSwitch.css

@@ -0,0 +1 @@
+._wrapper_1p695_1{display:inline-flex;flex-direction:row;align-items:center;gap:var(--spacing-spacing-2xs);cursor:pointer}._disabled_1p695_9{cursor:not-allowed}._switch_1p695_17{position:relative;display:inline-flex}._input_1p695_22{position:absolute;width:1px;height:1px;margin:0;opacity:0;pointer-events:none}._track_1p695_31{width:2.5rem;height:1.5rem;padding:2px;border-radius:999px;border:1px solid var(--border-border-primary);background-color:var(--surface-surface-secondary);transition:background-color .12s ease,border-color .12s ease}._thumb_1p695_41{display:block;width:1.1rem;height:1.1rem;border-radius:999px;background-color:var(--surface-surface-primary);box-shadow:0 1px 2px #0003;transition:transform .12s ease}._input_1p695_22:checked+._track_1p695_31{background-color:var(--surface-surface-primary-btn);border-color:var(--surface-surface-primary-btn)}._input_1p695_22:checked+._track_1p695_31 ._thumb_1p695_41{transform:translate(1rem)}._input_1p695_22:focus-visible+._track_1p695_31{outline:2px solid var(--border-border-focus);outline-offset:2px}._input_1p695_22:disabled+._track_1p695_31{background-color:var(--surface-surface-disabled-btn-focus);border-color:var(--surface-surface-disabled-btn)}._input_1p695_22:disabled+._track_1p695_31 ._thumb_1p695_41{background-color:var(--surface-surface-disabled-btn)}

package/dist/atoms/ToggleSwitch/ToggleSwitch.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+import { HideAtProps } from '../HideAt';
+import { TextSize } from '../Text/Text';
+export interface ToggleSwitchProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "type">, HideAtProps {
+    label?: string | React.ReactNode;
+    labelAlignment?: "left" | "right";
+    labelSize?: TextSize;
+}
+export declare function ToggleSwitch({ label, labelAlignment, hideAt, className, id, name, disabled, labelSize, ...otherProps }: ToggleSwitchProps): import("react/jsx-runtime").JSX.Element;

package/dist/atoms/ToggleSwitch/ToggleSwitch.js

@@ -0,0 +1,60 @@
+import { jsxs as i, jsx as s } from "react/jsx-runtime";
+import { c as d } from "../../clsx-OuTLNxxd.js";
+import { getHideAtStyles as u } from "../HideAt.js";
+import { Text as b } from "../Text/Text.js";
+import '../../assets/ToggleSwitch.css';const w = "_wrapper_1p695_1", f = "_disabled_1p695_9", N = "_label_1p695_13", x = "_input_1p695_22", k = "_track_1p695_31", g = "_thumb_1p695_41", t = {
+  wrapper: w,
+  disabled: f,
+  label: N,
+  switch: "_switch_1p695_17",
+  input: x,
+  track: k,
+  thumb: g
+};
+function z({
+  label: e,
+  labelAlignment: c = "left",
+  hideAt: n,
+  className: o,
+  id: _,
+  name: a,
+  disabled: r,
+  labelSize: m = "sm",
+  ...h
+}) {
+  const l = _ ?? a, p = e ? /* @__PURE__ */ s(b, { size: m, className: t.label, children: e }) : null;
+  return /* @__PURE__ */ i(
+    "label",
+    {
+      htmlFor: l,
+      className: d(
+        t.wrapper,
+        r && t.disabled,
+        u(n),
+        o
+      ),
+      children: [
+        c === "left" && p,
+        /* @__PURE__ */ i("span", { className: t.switch, children: [
+          /* @__PURE__ */ s(
+            "input",
+            {
+              id: l,
+              name: a,
+              type: "checkbox",
+              role: "switch",
+              disabled: r,
+              className: t.input,
+              ...h
+            }
+          ),
+          /* @__PURE__ */ s("span", { className: t.track, "aria-hidden": "true", children: /* @__PURE__ */ s("span", { className: t.thumb }) })
+        ] }),
+        c === "right" && p
+      ]
+    }
+  );
+}
+export {
+  z as ToggleSwitch
+};

package/dist/atoms/ToggleSwitch/ToggleSwitch.stories.d.ts

@@ -0,0 +1,22 @@
+import { StoryObj } from '@storybook/react-vite';
+import { ToggleSwitch } from './ToggleSwitch';
+declare const meta: {
+    title: string;
+    component: typeof ToggleSwitch;
+    parameters: {
+        layout: string;
+    };
+    argTypes: {
+        label: {
+            control: "text";
+        };
+    };
+    tags: string[];
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const Checked: Story;
+export declare const WithLabel: Story;
+export declare const WithRightLabel: Story;
+export declare const Disabled: Story;

package/dist/atoms/ToggleSwitch/ToggleSwitch.stories.js

@@ -0,0 +1,48 @@
+import { ToggleSwitch as e } from "./ToggleSwitch.js";
+const t = {
+  title: "Case Parts/Atoms/ToggleSwitch",
+  component: e,
+  parameters: {
+    layout: "centered"
+  },
+  argTypes: {
+    label: {
+      control: "text"
+    }
+  },
+  tags: ["autodocs"]
+}, r = {
+  args: {
+    "aria-label": "Save card"
+  }
+}, l = {
+  args: {
+    "aria-label": "Save card",
+    defaultChecked: !0
+  }
+}, s = {
+  args: {
+    label: "Save for future purchases",
+    defaultChecked: !0
+  }
+}, c = {
+  args: {
+    label: "Save for future purchases",
+    labelAlignment: "right",
+    defaultChecked: !0
+  }
+}, o = {
+  args: {
+    label: "Save for future purchases",
+    disabled: !0,
+    defaultChecked: !0
+  }
+};
+export {
+  l as Checked,
+  r as Default,
+  o as Disabled,
+  s as WithLabel,
+  c as WithRightLabel,
+  t as default
+};

package/dist/main-client.js

@@ -1,106 +1,108 @@
 import { Button as e } from "./atoms/Button/Button.js";
 import { Flex as p } from "./atoms/Flex/Flex.js";
 import { Column as f, Grid as x } from "./atoms/Grid/Grid.js";
-import { Head as n } from "./atoms/Root/Head.js";
+import { Head as i } from "./atoms/Root/Head.js";
 import { Icon as l } from "./atoms/Icon/Icon.js";
 import { Root as u } from "./atoms/Root/Root.js";
 import { Separator as s } from "./atoms/Separator/Separator.js";
-import { Text as k } from "./atoms/Text/Text.js";
+import { Text as C } from "./atoms/Text/Text.js";
 import { Input as S } from "./atoms/Input/Input.js";
-import { Link as I } from "./atoms/Link/Link.js";
-import { linkClassName as A } from "./atoms/Link/linkClassName.js";
-import { configureLink as M, routerOverride as T } from "./atoms/Link/configureLink.js";
-import { LinkButton as L } from "./atoms/LinkButton/LinkButton.js";
-import { configureImage as b } from "./atoms/Image/configureImage.js";
-import { getHideAtStyles as F } from "./atoms/HideAt.js";
-import { Logo as N } from "./molecules/Logo/Logo.js";
-import { SearchBox as z } from "./molecules/SearchBox/SearchBox.js";
-import { QuantityInput as E } from "./molecules/QuantityInput/QuantityInput.js";
-import { Pricing as O } from "./molecules/Pricing/Pricing.js";
-import { Availability as R } from "./molecules/Availability/Availability.js";
-import { Avatar as j } from "./molecules/Avatar/Avatar.js";
-import { BannerCard as J } from "./molecules/BannerCard/BannerCard.js";
-import { CardLink as U } from "./molecules/CardLink/CardLink.js";
-import { Breadcrumbs as X } from "./molecules/Breadcrumbs/Breadcrumbs.js";
-import { Disclaimer as _ } from "./molecules/Disclaimer/Disclaimer.js";
-import { NotFound as rr } from "./organisms/NotFound/NotFound.js";
-import { HorizontalScroll as er } from "./atoms/HorizontalScroll/HorizontalScroll.js";
-import { SlideInPanel as pr } from "./atoms/SlideInPanel/SlideInPanel.js";
-import { Markdown as fr } from "./atoms/Markdown/Markdown.js";
-import { PreprocessedMarkdown as ar } from "./atoms/Markdown/PreprocessedMarkdown.js";
-import { usePreprocessedMarkdown as ir } from "./atoms/Markdown/usePreprocessedMarkdown.js";
-import { Tooltip as dr } from "./atoms/Tooltip/Tooltip.js";
-import { Popover as cr } from "./atoms/Popover/Popover.js";
-import { Account as Cr } from "./molecules/Account/Account.js";
-import { Chip as gr } from "./molecules/Chip/Chip.js";
-import { ToggleView as Pr } from "./molecules/ToggleView/ToggleView.js";
-import { CartPart as wr } from "./molecules/Cart/CartPart.js";
-import { CartSlideInPanel as Br } from "./molecules/Cart/CartSlideInPanel.js";
-import { StatefulButton as Tr } from "./molecules/StatefulButton/StatefulButton.js";
-import { AnimatedCheckMark as Lr } from "./molecules/StatefulButton/AnimatedCheckmark.js";
-import { AddToCart as br } from "./molecules/AddToCart/AddToCart.js";
-import { Modal as Fr } from "./molecules/Modal/Modal.js";
-import { ImageViewer as Nr } from "./molecules/ImageViewer/ImageViewer.js";
-import { T as zr } from "./Table-BX4PtCNE.js";
-import { Error as Er } from "./molecules/Error/Error.js";
-import { MainNav as Or } from "./organisms/MainNav/MainNav.js";
-import { ChipSelector as Rr } from "./organisms/ChipSelector/ChipSelector.js";
-import { Product as jr } from "./organisms/Product/Product.js";
-import { Carousel as Jr } from "./organisms/Carousel/Carousel.js";
-import { Footer as Ur } from "./organisms/Footer/Footer.js";
-import { default as Xr } from "./organisms/SpinZoomViewer/SpinZoomViewer.js";
+import { ToggleSwitch as w } from "./atoms/ToggleSwitch/ToggleSwitch.js";
+import { Link as T } from "./atoms/Link/Link.js";
+import { linkClassName as B } from "./atoms/Link/linkClassName.js";
+import { configureLink as h, routerOverride as v } from "./atoms/Link/configureLink.js";
+import { LinkButton as b } from "./atoms/LinkButton/LinkButton.js";
+import { configureImage as F } from "./atoms/Image/configureImage.js";
+import { getHideAtStyles as N } from "./atoms/HideAt.js";
+import { Logo as z } from "./molecules/Logo/Logo.js";
+import { SearchBox as E } from "./molecules/SearchBox/SearchBox.js";
+import { QuantityInput as O } from "./molecules/QuantityInput/QuantityInput.js";
+import { Pricing as R } from "./molecules/Pricing/Pricing.js";
+import { Availability as j } from "./molecules/Availability/Availability.js";
+import { Avatar as J } from "./molecules/Avatar/Avatar.js";
+import { BannerCard as U } from "./molecules/BannerCard/BannerCard.js";
+import { CardLink as X } from "./molecules/CardLink/CardLink.js";
+import { Breadcrumbs as _ } from "./molecules/Breadcrumbs/Breadcrumbs.js";
+import { Disclaimer as rr } from "./molecules/Disclaimer/Disclaimer.js";
+import { NotFound as er } from "./organisms/NotFound/NotFound.js";
+import { HorizontalScroll as pr } from "./atoms/HorizontalScroll/HorizontalScroll.js";
+import { SlideInPanel as fr } from "./atoms/SlideInPanel/SlideInPanel.js";
+import { Markdown as ar } from "./atoms/Markdown/Markdown.js";
+import { PreprocessedMarkdown as nr } from "./atoms/Markdown/PreprocessedMarkdown.js";
+import { usePreprocessedMarkdown as dr } from "./atoms/Markdown/usePreprocessedMarkdown.js";
+import { Tooltip as cr } from "./atoms/Tooltip/Tooltip.js";
+import { Popover as gr } from "./atoms/Popover/Popover.js";
+import { Account as kr } from "./molecules/Account/Account.js";
+import { Chip as Pr } from "./molecules/Chip/Chip.js";
+import { ToggleView as Ir } from "./molecules/ToggleView/ToggleView.js";
+import { CartPart as Ar } from "./molecules/Cart/CartPart.js";
+import { CartSlideInPanel as Mr } from "./molecules/Cart/CartSlideInPanel.js";
+import { StatefulButton as vr } from "./molecules/StatefulButton/StatefulButton.js";
+import { AnimatedCheckMark as br } from "./molecules/StatefulButton/AnimatedCheckmark.js";
+import { AddToCart as Fr } from "./molecules/AddToCart/AddToCart.js";
+import { Modal as Nr } from "./molecules/Modal/Modal.js";
+import { ImageViewer as zr } from "./molecules/ImageViewer/ImageViewer.js";
+import { T as Er } from "./Table-BX4PtCNE.js";
+import { Error as Or } from "./molecules/Error/Error.js";
+import { MainNav as Rr } from "./organisms/MainNav/MainNav.js";
+import { ChipSelector as jr } from "./organisms/ChipSelector/ChipSelector.js";
+import { Product as Jr } from "./organisms/Product/Product.js";
+import { Carousel as Ur } from "./organisms/Carousel/Carousel.js";
+import { Footer as Xr } from "./organisms/Footer/Footer.js";
+import { default as _r } from "./organisms/SpinZoomViewer/SpinZoomViewer.js";
 export {
-  Cr as Account,
-  br as AddToCart,
-  Lr as AnimatedCheckMark,
-  R as Availability,
-  j as Avatar,
-  J as BannerCard,
-  X as Breadcrumbs,
+  kr as Account,
+  Fr as AddToCart,
+  br as AnimatedCheckMark,
+  j as Availability,
+  J as Avatar,
+  U as BannerCard,
+  _ as Breadcrumbs,
   e as Button,
-  U as CardLink,
-  Jr as Carousel,
-  wr as CartPart,
-  Br as CartSlideInPanel,
-  gr as Chip,
-  Rr as ChipSelector,
+  X as CardLink,
+  Ur as Carousel,
+  Ar as CartPart,
+  Mr as CartSlideInPanel,
+  Pr as Chip,
+  jr as ChipSelector,
   f as Column,
-  _ as Disclaimer,
-  Er as Error,
+  rr as Disclaimer,
+  Or as Error,
   p as Flex,
-  Ur as Footer,
+  Xr as Footer,
   x as Grid,
-  n as Head,
-  er as HorizontalScroll,
+  i as Head,
+  pr as HorizontalScroll,
   l as Icon,
-  Nr as ImageViewer,
+  zr as ImageViewer,
   S as Input,
-  I as Link,
-  L as LinkButton,
-  N as Logo,
-  Or as MainNav,
-  fr as Markdown,
-  Fr as Modal,
-  rr as NotFound,
-  cr as Popover,
-  ar as PreprocessedMarkdown,
-  O as Pricing,
-  jr as Product,
-  E as QuantityInput,
+  T as Link,
+  b as LinkButton,
+  z as Logo,
+  Rr as MainNav,
+  ar as Markdown,
+  Nr as Modal,
+  er as NotFound,
+  gr as Popover,
+  nr as PreprocessedMarkdown,
+  R as Pricing,
+  Jr as Product,
+  O as QuantityInput,
   u as Root,
-  z as SearchBox,
+  E as SearchBox,
   s as Separator,
-  pr as SlideInPanel,
-  Xr as SpinZoomViewer,
-  Tr as StatefulButton,
-  zr as Table,
-  k as Text,
-  Pr as ToggleView,
-  dr as Tooltip,
-  b as configureImage,
-  M as configureLink,
-  F as getHideAtStyles,
-  A as linkClassName,
-  T as routerOverride,
-  ir as usePreprocessedMarkdown
+  fr as SlideInPanel,
+  _r as SpinZoomViewer,
+  vr as StatefulButton,
+  Er as Table,
+  C as Text,
+  w as ToggleSwitch,
+  Ir as ToggleView,
+  cr as Tooltip,
+  F as configureImage,
+  h as configureLink,
+  N as getHideAtStyles,
+  B as linkClassName,
+  v as routerOverride,
+  dr as usePreprocessedMarkdown
 };

package/dist/main-server.d.ts

@@ -14,6 +14,8 @@ export { Text } from './atoms/Text/Text';
 export type { TextProps } from './atoms/Text/Text';
 export { Input } from './atoms/Input/Input';
 export type { InputProps } from './atoms/Input/Input';
+export { ToggleSwitch } from './atoms/ToggleSwitch/ToggleSwitch';
+export type { ToggleSwitchProps } from './atoms/ToggleSwitch/ToggleSwitch';
 export { Link } from './atoms/Link/Link';
 export type { LinkProps, LinkImplementation as RouterLike } from './atoms/Link/Link';
 export { linkClassName } from './atoms/Link/linkClassName';

package/dist/main-server.js

@@ -3,54 +3,56 @@ import { Flex as m } from "./atoms/Flex/Flex.js";
 import { Column as x, Grid as f } from "./atoms/Grid/Grid.js";
 import { Head as n } from "./atoms/Root/Head.js";
 import { Icon as u } from "./atoms/Icon/Icon.js";
-import { Root as l } from "./atoms/Root/Root.js";
+import { Root as c } from "./atoms/Root/Root.js";
 import { Separator as g } from "./atoms/Separator/Separator.js";
 import { Text as s } from "./atoms/Text/Text.js";
 import { Input as L } from "./atoms/Input/Input.js";
-import { Link as I } from "./atoms/Link/Link.js";
-import { linkClassName as y } from "./atoms/Link/linkClassName.js";
-import { configureLink as S, routerOverride as b } from "./atoms/Link/configureLink.js";
-import { LinkButton as H } from "./atoms/LinkButton/LinkButton.js";
-import { configureImage as h } from "./atoms/Image/configureImage.js";
+import { ToggleSwitch as I } from "./atoms/ToggleSwitch/ToggleSwitch.js";
+import { Link as v } from "./atoms/Link/Link.js";
+import { linkClassName as A } from "./atoms/Link/linkClassName.js";
+import { configureLink as h, routerOverride as F } from "./atoms/Link/configureLink.js";
+import { LinkButton as N } from "./atoms/LinkButton/LinkButton.js";
+import { configureImage as w } from "./atoms/Image/configureImage.js";
 import { getHideAtStyles as G } from "./atoms/HideAt.js";
 import { Logo as P } from "./molecules/Logo/Logo.js";
 import { SearchBox as R } from "./molecules/SearchBox/SearchBox.js";
-import { QuantityInput as j } from "./molecules/QuantityInput/QuantityInput.js";
-import { Pricing as w } from "./molecules/Pricing/Pricing.js";
-import { Availability as E } from "./molecules/Availability/Availability.js";
-import { Avatar as K } from "./molecules/Avatar/Avatar.js";
-import { BannerCard as U } from "./molecules/BannerCard/BannerCard.js";
-import { CardLink as W } from "./molecules/CardLink/CardLink.js";
-import { Breadcrumbs as Y } from "./molecules/Breadcrumbs/Breadcrumbs.js";
-import { Disclaimer as _ } from "./molecules/Disclaimer/Disclaimer.js";
-import { NotFound as rr } from "./organisms/NotFound/NotFound.js";
+import { QuantityInput as q } from "./molecules/QuantityInput/QuantityInput.js";
+import { Pricing as E } from "./molecules/Pricing/Pricing.js";
+import { Availability as K } from "./molecules/Availability/Availability.js";
+import { Avatar as U } from "./molecules/Avatar/Avatar.js";
+import { BannerCard as W } from "./molecules/BannerCard/BannerCard.js";
+import { CardLink as Y } from "./molecules/CardLink/CardLink.js";
+import { Breadcrumbs as _ } from "./molecules/Breadcrumbs/Breadcrumbs.js";
+import { Disclaimer as rr } from "./molecules/Disclaimer/Disclaimer.js";
+import { NotFound as er } from "./organisms/NotFound/NotFound.js";
 export {
-  E as Availability,
-  K as Avatar,
-  U as BannerCard,
-  Y as Breadcrumbs,
+  K as Availability,
+  U as Avatar,
+  W as BannerCard,
+  _ as Breadcrumbs,
   e as Button,
-  W as CardLink,
+  Y as CardLink,
   x as Column,
-  _ as Disclaimer,
+  rr as Disclaimer,
   m as Flex,
   f as Grid,
   n as Head,
   u as Icon,
   L as Input,
-  I as Link,
-  H as LinkButton,
+  v as Link,
+  N as LinkButton,
   P as Logo,
-  rr as NotFound,
-  w as Pricing,
-  j as QuantityInput,
-  l as Root,
+  er as NotFound,
+  E as Pricing,
+  q as QuantityInput,
+  c as Root,
   R as SearchBox,
   g as Separator,
   s as Text,
-  h as configureImage,
-  S as configureLink,
+  I as ToggleSwitch,
+  w as configureImage,
+  h as configureLink,
   G as getHideAtStyles,
-  y as linkClassName,
-  b as routerOverride
+  A as linkClassName,
+  F as routerOverride
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@caseparts-org/caseblocks",
   "private": false,
-  "version": "0.0.164",
+  "version": "0.0.165",
   "type": "module",
   "module": "dist/main.js",
   "types": "dist/main.d.ts",