@neurocle/synapse-react 0.0.0-bootstrap → 0.0.0-stage

package/dist/components/toc/toc.recipe.mjs

@@ -1,147 +0,0 @@
-import { sva } from "../../react/styled-system/css/sva.mjs";
-//#region src/components/toc/toc.recipe.ts
-const tocRecipe = sva({
-	slots: [
-		"root",
-		"title",
-		"list",
-		"item",
-		"link",
-		"indicator"
-	],
-	base: {
-		root: {
-			position: "relative",
-			display: "grid",
-			gridTemplateColumns: "minmax(0, 1fr)",
-			gridTemplateAreas: "\"title\" \"list\"",
-			color: "foreground.default"
-		},
-		title: {
-			gridArea: "title",
-			margin: "inset.none",
-			marginBlockEnd: "gap.related",
-			color: "foreground.subtle"
-		},
-		list: {
-			gridArea: "list",
-			display: "flex",
-			flexDirection: "column",
-			margin: "inset.none",
-			padding: "inset.none",
-			listStyleType: "none",
-			rowGap: "gap.related",
-			"--toc-bend-clearance": "spacing.inset.compact"
-		},
-		item: {
-			display: "flex",
-			"--toc-depth-step": "var(--toc-gap)",
-			"--toc-indent": "calc(max(var(--depth, 2) - 2, 0) * var(--toc-depth-step))",
-			paddingInlineStart: "var(--toc-indent)"
-		},
-		link: {
-			display: "flex",
-			alignItems: "center",
-			width: "fill",
-			paddingInlineStart: "var(--toc-gap)",
-			minHeight: "target.minimum",
-			minWidth: "target.minimum",
-			rounded: "control",
-			color: "foreground.muted",
-			textDecoration: "none",
-			transitionProperty: "colors",
-			transitionDuration: "interaction",
-			transitionTimingFunction: "interaction",
-			"&:not([data-disabled], [data-active]):hover": { color: "foreground.default" },
-			"&[data-active]": { color: "primary.onSurface" },
-			outlineColor: "border.focus",
-			_focusVisible: {
-				outlineStyle: "solid",
-				outlineWidth: "focus",
-				outlineOffset: "-inset.compact",
-				outlineColor: "border.focus"
-			}
-		},
-		indicator: {
-			gridArea: "list",
-			position: "absolute",
-			inset: "inset.none",
-			pointerEvents: "none",
-			"& > svg": {
-				position: "absolute",
-				insetBlockStart: "inset.none",
-				left: "inset.none",
-				overflow: "visible",
-				strokeLinejoin: "round",
-				"& > path": { vectorEffect: "non-scaling-stroke" },
-				"&[data-hidden]": { display: "none" }
-			},
-			"& > [data-toc-path=rail]": {
-				stroke: "border.muted",
-				strokeWidth: "hairline",
-				_highContrast: { stroke: "system.canvasText" }
-			},
-			"& > [data-toc-path=active]": {
-				stroke: "primary.default",
-				strokeWidth: "emphasis",
-				clipPath: "inset(var(--toc-active-top) 0 calc(100% - var(--toc-active-top) - var(--toc-active-height)) 0)",
-				"--toc-active-motion": "clip-path",
-				transitionProperty: "var(--toc-active-motion)",
-				transitionDuration: "interaction",
-				transitionTimingFunction: "interaction",
-				_highContrast: { stroke: "system.highlight" }
-			}
-		}
-	},
-	variants: { size: {
-		xs: {
-			title: { textStyle: "caption" },
-			root: { "--toc-gap": "calc(token(spacing.inset.control) + token(spacing.inset.compact))" },
-			link: {
-				paddingInlineEnd: "inset.control",
-				textStyle: "caption"
-			}
-		},
-		sm: {
-			title: { textStyle: "caption" },
-			root: { "--toc-gap": "calc(token(spacing.inset.control) + token(spacing.inset.compact))" },
-			link: {
-				minHeight: "control.xs",
-				paddingInlineEnd: "inset.control",
-				textStyle: "detail"
-			}
-		},
-		md: {
-			title: { textStyle: "detail" },
-			root: { "--toc-gap": "calc(token(spacing.inset.overlay) + token(spacing.inset.compact))" },
-			link: {
-				minHeight: "control.sm",
-				paddingInlineEnd: "inset.overlay",
-				textStyle: "body"
-			}
-		},
-		lg: {
-			title: { textStyle: "body" },
-			root: { "--toc-gap": "calc(token(spacing.inset.overlay) + token(spacing.inset.compact))" },
-			link: {
-				minHeight: "control.md",
-				paddingInlineEnd: "inset.overlay",
-				textStyle: "body"
-			}
-		},
-		xl: {
-			title: { textStyle: "body" },
-			root: { "--toc-gap": "calc(token(spacing.inset.surface) + token(spacing.inset.compact))" },
-			link: {
-				minHeight: "control.lg",
-				paddingInlineEnd: "inset.surface",
-				textStyle: "subtitle"
-			}
-		}
-	} },
-	defaultVariants: { size: "md" }
-});
-//#endregion
-export { tocRecipe };
-
-//# sourceMappingURL=toc.recipe.mjs.map

package/dist/components/toc/toc.recipe.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"toc.recipe.mjs","names":[],"sources":["../../../src/components/toc/toc.recipe.ts"],"sourcesContent":["import { sva } from '#styled-system/css/index.js'\n\nexport const tocRecipe = sva({\n  slots: ['root', 'title', 'list', 'item', 'link', 'indicator'],\n  base: {\n    root: {\n      position: 'relative',\n      display: 'grid',\n      gridTemplateColumns: 'minmax(0, 1fr)',\n      gridTemplateAreas: '\"title\" \"list\"',\n      color: 'foreground.default',\n    },\n    title: {\n      gridArea: 'title',\n      margin: 'inset.none',\n      marginBlockEnd: 'gap.related',\n      color: 'foreground.subtle',\n    },\n    list: {\n      gridArea: 'list',\n      display: 'flex',\n      flexDirection: 'column',\n      margin: 'inset.none',\n      padding: 'inset.none',\n      listStyleType: 'none',\n      rowGap: 'gap.related',\n      '--toc-bend-clearance': 'spacing.inset.compact',\n    },\n    item: {\n      display: 'flex',\n      '--toc-depth-step': 'var(--toc-gap)',\n      '--toc-indent': 'calc(max(var(--depth, 2) - 2, 0) * var(--toc-depth-step))',\n      paddingInlineStart: 'var(--toc-indent)',\n    },\n    link: {\n      display: 'flex',\n      alignItems: 'center',\n      width: 'fill',\n      paddingInlineStart: 'var(--toc-gap)',\n      minHeight: 'target.minimum',\n      minWidth: 'target.minimum',\n      rounded: 'control',\n      color: 'foreground.muted',\n      textDecoration: 'none',\n      transitionProperty: 'colors',\n      transitionDuration: 'interaction',\n      transitionTimingFunction: 'interaction',\n      '&:not([data-disabled], [data-active]):hover': { color: 'foreground.default' },\n      '&[data-active]': { color: 'primary.onSurface' },\n      outlineColor: 'border.focus',\n      _focusVisible: {\n        outlineStyle: 'solid',\n        outlineWidth: 'focus',\n        outlineOffset: '-inset.compact',\n        outlineColor: 'border.focus',\n      },\n    },\n    indicator: {\n      gridArea: 'list',\n      position: 'absolute',\n      inset: 'inset.none',\n      pointerEvents: 'none',\n      '& > svg': {\n        position: 'absolute',\n        insetBlockStart: 'inset.none',\n        left: 'inset.none',\n        overflow: 'visible',\n        strokeLinejoin: 'round',\n        '& > path': { vectorEffect: 'non-scaling-stroke' },\n        '&[data-hidden]': { display: 'none' },\n      },\n      '& > [data-toc-path=rail]': {\n        stroke: 'border.muted',\n        strokeWidth: 'hairline',\n        _highContrast: { stroke: 'system.canvasText' },\n      },\n      '& > [data-toc-path=active]': {\n        stroke: 'primary.default',\n        strokeWidth: 'emphasis',\n        clipPath:\n          'inset(var(--toc-active-top) 0 calc(100% - var(--toc-active-top) - var(--toc-active-height)) 0)',\n        '--toc-active-motion': 'clip-path',\n        transitionProperty: 'var(--toc-active-motion)',\n        transitionDuration: 'interaction',\n        transitionTimingFunction: 'interaction',\n        _highContrast: { stroke: 'system.highlight' },\n      },\n    },\n  },\n  variants: {\n    size: {\n      xs: {\n        title: { textStyle: 'caption' },\n        root: { '--toc-gap': 'calc(token(spacing.inset.control) + token(spacing.inset.compact))' },\n        link: { paddingInlineEnd: 'inset.control', textStyle: 'caption' },\n      },\n      sm: {\n        title: { textStyle: 'caption' },\n        root: { '--toc-gap': 'calc(token(spacing.inset.control) + token(spacing.inset.compact))' },\n        link: { minHeight: 'control.xs', paddingInlineEnd: 'inset.control', textStyle: 'detail' },\n      },\n      md: {\n        title: { textStyle: 'detail' },\n        root: { '--toc-gap': 'calc(token(spacing.inset.overlay) + token(spacing.inset.compact))' },\n        link: { minHeight: 'control.sm', paddingInlineEnd: 'inset.overlay', textStyle: 'body' },\n      },\n      lg: {\n        title: { textStyle: 'body' },\n        root: { '--toc-gap': 'calc(token(spacing.inset.overlay) + token(spacing.inset.compact))' },\n        link: { minHeight: 'control.md', paddingInlineEnd: 'inset.overlay', textStyle: 'body' },\n      },\n      xl: {\n        title: { textStyle: 'body' },\n        root: { '--toc-gap': 'calc(token(spacing.inset.surface) + token(spacing.inset.compact))' },\n        link: { minHeight: 'control.lg', paddingInlineEnd: 'inset.surface', textStyle: 'subtitle' },\n      },\n    },\n  },\n  defaultVariants: { size: 'md' },\n})\n"],"mappings":";;AAEA,MAAa,YAAY,IAAI;CAC3B,OAAO;EAAC;EAAQ;EAAS;EAAQ;EAAQ;EAAQ;CAAW;CAC5D,MAAM;EACJ,MAAM;GACJ,UAAU;GACV,SAAS;GACT,qBAAqB;GACrB,mBAAmB;GACnB,OAAO;EACT;EACA,OAAO;GACL,UAAU;GACV,QAAQ;GACR,gBAAgB;GAChB,OAAO;EACT;EACA,MAAM;GACJ,UAAU;GACV,SAAS;GACT,eAAe;GACf,QAAQ;GACR,SAAS;GACT,eAAe;GACf,QAAQ;GACR,wBAAwB;EAC1B;EACA,MAAM;GACJ,SAAS;GACT,oBAAoB;GACpB,gBAAgB;GAChB,oBAAoB;EACtB;EACA,MAAM;GACJ,SAAS;GACT,YAAY;GACZ,OAAO;GACP,oBAAoB;GACpB,WAAW;GACX,UAAU;GACV,SAAS;GACT,OAAO;GACP,gBAAgB;GAChB,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,+CAA+C,EAAE,OAAO,qBAAqB;GAC7E,kBAAkB,EAAE,OAAO,oBAAoB;GAC/C,cAAc;GACd,eAAe;IACb,cAAc;IACd,cAAc;IACd,eAAe;IACf,cAAc;GAChB;EACF;EACA,WAAW;GACT,UAAU;GACV,UAAU;GACV,OAAO;GACP,eAAe;GACf,WAAW;IACT,UAAU;IACV,iBAAiB;IACjB,MAAM;IACN,UAAU;IACV,gBAAgB;IAChB,YAAY,EAAE,cAAc,qBAAqB;IACjD,kBAAkB,EAAE,SAAS,OAAO;GACtC;GACA,4BAA4B;IAC1B,QAAQ;IACR,aAAa;IACb,eAAe,EAAE,QAAQ,oBAAoB;GAC/C;GACA,8BAA8B;IAC5B,QAAQ;IACR,aAAa;IACb,UACE;IACF,uBAAuB;IACvB,oBAAoB;IACpB,oBAAoB;IACpB,0BAA0B;IAC1B,eAAe,EAAE,QAAQ,mBAAmB;GAC9C;EACF;CACF;CACA,UAAU,EACR,MAAM;EACJ,IAAI;GACF,OAAO,EAAE,WAAW,UAAU;GAC9B,MAAM,EAAE,aAAa,oEAAoE;GACzF,MAAM;IAAE,kBAAkB;IAAiB,WAAW;GAAU;EAClE;EACA,IAAI;GACF,OAAO,EAAE,WAAW,UAAU;GAC9B,MAAM,EAAE,aAAa,oEAAoE;GACzF,MAAM;IAAE,WAAW;IAAc,kBAAkB;IAAiB,WAAW;GAAS;EAC1F;EACA,IAAI;GACF,OAAO,EAAE,WAAW,SAAS;GAC7B,MAAM,EAAE,aAAa,oEAAoE;GACzF,MAAM;IAAE,WAAW;IAAc,kBAAkB;IAAiB,WAAW;GAAO;EACxF;EACA,IAAI;GACF,OAAO,EAAE,WAAW,OAAO;GAC3B,MAAM,EAAE,aAAa,oEAAoE;GACzF,MAAM;IAAE,WAAW;IAAc,kBAAkB;IAAiB,WAAW;GAAO;EACxF;EACA,IAAI;GACF,OAAO,EAAE,WAAW,OAAO;GAC3B,MAAM,EAAE,aAAa,oEAAoE;GACzF,MAAM;IAAE,WAAW;IAAc,kBAAkB;IAAiB,WAAW;GAAW;EAC5F;CACF,EACF;CACA,iBAAiB,EAAE,MAAM,KAAK;AAChC,CAAC"}

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

@@ -1,2 +0,0 @@
-import { Toggle, ToggleRootProps } from "./toggle.mjs";
-export { Toggle, type ToggleRootProps };

package/dist/components/toggle/index.mjs

@@ -1,2 +0,0 @@
-import { Toggle } from "./toggle.mjs";
-export { Toggle };

package/dist/components/toggle/toggle.d.mts

@@ -1,21 +0,0 @@
-import { SynapseComponent } from "../../system/types.mjs";
-import { ValueChangeDetails } from "../details.mjs";
-import { Size } from "../../shared/size-scale.mjs";
-//#region src/components/toggle/toggle.d.ts
-export interface ToggleRootProps {
-  /** 제어되는 눌림 상태. */
-  value?: boolean;
-  /** 비제어 모드의 초기 눌림 상태. `value`를 주면 무시됩니다. */
-  defaultValue?: boolean;
-  /** 제어 여부와 무관하게 눌림 상태가 바뀔 때마다 호출됩니다. */
-  onValueChange?: (details: ValueChangeDetails<boolean>) => void;
-  /** 비활성화된 Toggle은 반응하지 않습니다. */
-  disabled?: boolean;
-  /** 하나뿐인 공용 척도를 따릅니다. 모든 컴포넌트와 마찬가지로 기본값은 `md`입니다. */
-  size?: Size;
-  /** 렌더된 버튼의 식별자. 이 machine은 식별자를 만들지 않아서, 버튼의 `id`는 여기서 준 값뿐입니다. */
-  id?: string;
-}
-export declare const Toggle: SynapseComponent<"indicator" | "root", "root", ToggleRootProps, never>;
-//#endregion
-//# sourceMappingURL=toggle.d.mts.map

package/dist/components/toggle/toggle.d.mts.map

@@ -1 +0,0 @@
-{"version":3,"file":"toggle.d.mts","names":[],"sources":["../../../src/components/toggle/toggle.tsx"],"mappings":";;;;iBAWiB;;EAEf;;EAEA;;EAEA,iBAAiB,SAAS;;EAE1B;;EAEA,OAAO;;EAEP;;qBAWW,QAAM,+CAAA"}

package/dist/components/toggle/toggle.mjs

@@ -1,34 +0,0 @@
-"use client";
-import { resolveSize } from "../../shared/size-scale.mjs";
-import { checkmark } from "../../icons/src/checkmark.mjs";
-import "../../icons/src/index.mjs";
-import { Icon } from "../../shared/icon.mjs";
-import { defineComponent } from "../../system/create-component.mjs";
-import { toggleRecipe } from "./toggle.recipe.mjs";
-import { jsx } from "react/jsx-runtime";
-import * as toggle from "@zag-js/toggle";
-//#region src/components/toggle/toggle.tsx
-const toMachineProps = (props) => ({
-	...props.value === void 0 ? {} : { pressed: props.value },
-	...props.defaultValue === void 0 ? {} : { defaultPressed: props.defaultValue },
-	...props.onValueChange === void 0 ? {} : { onPressedChange: (pressed) => props.onValueChange?.({ value: pressed }) }
-});
-const Toggle = defineComponent()({
-	name: "Toggle",
-	module: toggle,
-	rootPart: "root",
-	elements: { indicator: "span" },
-	defaultContent: { indicator: () => /* @__PURE__ */ jsx(Icon, { icon: checkmark }) },
-	variantProps: [
-		"value",
-		"defaultValue",
-		"onValueChange",
-		"size"
-	],
-	useMachineProps: toMachineProps,
-	slots: (props) => toggleRecipe({ size: resolveSize(props.size, "Toggle") })
-});
-//#endregion
-export { Toggle };
-
-//# sourceMappingURL=toggle.mjs.map

package/dist/components/toggle/toggle.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"toggle.mjs","names":[],"sources":["../../../src/components/toggle/toggle.tsx"],"sourcesContent":["'use client'\n\nimport { checkmark } from '@neurocle/synapse-icons'\nimport * as toggle from '@zag-js/toggle'\n\nimport type { ValueChangeDetails } from '#/components/details.ts'\nimport { toggleRecipe } from '#/components/toggle/toggle.recipe.ts'\nimport { Icon } from '#/shared/icon.tsx'\nimport { resolveSize, type Size } from '#/shared/size-scale.ts'\nimport { defineComponent } from '#/system/create-component.ts'\n\nexport interface ToggleRootProps {\n  /** 제어되는 눌림 상태. */\n  value?: boolean\n  /** 비제어 모드의 초기 눌림 상태. `value`를 주면 무시됩니다. */\n  defaultValue?: boolean\n  /** 제어 여부와 무관하게 눌림 상태가 바뀔 때마다 호출됩니다. */\n  onValueChange?: (details: ValueChangeDetails<boolean>) => void\n  /** 비활성화된 Toggle은 반응하지 않습니다. */\n  disabled?: boolean\n  /** 하나뿐인 공용 척도를 따릅니다. 모든 컴포넌트와 마찬가지로 기본값은 `md`입니다. */\n  size?: Size\n  /** 렌더된 버튼의 식별자. 이 machine은 식별자를 만들지 않아서, 버튼의 `id`는 여기서 준 값뿐입니다. */\n  id?: string\n}\n\nconst toMachineProps = (props: ToggleRootProps): Record<string, unknown> => ({\n  ...(props.value === undefined ? {} : { pressed: props.value }),\n  ...(props.defaultValue === undefined ? {} : { defaultPressed: props.defaultValue }),\n  ...(props.onValueChange === undefined\n    ? {}\n    : { onPressedChange: (pressed: boolean) => props.onValueChange?.({ value: pressed }) }),\n})\n\nexport const Toggle = defineComponent<ToggleRootProps>()({\n  name: 'Toggle',\n  module: toggle,\n  rootPart: 'root',\n  elements: { indicator: 'span' },\n  defaultContent: { indicator: () => <Icon icon={checkmark} /> },\n  variantProps: ['value', 'defaultValue', 'onValueChange', 'size'],\n  useMachineProps: toMachineProps,\n  slots: (props: ToggleRootProps) => toggleRecipe({ size: resolveSize(props.size, 'Toggle') }),\n})\n"],"mappings":";;;;;;;;;;AA0BA,MAAM,kBAAkB,WAAqD;CAC3E,GAAI,MAAM,UAAU,KAAA,IAAY,CAAC,IAAI,EAAE,SAAS,MAAM,MAAM;CAC5D,GAAI,MAAM,iBAAiB,KAAA,IAAY,CAAC,IAAI,EAAE,gBAAgB,MAAM,aAAa;CACjF,GAAI,MAAM,kBAAkB,KAAA,IACxB,CAAC,IACD,EAAE,kBAAkB,YAAqB,MAAM,gBAAgB,EAAE,OAAO,QAAQ,CAAC,EAAE;AACzF;AAEA,MAAa,SAAS,gBAAiC,CAAC,CAAC;CACvD,MAAM;CACN,QAAQ;CACR,UAAU;CACV,UAAU,EAAE,WAAW,OAAO;CAC9B,gBAAgB,EAAE,iBAAiB,oBAAC,MAAD,EAAM,MAAM,UAAY,CAAA,EAAE;CAC7D,cAAc;EAAC;EAAS;EAAgB;EAAiB;CAAM;CAC/D,iBAAiB;CACjB,QAAQ,UAA2B,aAAa,EAAE,MAAM,YAAY,MAAM,MAAM,QAAQ,EAAE,CAAC;AAC7F,CAAC"}

package/dist/components/toggle/toggle.recipe.mjs

@@ -1,175 +0,0 @@
-import { sva } from "../../react/styled-system/css/sva.mjs";
-//#region src/components/toggle/toggle.recipe.ts
-const toggleRecipe = sva({
-	slots: ["root", "indicator"],
-	base: {
-		root: {
-			"&[aria-label]:has(> svg)": { paddingInline: "inset.none" },
-			"& > svg": { flexShrink: 0 },
-			display: "inline-flex",
-			alignItems: "center",
-			justifyContent: "center",
-			gap: "gap.inline",
-			flexShrink: 0,
-			minHeight: "target.minimum",
-			minWidth: "target.minimum",
-			rounded: "control",
-			borderWidth: "hairline",
-			borderStyle: "solid",
-			borderColor: "border.default",
-			bg: "surface.raised",
-			color: "foreground.muted",
-			cursor: "pointer",
-			userSelect: "none",
-			transitionProperty: "common",
-			transitionDuration: "interaction",
-			transitionTimingFunction: "interaction",
-			outlineColor: "border.focus",
-			"&:not(:disabled, [data-disabled], [data-state=on]):hover": {
-				bg: "secondary.hover",
-				color: "foreground.default"
-			},
-			"&:not(:disabled, [data-disabled]):active": { transform: "scale(0.96)" },
-			_pressed: {
-				bg: "primary.subtle",
-				color: "primary.onSurface",
-				borderColor: "primary.default",
-				_highContrast: {
-					bg: "system.highlight",
-					color: "system.highlightText",
-					borderColor: "system.highlight"
-				}
-			},
-			_focusVisible: {
-				outlineStyle: "solid",
-				outlineWidth: "focus",
-				outlineOffset: "inset.compact",
-				outlineColor: "border.focus"
-			},
-			_disabled: {
-				bg: "background.subtle",
-				borderColor: "border.muted",
-				color: "foreground.disabled",
-				cursor: "not-allowed",
-				_highContrast: {
-					color: "system.grayText",
-					borderColor: "system.grayText"
-				},
-				_pressed: {
-					bg: "background.muted",
-					color: "foreground.disabled"
-				}
-			}
-		},
-		indicator: {
-			display: "inline-flex",
-			alignItems: "center",
-			justifyContent: "center",
-			flexShrink: 0,
-			pointerEvents: "none",
-			"&[data-state=off]": { display: "none" }
-		}
-	},
-	variants: { size: {
-		xs: {
-			root: {
-				"&[aria-label]:has(> svg)": {
-					width: "control.xs",
-					height: "control.xs"
-				},
-				"& > svg": {
-					width: "icon.xs",
-					height: "icon.xs"
-				},
-				minHeight: "control.xs",
-				paddingInline: "inset.compact",
-				textStyle: "caption"
-			},
-			indicator: { "& svg": {
-				width: "icon.xs",
-				height: "icon.xs"
-			} }
-		},
-		sm: {
-			root: {
-				"&[aria-label]:has(> svg)": {
-					width: "control.sm",
-					height: "control.sm"
-				},
-				"& > svg": {
-					width: "icon.sm",
-					height: "icon.sm"
-				},
-				minHeight: "control.sm",
-				paddingInline: "inset.control",
-				textStyle: "label"
-			},
-			indicator: { "& svg": {
-				width: "icon.sm",
-				height: "icon.sm"
-			} }
-		},
-		md: {
-			root: {
-				"&[aria-label]:has(> svg)": {
-					width: "control.md",
-					height: "control.md"
-				},
-				"& > svg": {
-					width: "icon.sm",
-					height: "icon.sm"
-				},
-				minHeight: "control.md",
-				paddingInline: "inset.overlay",
-				textStyle: "label"
-			},
-			indicator: { "& svg": {
-				width: "icon.sm",
-				height: "icon.sm"
-			} }
-		},
-		lg: {
-			root: {
-				"&[aria-label]:has(> svg)": {
-					width: "control.lg",
-					height: "control.lg"
-				},
-				"& > svg": {
-					width: "icon.md",
-					height: "icon.md"
-				},
-				minHeight: "control.lg",
-				paddingInline: "inset.surface",
-				textStyle: "label"
-			},
-			indicator: { "& svg": {
-				width: "icon.md",
-				height: "icon.md"
-			} }
-		},
-		xl: {
-			root: {
-				"&[aria-label]:has(> svg)": {
-					width: "control.xl",
-					height: "control.xl"
-				},
-				"& > svg": {
-					width: "icon.lg",
-					height: "icon.lg"
-				},
-				minHeight: "control.xl",
-				paddingInline: "inset.surface",
-				textStyle: "subtitle"
-			},
-			indicator: { "& svg": {
-				width: "icon.lg",
-				height: "icon.lg"
-			} }
-		}
-	} },
-	defaultVariants: { size: "md" }
-});
-//#endregion
-export { toggleRecipe };
-
-//# sourceMappingURL=toggle.recipe.mjs.map

package/dist/components/toggle/toggle.recipe.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"toggle.recipe.mjs","names":[],"sources":["../../../src/components/toggle/toggle.recipe.ts"],"sourcesContent":["import { sva } from '#styled-system/css/index.js'\n\nexport const toggleRecipe = sva({\n  slots: ['root', 'indicator'],\n  base: {\n    root: {\n      '&[aria-label]:has(> svg)': { paddingInline: 'inset.none' },\n      '& > svg': { flexShrink: 0 },\n      display: 'inline-flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      gap: 'gap.inline',\n      flexShrink: 0,\n      minHeight: 'target.minimum',\n      minWidth: 'target.minimum',\n      rounded: 'control',\n      borderWidth: 'hairline',\n      borderStyle: 'solid',\n      borderColor: 'border.default',\n      bg: 'surface.raised',\n      color: 'foreground.muted',\n      cursor: 'pointer',\n      userSelect: 'none',\n      transitionProperty: 'common',\n      transitionDuration: 'interaction',\n      transitionTimingFunction: 'interaction',\n      outlineColor: 'border.focus',\n      '&:not(:disabled, [data-disabled], [data-state=on]):hover': {\n        bg: 'secondary.hover',\n        color: 'foreground.default',\n      },\n      '&:not(:disabled, [data-disabled]):active': { transform: 'scale(0.96)' },\n      _pressed: {\n        bg: 'primary.subtle',\n        color: 'primary.onSurface',\n        borderColor: 'primary.default',\n        _highContrast: {\n          bg: 'system.highlight',\n          color: 'system.highlightText',\n          borderColor: 'system.highlight',\n        },\n      },\n      _focusVisible: {\n        outlineStyle: 'solid',\n        outlineWidth: 'focus',\n        outlineOffset: 'inset.compact',\n        outlineColor: 'border.focus',\n      },\n      _disabled: {\n        bg: 'background.subtle',\n        borderColor: 'border.muted',\n        color: 'foreground.disabled',\n        cursor: 'not-allowed',\n        _highContrast: { color: 'system.grayText', borderColor: 'system.grayText' },\n        _pressed: { bg: 'background.muted', color: 'foreground.disabled' },\n      },\n    },\n    indicator: {\n      display: 'inline-flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      flexShrink: 0,\n      pointerEvents: 'none',\n      '&[data-state=off]': { display: 'none' },\n    },\n  },\n  variants: {\n    size: {\n      xs: {\n        root: {\n          '&[aria-label]:has(> svg)': { width: 'control.xs', height: 'control.xs' },\n          '& > svg': { width: 'icon.xs', height: 'icon.xs' },\n          minHeight: 'control.xs',\n          paddingInline: 'inset.compact',\n          textStyle: 'caption',\n        },\n        indicator: { '& svg': { width: 'icon.xs', height: 'icon.xs' } },\n      },\n      sm: {\n        root: {\n          '&[aria-label]:has(> svg)': { width: 'control.sm', height: 'control.sm' },\n          '& > svg': { width: 'icon.sm', height: 'icon.sm' },\n          minHeight: 'control.sm',\n          paddingInline: 'inset.control',\n          textStyle: 'label',\n        },\n        indicator: { '& svg': { width: 'icon.sm', height: 'icon.sm' } },\n      },\n      md: {\n        root: {\n          '&[aria-label]:has(> svg)': { width: 'control.md', height: 'control.md' },\n          '& > svg': { width: 'icon.sm', height: 'icon.sm' },\n          minHeight: 'control.md',\n          paddingInline: 'inset.overlay',\n          textStyle: 'label',\n        },\n        indicator: { '& svg': { width: 'icon.sm', height: 'icon.sm' } },\n      },\n      lg: {\n        root: {\n          '&[aria-label]:has(> svg)': { width: 'control.lg', height: 'control.lg' },\n          '& > svg': { width: 'icon.md', height: 'icon.md' },\n          minHeight: 'control.lg',\n          paddingInline: 'inset.surface',\n          textStyle: 'label',\n        },\n        indicator: { '& svg': { width: 'icon.md', height: 'icon.md' } },\n      },\n      xl: {\n        root: {\n          '&[aria-label]:has(> svg)': { width: 'control.xl', height: 'control.xl' },\n          '& > svg': { width: 'icon.lg', height: 'icon.lg' },\n          minHeight: 'control.xl',\n          paddingInline: 'inset.surface',\n          textStyle: 'subtitle',\n        },\n        indicator: { '& svg': { width: 'icon.lg', height: 'icon.lg' } },\n      },\n    },\n  },\n  defaultVariants: { size: 'md' },\n})\n"],"mappings":";;AAEA,MAAa,eAAe,IAAI;CAC9B,OAAO,CAAC,QAAQ,WAAW;CAC3B,MAAM;EACJ,MAAM;GACJ,4BAA4B,EAAE,eAAe,aAAa;GAC1D,WAAW,EAAE,YAAY,EAAE;GAC3B,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,KAAK;GACL,YAAY;GACZ,WAAW;GACX,UAAU;GACV,SAAS;GACT,aAAa;GACb,aAAa;GACb,aAAa;GACb,IAAI;GACJ,OAAO;GACP,QAAQ;GACR,YAAY;GACZ,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,cAAc;GACd,4DAA4D;IAC1D,IAAI;IACJ,OAAO;GACT;GACA,4CAA4C,EAAE,WAAW,cAAc;GACvE,UAAU;IACR,IAAI;IACJ,OAAO;IACP,aAAa;IACb,eAAe;KACb,IAAI;KACJ,OAAO;KACP,aAAa;IACf;GACF;GACA,eAAe;IACb,cAAc;IACd,cAAc;IACd,eAAe;IACf,cAAc;GAChB;GACA,WAAW;IACT,IAAI;IACJ,aAAa;IACb,OAAO;IACP,QAAQ;IACR,eAAe;KAAE,OAAO;KAAmB,aAAa;IAAkB;IAC1E,UAAU;KAAE,IAAI;KAAoB,OAAO;IAAsB;GACnE;EACF;EACA,WAAW;GACT,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,YAAY;GACZ,eAAe;GACf,qBAAqB,EAAE,SAAS,OAAO;EACzC;CACF;CACA,UAAU,EACR,MAAM;EACJ,IAAI;GACF,MAAM;IACJ,4BAA4B;KAAE,OAAO;KAAc,QAAQ;IAAa;IACxE,WAAW;KAAE,OAAO;KAAW,QAAQ;IAAU;IACjD,WAAW;IACX,eAAe;IACf,WAAW;GACb;GACA,WAAW,EAAE,SAAS;IAAE,OAAO;IAAW,QAAQ;GAAU,EAAE;EAChE;EACA,IAAI;GACF,MAAM;IACJ,4BAA4B;KAAE,OAAO;KAAc,QAAQ;IAAa;IACxE,WAAW;KAAE,OAAO;KAAW,QAAQ;IAAU;IACjD,WAAW;IACX,eAAe;IACf,WAAW;GACb;GACA,WAAW,EAAE,SAAS;IAAE,OAAO;IAAW,QAAQ;GAAU,EAAE;EAChE;EACA,IAAI;GACF,MAAM;IACJ,4BAA4B;KAAE,OAAO;KAAc,QAAQ;IAAa;IACxE,WAAW;KAAE,OAAO;KAAW,QAAQ;IAAU;IACjD,WAAW;IACX,eAAe;IACf,WAAW;GACb;GACA,WAAW,EAAE,SAAS;IAAE,OAAO;IAAW,QAAQ;GAAU,EAAE;EAChE;EACA,IAAI;GACF,MAAM;IACJ,4BAA4B;KAAE,OAAO;KAAc,QAAQ;IAAa;IACxE,WAAW;KAAE,OAAO;KAAW,QAAQ;IAAU;IACjD,WAAW;IACX,eAAe;IACf,WAAW;GACb;GACA,WAAW,EAAE,SAAS;IAAE,OAAO;IAAW,QAAQ;GAAU,EAAE;EAChE;EACA,IAAI;GACF,MAAM;IACJ,4BAA4B;KAAE,OAAO;KAAc,QAAQ;IAAa;IACxE,WAAW;KAAE,OAAO;KAAW,QAAQ;IAAU;IACjD,WAAW;IACX,eAAe;IACf,WAAW;GACb;GACA,WAAW,EAAE,SAAS;IAAE,OAAO;IAAW,QAAQ;GAAU,EAAE;EAChE;CACF,EACF;CACA,iBAAiB,EAAE,MAAM,KAAK;AAChC,CAAC"}

package/dist/components/toggle-group/index.d.mts

@@ -1,2 +0,0 @@
-import { ToggleGroup, ToggleGroupRootProps } from "./toggle-group.mjs";
-export { ToggleGroup, type ToggleGroupRootProps };

package/dist/components/toggle-group/index.mjs

@@ -1,2 +0,0 @@
-import { ToggleGroup } from "./toggle-group.mjs";
-export { ToggleGroup };

package/dist/components/toggle-group/toggle-group.d.mts

@@ -1,29 +0,0 @@
-import { Orientation, SynapseComponent } from "../../system/types.mjs";
-import { ValueChangeDetails } from "../details.mjs";
-import { Size } from "../../shared/size-scale.mjs";
-//#region src/components/toggle-group/toggle-group.d.ts
-export interface ToggleGroupRootProps {
-  /** 제어되는 선택. `multiple`을 켜지 않았다면 항목이 하나입니다. */
-  value?: readonly string[];
-  /** 비제어 모드의 초기 선택. `value`를 주면 무시됩니다. */
-  defaultValue?: readonly string[];
-  /** 제어 여부와 무관하게 선택이 바뀔 때마다 호출됩니다. */
-  onValueChange?: (details: ValueChangeDetails<readonly string[]>) => void;
-  /** 한 번에 둘 이상의 아이템이 눌려 있도록 허용합니다. */
-  multiple?: boolean;
-  /** 눌린 아이템을 다시 누르면 해제됩니다. 기본값은 true이고, `multiple`일 때는 무시됩니다. */
-  deselectable?: boolean;
-  /** 화살표 키 이동이 양 끝을 넘어가면 반대쪽으로 돌아옵니다. 기본값은 true입니다. */
-  loopFocus?: boolean;
-  /** 그룹이 배치되는 축이자, 그 축을 따라 움직이는 화살표 키를 정합니다. */
-  orientation?: Orientation;
-  /** 비활성화된 ToggleGroup은 반응하지 않고, 그 안의 어떤 아이템도 반응하지 않습니다. */
-  disabled?: boolean;
-  /** 하나뿐인 공용 척도를 따릅니다. 모든 컴포넌트와 마찬가지로 기본값은 `md`입니다. */
-  size?: Size;
-  /** 팩토리가 만드는 식별자를 덮어씁니다. 서버와 클라이언트에서 같은 값으로 유지됩니다. */
-  id?: string;
-}
-export declare const ToggleGroup: SynapseComponent<"item" | "root", "root", ToggleGroupRootProps, never>;
-//#endregion
-//# sourceMappingURL=toggle-group.d.mts.map

package/dist/components/toggle-group/toggle-group.d.mts.map

@@ -1 +0,0 @@
-{"version":3,"file":"toggle-group.d.mts","names":[],"sources":["../../../src/components/toggle-group/toggle-group.tsx"],"mappings":";;;;iBAUiB;;EAEf;;EAEA;;EAEA,iBAAiB,SAAS;;EAE1B;;EAEA;;EAEA;;EAEA,cAAc;;EAEd;;EAEA,OAAO;;EAEP;;qBAGW,aAAW,0CAAA"}

package/dist/components/toggle-group/toggle-group.mjs

@@ -1,18 +0,0 @@
-"use client";
-import { resolveSize } from "../../shared/size-scale.mjs";
-import { defineComponent } from "../../system/create-component.mjs";
-import { toggleGroupRecipe } from "./toggle-group.recipe.mjs";
-import * as toggleGroup from "@zag-js/toggle-group";
-//#region src/components/toggle-group/toggle-group.tsx
-const ToggleGroup = defineComponent()({
-	name: "ToggleGroup",
-	module: toggleGroup,
-	rootPart: "root",
-	getterProps: { item: ["value", "disabled"] },
-	variantProps: ["size"],
-	slots: (props) => toggleGroupRecipe({ size: resolveSize(props.size, "ToggleGroup") })
-});
-//#endregion
-export { ToggleGroup };
-
-//# sourceMappingURL=toggle-group.mjs.map

package/dist/components/toggle-group/toggle-group.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"toggle-group.mjs","names":[],"sources":["../../../src/components/toggle-group/toggle-group.tsx"],"sourcesContent":["'use client'\n\nimport * as toggleGroup from '@zag-js/toggle-group'\n\nimport type { ValueChangeDetails } from '#/components/details.ts'\nimport { toggleGroupRecipe } from '#/components/toggle-group/toggle-group.recipe.ts'\nimport { resolveSize, type Size } from '#/shared/size-scale.ts'\nimport { defineComponent } from '#/system/create-component.ts'\nimport type { Orientation } from '#/system/types.ts'\n\nexport interface ToggleGroupRootProps {\n  /** 제어되는 선택. `multiple`을 켜지 않았다면 항목이 하나입니다. */\n  value?: readonly string[]\n  /** 비제어 모드의 초기 선택. `value`를 주면 무시됩니다. */\n  defaultValue?: readonly string[]\n  /** 제어 여부와 무관하게 선택이 바뀔 때마다 호출됩니다. */\n  onValueChange?: (details: ValueChangeDetails<readonly string[]>) => void\n  /** 한 번에 둘 이상의 아이템이 눌려 있도록 허용합니다. */\n  multiple?: boolean\n  /** 눌린 아이템을 다시 누르면 해제됩니다. 기본값은 true이고, `multiple`일 때는 무시됩니다. */\n  deselectable?: boolean\n  /** 화살표 키 이동이 양 끝을 넘어가면 반대쪽으로 돌아옵니다. 기본값은 true입니다. */\n  loopFocus?: boolean\n  /** 그룹이 배치되는 축이자, 그 축을 따라 움직이는 화살표 키를 정합니다. */\n  orientation?: Orientation\n  /** 비활성화된 ToggleGroup은 반응하지 않고, 그 안의 어떤 아이템도 반응하지 않습니다. */\n  disabled?: boolean\n  /** 하나뿐인 공용 척도를 따릅니다. 모든 컴포넌트와 마찬가지로 기본값은 `md`입니다. */\n  size?: Size\n  /** 팩토리가 만드는 식별자를 덮어씁니다. 서버와 클라이언트에서 같은 값으로 유지됩니다. */\n  id?: string\n}\n\nexport const ToggleGroup = defineComponent<ToggleGroupRootProps>()({\n  name: 'ToggleGroup',\n  module: toggleGroup,\n  rootPart: 'root',\n  getterProps: { item: ['value', 'disabled'] },\n  variantProps: ['size'],\n  slots: (props: ToggleGroupRootProps) =>\n    toggleGroupRecipe({ size: resolveSize(props.size, 'ToggleGroup') }),\n})\n"],"mappings":";;;;;;AAiCA,MAAa,cAAc,gBAAsC,CAAC,CAAC;CACjE,MAAM;CACN,QAAQ;CACR,UAAU;CACV,aAAa,EAAE,MAAM,CAAC,SAAS,UAAU,EAAE;CAC3C,cAAc,CAAC,MAAM;CACrB,QAAQ,UACN,kBAAkB,EAAE,MAAM,YAAY,MAAM,MAAM,aAAa,EAAE,CAAC;AACtE,CAAC"}