@neurocle/synapse-react 0.0.0-stage → 0.3.0

package/dist/components/separator/separator.connect.mjs

@@ -0,0 +1,28 @@
+import { __exportAll } from "../../_virtual/_rolldown/runtime.mjs";
+import { anatomy, parts } from "./separator.anatomy.mjs";
+//#region src/components/separator/separator.connect.ts
+var separator_connect_exports = /* @__PURE__ */ __exportAll({
+	anatomy: () => anatomy,
+	connect: () => connect,
+	machine: () => null,
+	props: () => props
+});
+const props = ["orientation", "decorative"];
+function connect(machineProps) {
+	const orientation = machineProps["orientation"] === "vertical" ? "vertical" : "horizontal";
+	const decorative = machineProps["decorative"] !== false;
+	return {
+		orientation,
+		decorative,
+		getRootProps: () => ({
+			...parts.root.attrs,
+			role: decorative ? "none" : "separator",
+			...!decorative && orientation === "vertical" ? { "aria-orientation": "vertical" } : {},
+			"data-orientation": orientation
+		})
+	};
+}
+//#endregion
+export { anatomy, connect, props, separator_connect_exports };
+
+//# sourceMappingURL=separator.connect.mjs.map

package/dist/components/separator/separator.connect.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"separator.connect.mjs","names":[],"sources":["../../../src/components/separator/separator.connect.ts"],"sourcesContent":["import { parts } from '#/components/separator/separator.anatomy.ts'\nimport type { Orientation } from '#/system/types.ts'\n\nexport { anatomy } from '#/components/separator/separator.anatomy.ts'\n\nexport const machine = null\n\nexport const props: readonly string[] = ['orientation', 'decorative']\n\nexport interface SeparatorApi {\n  orientation: Orientation\n  decorative: boolean\n  getRootProps: () => Record<string, unknown>\n}\n\nexport function connect(machineProps: Readonly<Record<string, unknown>>): SeparatorApi {\n  const orientation: Orientation =\n    machineProps['orientation'] === 'vertical' ? 'vertical' : 'horizontal'\n  const decorative = machineProps['decorative'] !== false\n  return {\n    orientation,\n    decorative,\n    getRootProps: () => ({\n      ...parts.root.attrs,\n      role: decorative ? 'none' : 'separator',\n      ...(!decorative && orientation === 'vertical' ? { 'aria-orientation': 'vertical' } : {}),\n      'data-orientation': orientation,\n    }),\n  }\n}\n"],"mappings":";;;;;;;;;AAOA,MAAa,QAA2B,CAAC,eAAe,YAAY;AAQpE,SAAgB,QAAQ,cAA+D;CACrF,MAAM,cACJ,aAAa,mBAAmB,aAAa,aAAa;CAC5D,MAAM,aAAa,aAAa,kBAAkB;CAClD,OAAO;EACL;EACA;EACA,qBAAqB;GACnB,GAAG,MAAM,KAAK;GACd,MAAM,aAAa,SAAS;GAC5B,GAAI,CAAC,cAAc,gBAAgB,aAAa,EAAE,oBAAoB,WAAW,IAAI,CAAC;GACtF,oBAAoB;EACtB;CACF;AACF"}

package/dist/components/separator/separator.d.mts

@@ -0,0 +1,11 @@
+import { Orientation, SynapseComponent } from "../../system/types.mjs";
+//#region src/components/separator/separator.d.ts
+export interface SeparatorRootProps {
+  /** 선이 놓이는 방향. 기본값은 `horizontal`입니다. */
+  orientation?: Orientation;
+  /** 기본값 `true`에서는 보조기술에 드러나지 않습니다. 선이 내용의 구획을 나눠 스크린 리더 사용자도 알아야 할 때만 `false`로 두어 `separator` 역할을 줍니다. */
+  decorative?: boolean;
+}
+export declare const Separator: SynapseComponent<"root", "root", SeparatorRootProps, never>;
+//#endregion
+//# sourceMappingURL=separator.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"separator.d.mts","names":[],"sources":["../../../src/components/separator/separator.tsx"],"mappings":";;iBAOiB;;EAEf,cAAc;;EAEd;;qBAGW,WAAS,iCAAA"}

package/dist/components/separator/separator.mjs

@@ -0,0 +1,15 @@
+"use client";
+import { defineComponent } from "../../system/create-component.mjs";
+import { separator_connect_exports } from "./separator.connect.mjs";
+import { separatorRecipe } from "./separator.recipe.mjs";
+//#region src/components/separator/separator.tsx
+const Separator = defineComponent()({
+	name: "Separator",
+	module: separator_connect_exports,
+	rootPart: "root",
+	slots: () => separatorRecipe()
+});
+//#endregion
+export { Separator };
+
+//# sourceMappingURL=separator.mjs.map

package/dist/components/separator/separator.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"separator.mjs","names":["separator"],"sources":["../../../src/components/separator/separator.tsx"],"sourcesContent":["'use client'\n\nimport * as separator from '#/components/separator/separator.connect.ts'\nimport { separatorRecipe } from '#/components/separator/separator.recipe.ts'\nimport { defineComponent } from '#/system/create-component.ts'\nimport type { Orientation } from '#/system/types.ts'\n\nexport interface SeparatorRootProps {\n  /** 선이 놓이는 방향. 기본값은 `horizontal`입니다. */\n  orientation?: Orientation\n  /** 기본값 `true`에서는 보조기술에 드러나지 않습니다. 선이 내용의 구획을 나눠 스크린 리더 사용자도 알아야 할 때만 `false`로 두어 `separator` 역할을 줍니다. */\n  decorative?: boolean\n}\n\nexport const Separator = defineComponent<SeparatorRootProps>()({\n  name: 'Separator',\n  module: separator,\n  rootPart: 'root',\n  slots: () => separatorRecipe(),\n})\n"],"mappings":";;;;;AAcA,MAAa,YAAY,gBAAoC,CAAC,CAAC;CAC7D,MAAM;CACN,QAAQA;CACR,UAAU;CACV,aAAa,gBAAgB;AAC/B,CAAC"}

package/dist/components/separator/separator.recipe.mjs

@@ -0,0 +1,22 @@
+import { sva } from "../../react/styled-system/css/sva.mjs";
+//#region src/components/separator/separator.recipe.ts
+const separatorRecipe = sva({
+	slots: ["root"],
+	base: { root: {
+		flexShrink: 0,
+		alignSelf: "stretch",
+		borderStyle: "solid",
+		borderColor: "border.default",
+		borderWidth: "0",
+		borderBlockStartWidth: "hairline",
+		_vertical: {
+			borderBlockStartWidth: "0",
+			borderInlineStartWidth: "hairline"
+		},
+		_highContrast: { borderColor: "system.canvasText" }
+	} }
+});
+//#endregion
+export { separatorRecipe };
+
+//# sourceMappingURL=separator.recipe.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"separator.recipe.mjs","names":[],"sources":["../../../src/components/separator/separator.recipe.ts"],"sourcesContent":["import { sva } from '#styled-system/css/index.js'\n\nexport const separatorRecipe = sva({\n  slots: ['root'],\n  base: {\n    root: {\n      flexShrink: 0,\n      alignSelf: 'stretch',\n      borderStyle: 'solid',\n      borderColor: 'border.default',\n      borderWidth: '0',\n      borderBlockStartWidth: 'hairline',\n      _vertical: { borderBlockStartWidth: '0', borderInlineStartWidth: 'hairline' },\n      _highContrast: { borderColor: 'system.canvasText' },\n    },\n  },\n})\n"],"mappings":";;AAEA,MAAa,kBAAkB,IAAI;CACjC,OAAO,CAAC,MAAM;CACd,MAAM,EACJ,MAAM;EACJ,YAAY;EACZ,WAAW;EACX,aAAa;EACb,aAAa;EACb,aAAa;EACb,uBAAuB;EACvB,WAAW;GAAE,uBAAuB;GAAK,wBAAwB;EAAW;EAC5E,eAAe,EAAE,aAAa,oBAAoB;CACpD,EACF;AACF,CAAC"}

package/dist/components/signature-pad/index.d.mts

@@ -0,0 +1,2 @@
+import { SignatureDataUrlType, SignaturePad, SignaturePadRootProps, SignaturePadValueChangeDetails, SignaturePadValueChangeEndDetails, SignatureStrokeOptions } from "./signature-pad.mjs";
+export { type SignatureDataUrlType, SignaturePad, type SignaturePadRootProps, type SignaturePadValueChangeDetails, type SignaturePadValueChangeEndDetails, type SignatureStrokeOptions };

package/dist/components/signature-pad/index.mjs

@@ -0,0 +1,2 @@
+import { SignaturePad } from "./signature-pad.mjs";
+export { SignaturePad };

package/dist/components/signature-pad/signature-pad.d.mts

@@ -0,0 +1,44 @@
+import { TranslationOverrides } from "../../provider/translations.mjs";
+import { SynapseComponent } from "../../system/types.mjs";
+import { ValueChangeDetails } from "../details.mjs";
+import { Size } from "../../shared/size-scale.mjs";
+//#region src/components/signature-pad/signature-pad.d.ts
+export type SignatureDataUrlType = 'image/png' | 'image/jpeg' | 'image/svg+xml';
+export interface SignatureStrokeOptions {
+  size?: number;
+  thinning?: number;
+  smoothing?: number;
+  streamline?: number;
+  simulatePressure?: boolean;
+  fill?: string;
+}
+export type SignaturePadValueChangeDetails = ValueChangeDetails<readonly string[]>;
+export interface SignaturePadValueChangeEndDetails {
+  readonly value: readonly string[];
+  readonly getDataUrl: (type: SignatureDataUrlType, quality?: number) => Promise<string>;
+}
+export interface SignaturePadRootProps {
+  /** 제어되는 획들이며, SVG 패스 데이터로 표현합니다. */
+  value?: readonly string[];
+  /** 비제어 모드의 초기 획들. `value`를 주면 무시됩니다. */
+  defaultValue?: readonly string[];
+  /** 획이 확정될 때, 그리고 획을 긋는 도중에 호출됩니다. */
+  onValueChange?: (details: SignaturePadValueChangeDetails) => void;
+  /** 획이 끝났을 때 호출됩니다. 값을 저장할 시점은 이쪽입니다. */
+  onValueChangeEnd?: (details: SignaturePadValueChangeEndDetails) => void;
+  /** 획을 그리는 방식. */
+  stroke?: SignatureStrokeOptions;
+  /** 비활성화된 SignaturePad에는 그릴 수 없고, 탭 순서에도 들어가지 않습니다. */
+  disabled?: boolean;
+  /** 읽기 전용 SignaturePad는 획을 보여주지만 그 위에 그릴 수는 없습니다. */
+  readOnly?: boolean;
+  /** 이 SignaturePad에만 적용되는 접근성 문자열로, provider의 값보다 우선합니다. */
+  translations?: TranslationOverrides;
+  /** 하나뿐인 공용 척도를 따릅니다. 모든 컴포넌트와 마찬가지로 기본값은 `md`입니다. */
+  size?: Size;
+  /** 팩토리가 만드는 식별자를 덮어씁니다. 서버와 클라이언트에서 같은 값으로 유지됩니다. */
+  id?: string;
+}
+export declare const SignaturePad: SynapseComponent<"clearTrigger" | "control" | "guide" | "label" | "root" | "segment" | "segmentPath", "root", SignaturePadRootProps, never>;
+//#endregion
+//# sourceMappingURL=signature-pad.d.mts.map

package/dist/components/signature-pad/signature-pad.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"signature-pad.d.mts","names":[],"sources":["../../../src/components/signature-pad/signature-pad.tsx"],"mappings":";;;;;YAeY;iBAEK;EACf;EACA;EACA;EACA;EACA;EACA;;YAGU,iCAAiC;iBAE5B;WACN;WACA,aAAa,MAAM,sBAAsB,qBAAqB;;iBAGxD;;EAEf;;EAEA;;EAEA,iBAAiB,SAAS;;EAE1B,oBAAoB,SAAS;;EAE7B,SAAS;;EAET;;EAEA;;EAEA,eAAe;;EAEf,OAAO;;EAEP;;qBAkCW,cAAY,8GAAA"}

package/dist/components/signature-pad/signature-pad.mjs

@@ -0,0 +1,90 @@
+"use client";
+import { resolveSize } from "../../shared/size-scale.mjs";
+import { reset } from "../../icons/src/reset.mjs";
+import "../../icons/src/index.mjs";
+import { Icon } from "../../shared/icon.mjs";
+import { defineComponent } from "../../system/create-component.mjs";
+import { buttonPartClass } from "../../shared/button-style.mjs";
+import { signaturePadRecipe } from "./signature-pad.recipe.mjs";
+import { createElement } from "react";
+import { jsx } from "react/jsx-runtime";
+import * as signaturePad from "@zag-js/signature-pad";
+//#region src/components/signature-pad/signature-pad.tsx
+const segmentPaths = (api) => {
+	const committed = api.paths.map((path, index) => createElement(SignaturePad.SegmentPath, {
+		key: `stroke-${String(index)}`,
+		path
+	}));
+	if (api.currentPath === null) return committed;
+	return [...committed, createElement(SignaturePad.SegmentPath, {
+		key: "in-progress",
+		path: api.currentPath
+	})];
+};
+const toMachineProps = (props) => ({
+	...props.value === void 0 ? {} : { paths: props.value },
+	...props.defaultValue === void 0 ? {} : { defaultPaths: props.defaultValue },
+	...props.stroke === void 0 ? {} : { drawing: props.stroke },
+	...props.onValueChange === void 0 ? {} : { onDraw: (details) => props.onValueChange?.({ value: details.paths }) },
+	...props.onValueChangeEnd === void 0 ? {} : { onDrawEnd: (details) => props.onValueChangeEnd?.({
+		value: details.paths,
+		getDataUrl: details.getDataUrl
+	}) }
+});
+const idOf = (props) => typeof props["id"] === "string" ? props["id"] : void 0;
+const SignaturePad = defineComponent()({
+	name: "SignaturePad",
+	module: signaturePad,
+	rootPart: "root",
+	elements: {
+		segment: "svg",
+		segmentPath: "path",
+		label: "label"
+	},
+	getterProps: { segmentPath: ["path"] },
+	defaultContent: {
+		segment: segmentPaths,
+		clearTrigger: () => /* @__PURE__ */ jsx(Icon, { icon: reset })
+	},
+	machineTranslations: {
+		control: "signaturePad.control.label",
+		clearTrigger: "signaturePad.clearTrigger.label"
+	},
+	amendBehaviorProps: {
+		control: (_behaviorProps, api, _args, translate) => ({
+			"aria-roledescription": translate("signaturePad.control.roleDescription"),
+			"aria-labelledby": idOf(api.getLabelProps())
+		}),
+		label: () => ({ htmlFor: void 0 })
+	},
+	unrenderedGetters: ["getHiddenInputProps"],
+	field: {
+		ids: (field) => ({ label: field.label }),
+		describe: ["control"],
+		labelable: false
+	},
+	variantProps: [
+		"value",
+		"defaultValue",
+		"onValueChange",
+		"onValueChangeEnd",
+		"stroke",
+		"size"
+	],
+	useMachineProps: toMachineProps,
+	slots: (props) => {
+		const size = resolveSize(props.size, "SignaturePad");
+		return {
+			...signaturePadRecipe({ size }),
+			clearTrigger: buttonPartClass({
+				variant: "ghost",
+				tone: "neutral",
+				size
+			}, signaturePadRecipe.raw({ size }).clearTrigger)
+		};
+	}
+});
+//#endregion
+export { SignaturePad };
+
+//# sourceMappingURL=signature-pad.mjs.map

package/dist/components/signature-pad/signature-pad.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"signature-pad.mjs","names":[],"sources":["../../../src/components/signature-pad/signature-pad.tsx"],"sourcesContent":["'use client'\n\nimport { reset } from '@neurocle/synapse-icons'\nimport * as signaturePad from '@zag-js/signature-pad'\nimport { createElement } from 'react'\n\nimport type { ValueChangeDetails } from '#/components/details.ts'\nimport { signaturePadRecipe } from '#/components/signature-pad/signature-pad.recipe.ts'\nimport type { TranslationOverrides } from '#/provider/translations.ts'\nimport { buttonPartClass } from '#/shared/button-style.ts'\nimport { Icon } from '#/shared/icon.tsx'\nimport { resolveSize, type Size } from '#/shared/size-scale.ts'\nimport { defineComponent } from '#/system/create-component.ts'\nimport type { DefaultContent } from '#/system/types.ts'\n\nexport type SignatureDataUrlType = 'image/png' | 'image/jpeg' | 'image/svg+xml'\n\nexport interface SignatureStrokeOptions {\n  size?: number\n  thinning?: number\n  smoothing?: number\n  streamline?: number\n  simulatePressure?: boolean\n  fill?: string\n}\n\nexport type SignaturePadValueChangeDetails = ValueChangeDetails<readonly string[]>\n\nexport interface SignaturePadValueChangeEndDetails {\n  readonly value: readonly string[]\n  readonly getDataUrl: (type: SignatureDataUrlType, quality?: number) => Promise<string>\n}\n\nexport interface SignaturePadRootProps {\n  /** 제어되는 획들이며, SVG 패스 데이터로 표현합니다. */\n  value?: readonly string[]\n  /** 비제어 모드의 초기 획들. `value`를 주면 무시됩니다. */\n  defaultValue?: readonly string[]\n  /** 획이 확정될 때, 그리고 획을 긋는 도중에 호출됩니다. */\n  onValueChange?: (details: SignaturePadValueChangeDetails) => void\n  /** 획이 끝났을 때 호출됩니다. 값을 저장할 시점은 이쪽입니다. */\n  onValueChangeEnd?: (details: SignaturePadValueChangeEndDetails) => void\n  /** 획을 그리는 방식. */\n  stroke?: SignatureStrokeOptions\n  /** 비활성화된 SignaturePad에는 그릴 수 없고, 탭 순서에도 들어가지 않습니다. */\n  disabled?: boolean\n  /** 읽기 전용 SignaturePad는 획을 보여주지만 그 위에 그릴 수는 없습니다. */\n  readOnly?: boolean\n  /** 이 SignaturePad에만 적용되는 접근성 문자열로, provider의 값보다 우선합니다. */\n  translations?: TranslationOverrides\n  /** 하나뿐인 공용 척도를 따릅니다. 모든 컴포넌트와 마찬가지로 기본값은 `md`입니다. */\n  size?: Size\n  /** 팩토리가 만드는 식별자를 덮어씁니다. 서버와 클라이언트에서 같은 값으로 유지됩니다. */\n  id?: string\n}\n\nconst segmentPaths: DefaultContent<signaturePad.Api> = (api) => {\n  const committed = api.paths.map((path, index) =>\n    createElement(SignaturePad.SegmentPath, { key: `stroke-${String(index)}`, path }),\n  )\n  if (api.currentPath === null) return committed\n  return [\n    ...committed,\n    createElement(SignaturePad.SegmentPath, { key: 'in-progress', path: api.currentPath }),\n  ]\n}\n\nconst toMachineProps = (props: SignaturePadRootProps): Record<string, unknown> => ({\n  ...(props.value === undefined ? {} : { paths: props.value }),\n  ...(props.defaultValue === undefined ? {} : { defaultPaths: props.defaultValue }),\n  ...(props.stroke === undefined ? {} : { drawing: props.stroke }),\n  ...(props.onValueChange === undefined\n    ? {}\n    : {\n        onDraw: (details: { paths: string[] }) => props.onValueChange?.({ value: details.paths }),\n      }),\n  ...(props.onValueChangeEnd === undefined\n    ? {}\n    : {\n        onDrawEnd: (details: SignaturePadValueChangeEndDetails & { paths: readonly string[] }) =>\n          props.onValueChangeEnd?.({ value: details.paths, getDataUrl: details.getDataUrl }),\n      }),\n})\n\nconst idOf = (props: Readonly<Record<string, unknown>>): string | undefined =>\n  typeof props['id'] === 'string' ? props['id'] : undefined\n\nexport const SignaturePad = defineComponent<SignaturePadRootProps>()({\n  name: 'SignaturePad',\n  module: signaturePad,\n  rootPart: 'root',\n  elements: {\n    segment: 'svg',\n    segmentPath: 'path',\n    label: 'label',\n  },\n  getterProps: {\n    segmentPath: ['path'],\n  },\n  defaultContent: {\n    segment: segmentPaths,\n    clearTrigger: () => <Icon icon={reset} />,\n  },\n  machineTranslations: {\n    control: 'signaturePad.control.label',\n    clearTrigger: 'signaturePad.clearTrigger.label',\n  },\n  amendBehaviorProps: {\n    control: (_behaviorProps, api, _args, translate) => ({\n      'aria-roledescription': translate('signaturePad.control.roleDescription'),\n      'aria-labelledby': idOf(api.getLabelProps()),\n    }),\n    label: () => ({ htmlFor: undefined }),\n  },\n  unrenderedGetters: ['getHiddenInputProps'],\n  field: { ids: (field) => ({ label: field.label }), describe: ['control'], labelable: false },\n  variantProps: ['value', 'defaultValue', 'onValueChange', 'onValueChangeEnd', 'stroke', 'size'],\n  useMachineProps: toMachineProps,\n  slots: (props: SignaturePadRootProps) => {\n    const size = resolveSize(props.size, 'SignaturePad')\n    return {\n      ...signaturePadRecipe({ size }),\n      clearTrigger: buttonPartClass(\n        { variant: 'ghost', tone: 'neutral', size },\n        signaturePadRecipe.raw({ size }).clearTrigger,\n      ),\n    }\n  },\n})\n"],"mappings":";;;;;;;;;;;;AAwDA,MAAM,gBAAkD,QAAQ;CAC9D,MAAM,YAAY,IAAI,MAAM,KAAK,MAAM,UACrC,cAAc,aAAa,aAAa;EAAE,KAAK,UAAU,OAAO,KAAK;EAAK;CAAK,CAAC,CAClF;CACA,IAAI,IAAI,gBAAgB,MAAM,OAAO;CACrC,OAAO,CACL,GAAG,WACH,cAAc,aAAa,aAAa;EAAE,KAAK;EAAe,MAAM,IAAI;CAAY,CAAC,CACvF;AACF;AAEA,MAAM,kBAAkB,WAA2D;CACjF,GAAI,MAAM,UAAU,KAAA,IAAY,CAAC,IAAI,EAAE,OAAO,MAAM,MAAM;CAC1D,GAAI,MAAM,iBAAiB,KAAA,IAAY,CAAC,IAAI,EAAE,cAAc,MAAM,aAAa;CAC/E,GAAI,MAAM,WAAW,KAAA,IAAY,CAAC,IAAI,EAAE,SAAS,MAAM,OAAO;CAC9D,GAAI,MAAM,kBAAkB,KAAA,IACxB,CAAC,IACD,EACE,SAAS,YAAiC,MAAM,gBAAgB,EAAE,OAAO,QAAQ,MAAM,CAAC,EAC1F;CACJ,GAAI,MAAM,qBAAqB,KAAA,IAC3B,CAAC,IACD,EACE,YAAY,YACV,MAAM,mBAAmB;EAAE,OAAO,QAAQ;EAAO,YAAY,QAAQ;CAAW,CAAC,EACrF;AACN;AAEA,MAAM,QAAQ,UACZ,OAAO,MAAM,UAAU,WAAW,MAAM,QAAQ,KAAA;AAElD,MAAa,eAAe,gBAAuC,CAAC,CAAC;CACnE,MAAM;CACN,QAAQ;CACR,UAAU;CACV,UAAU;EACR,SAAS;EACT,aAAa;EACb,OAAO;CACT;CACA,aAAa,EACX,aAAa,CAAC,MAAM,EACtB;CACA,gBAAgB;EACd,SAAS;EACT,oBAAoB,oBAAC,MAAD,EAAM,MAAM,MAAQ,CAAA;CAC1C;CACA,qBAAqB;EACnB,SAAS;EACT,cAAc;CAChB;CACA,oBAAoB;EAClB,UAAU,gBAAgB,KAAK,OAAO,eAAe;GACnD,wBAAwB,UAAU,sCAAsC;GACxE,mBAAmB,KAAK,IAAI,cAAc,CAAC;EAC7C;EACA,cAAc,EAAE,SAAS,KAAA,EAAU;CACrC;CACA,mBAAmB,CAAC,qBAAqB;CACzC,OAAO;EAAE,MAAM,WAAW,EAAE,OAAO,MAAM,MAAM;EAAI,UAAU,CAAC,SAAS;EAAG,WAAW;CAAM;CAC3F,cAAc;EAAC;EAAS;EAAgB;EAAiB;EAAoB;EAAU;CAAM;CAC7F,iBAAiB;CACjB,QAAQ,UAAiC;EACvC,MAAM,OAAO,YAAY,MAAM,MAAM,cAAc;EACnD,OAAO;GACL,GAAG,mBAAmB,EAAE,KAAK,CAAC;GAC9B,cAAc,gBACZ;IAAE,SAAS;IAAS,MAAM;IAAW;GAAK,GAC1C,mBAAmB,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,YACnC;EACF;CACF;AACF,CAAC"}

package/dist/components/signature-pad/signature-pad.recipe.mjs

@@ -0,0 +1,111 @@
+import { sva } from "../../react/styled-system/css/sva.mjs";
+//#region src/components/signature-pad/signature-pad.recipe.ts
+const signaturePadRecipe = sva({
+	slots: [
+		"root",
+		"control",
+		"segment",
+		"segmentPath",
+		"guide",
+		"clearTrigger",
+		"label"
+	],
+	base: {
+		root: {
+			display: "flex",
+			flexDirection: "column",
+			gap: "gap.inline",
+			color: "foreground.default",
+			_disabled: { color: "foreground.disabled" }
+		},
+		control: {
+			position: "relative",
+			width: "fill",
+			minHeight: "surface.overlayMin",
+			rounded: "control",
+			borderWidth: "hairline",
+			borderStyle: "solid",
+			borderColor: "border.default",
+			bg: "surface.raised",
+			overflow: "hidden",
+			transitionProperty: "colors",
+			transitionDuration: "interaction",
+			transitionTimingFunction: "interaction",
+			outlineColor: "border.focus",
+			"&:not([data-disabled]):hover": { borderColor: "primary.default" },
+			_focusVisible: {
+				outlineStyle: "solid",
+				outlineWidth: "focus",
+				outlineOffset: "inset.compact",
+				outlineColor: "border.focus"
+			},
+			_disabled: {
+				bg: "background.muted",
+				borderColor: "border.default",
+				cursor: "not-allowed",
+				_highContrast: { borderColor: "system.grayText" }
+			}
+		},
+		segment: { color: "foreground.default" },
+		segmentPath: { fill: "foreground.default" },
+		guide: {
+			position: "absolute",
+			insetInlineStart: "inset.surface",
+			insetInlineEnd: "inset.surface",
+			insetBlockEnd: "inset.surface",
+			borderBlockEndWidth: "hairline",
+			borderBlockEndStyle: "dashed",
+			borderColor: "border.default",
+			pointerEvents: "none"
+		},
+		clearTrigger: {
+			position: "absolute",
+			insetBlockStart: "inset.compact",
+			insetInlineEnd: "inset.compact",
+			minWidth: "target.minimum",
+			_focusVisible: { outlineOffset: "-inset.compact" }
+		},
+		label: {
+			textStyle: "detail",
+			color: "foreground.muted",
+			_disabled: { color: "foreground.disabled" }
+		}
+	},
+	variants: { size: {
+		xs: {
+			root: { textStyle: "detail" },
+			label: { textStyle: "detail" },
+			guide: { insetBlockEnd: "inset.compact" },
+			clearTrigger: { minWidth: "control.xs" }
+		},
+		sm: {
+			root: { textStyle: "body" },
+			label: { textStyle: "detail" },
+			guide: { insetBlockEnd: "inset.overlay" },
+			clearTrigger: { minWidth: "control.sm" }
+		},
+		md: {
+			root: { textStyle: "body" },
+			label: { textStyle: "detail" },
+			guide: { insetBlockEnd: "inset.surface" },
+			clearTrigger: { minWidth: "control.md" }
+		},
+		lg: {
+			root: { textStyle: "body" },
+			label: { textStyle: "detail" },
+			guide: { insetBlockEnd: "inset.surface" },
+			clearTrigger: { minWidth: "control.lg" }
+		},
+		xl: {
+			root: { textStyle: "subtitle" },
+			label: { textStyle: "body" },
+			guide: { insetBlockEnd: "inset.surface" },
+			clearTrigger: { minWidth: "control.xl" }
+		}
+	} },
+	defaultVariants: { size: "md" }
+});
+//#endregion
+export { signaturePadRecipe };
+
+//# sourceMappingURL=signature-pad.recipe.mjs.map

package/dist/components/signature-pad/signature-pad.recipe.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"signature-pad.recipe.mjs","names":[],"sources":["../../../src/components/signature-pad/signature-pad.recipe.ts"],"sourcesContent":["import { sva } from '#styled-system/css/index.js'\n\nexport const signaturePadRecipe = sva({\n  slots: ['root', 'control', 'segment', 'segmentPath', 'guide', 'clearTrigger', 'label'],\n  base: {\n    root: {\n      display: 'flex',\n      flexDirection: 'column',\n      gap: 'gap.inline',\n      color: 'foreground.default',\n      _disabled: { color: 'foreground.disabled' },\n    },\n    control: {\n      position: 'relative',\n      width: 'fill',\n      minHeight: 'surface.overlayMin',\n      rounded: 'control',\n      borderWidth: 'hairline',\n      borderStyle: 'solid',\n      borderColor: 'border.default',\n      bg: 'surface.raised',\n      overflow: 'hidden',\n      transitionProperty: 'colors',\n      transitionDuration: 'interaction',\n      transitionTimingFunction: 'interaction',\n      outlineColor: 'border.focus',\n      '&:not([data-disabled]):hover': { borderColor: 'primary.default' },\n      _focusVisible: {\n        outlineStyle: 'solid',\n        outlineWidth: 'focus',\n        outlineOffset: 'inset.compact',\n        outlineColor: 'border.focus',\n      },\n      _disabled: {\n        bg: 'background.muted',\n        borderColor: 'border.default',\n        cursor: 'not-allowed',\n        _highContrast: { borderColor: 'system.grayText' },\n      },\n    },\n    segment: {\n      color: 'foreground.default',\n    },\n    segmentPath: {\n      fill: 'foreground.default',\n    },\n    guide: {\n      position: 'absolute',\n      insetInlineStart: 'inset.surface',\n      insetInlineEnd: 'inset.surface',\n      insetBlockEnd: 'inset.surface',\n      borderBlockEndWidth: 'hairline',\n      borderBlockEndStyle: 'dashed',\n      borderColor: 'border.default',\n      pointerEvents: 'none',\n    },\n    clearTrigger: {\n      position: 'absolute',\n      insetBlockStart: 'inset.compact',\n      insetInlineEnd: 'inset.compact',\n      minWidth: 'target.minimum',\n      _focusVisible: { outlineOffset: '-inset.compact' },\n    },\n    label: {\n      textStyle: 'detail',\n      color: 'foreground.muted',\n      _disabled: { color: 'foreground.disabled' },\n    },\n  },\n  variants: {\n    size: {\n      xs: {\n        root: { textStyle: 'detail' },\n        label: { textStyle: 'detail' },\n        guide: { insetBlockEnd: 'inset.compact' },\n        clearTrigger: { minWidth: 'control.xs' },\n      },\n      sm: {\n        root: { textStyle: 'body' },\n        label: { textStyle: 'detail' },\n        guide: { insetBlockEnd: 'inset.overlay' },\n        clearTrigger: { minWidth: 'control.sm' },\n      },\n      md: {\n        root: { textStyle: 'body' },\n        label: { textStyle: 'detail' },\n        guide: { insetBlockEnd: 'inset.surface' },\n        clearTrigger: { minWidth: 'control.md' },\n      },\n      lg: {\n        root: { textStyle: 'body' },\n        label: { textStyle: 'detail' },\n        guide: { insetBlockEnd: 'inset.surface' },\n        clearTrigger: { minWidth: 'control.lg' },\n      },\n      xl: {\n        root: { textStyle: 'subtitle' },\n        label: { textStyle: 'body' },\n        guide: { insetBlockEnd: 'inset.surface' },\n        clearTrigger: { minWidth: 'control.xl' },\n      },\n    },\n  },\n  defaultVariants: { size: 'md' },\n})\n"],"mappings":";;AAEA,MAAa,qBAAqB,IAAI;CACpC,OAAO;EAAC;EAAQ;EAAW;EAAW;EAAe;EAAS;EAAgB;CAAO;CACrF,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,eAAe;GACf,KAAK;GACL,OAAO;GACP,WAAW,EAAE,OAAO,sBAAsB;EAC5C;EACA,SAAS;GACP,UAAU;GACV,OAAO;GACP,WAAW;GACX,SAAS;GACT,aAAa;GACb,aAAa;GACb,aAAa;GACb,IAAI;GACJ,UAAU;GACV,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,cAAc;GACd,gCAAgC,EAAE,aAAa,kBAAkB;GACjE,eAAe;IACb,cAAc;IACd,cAAc;IACd,eAAe;IACf,cAAc;GAChB;GACA,WAAW;IACT,IAAI;IACJ,aAAa;IACb,QAAQ;IACR,eAAe,EAAE,aAAa,kBAAkB;GAClD;EACF;EACA,SAAS,EACP,OAAO,qBACT;EACA,aAAa,EACX,MAAM,qBACR;EACA,OAAO;GACL,UAAU;GACV,kBAAkB;GAClB,gBAAgB;GAChB,eAAe;GACf,qBAAqB;GACrB,qBAAqB;GACrB,aAAa;GACb,eAAe;EACjB;EACA,cAAc;GACZ,UAAU;GACV,iBAAiB;GACjB,gBAAgB;GAChB,UAAU;GACV,eAAe,EAAE,eAAe,iBAAiB;EACnD;EACA,OAAO;GACL,WAAW;GACX,OAAO;GACP,WAAW,EAAE,OAAO,sBAAsB;EAC5C;CACF;CACA,UAAU,EACR,MAAM;EACJ,IAAI;GACF,MAAM,EAAE,WAAW,SAAS;GAC5B,OAAO,EAAE,WAAW,SAAS;GAC7B,OAAO,EAAE,eAAe,gBAAgB;GACxC,cAAc,EAAE,UAAU,aAAa;EACzC;EACA,IAAI;GACF,MAAM,EAAE,WAAW,OAAO;GAC1B,OAAO,EAAE,WAAW,SAAS;GAC7B,OAAO,EAAE,eAAe,gBAAgB;GACxC,cAAc,EAAE,UAAU,aAAa;EACzC;EACA,IAAI;GACF,MAAM,EAAE,WAAW,OAAO;GAC1B,OAAO,EAAE,WAAW,SAAS;GAC7B,OAAO,EAAE,eAAe,gBAAgB;GACxC,cAAc,EAAE,UAAU,aAAa;EACzC;EACA,IAAI;GACF,MAAM,EAAE,WAAW,OAAO;GAC1B,OAAO,EAAE,WAAW,SAAS;GAC7B,OAAO,EAAE,eAAe,gBAAgB;GACxC,cAAc,EAAE,UAAU,aAAa;EACzC;EACA,IAAI;GACF,MAAM,EAAE,WAAW,WAAW;GAC9B,OAAO,EAAE,WAAW,OAAO;GAC3B,OAAO,EAAE,eAAe,gBAAgB;GACxC,cAAc,EAAE,UAAU,aAAa;EACzC;CACF,EACF;CACA,iBAAiB,EAAE,MAAM,KAAK;AAChC,CAAC"}

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

@@ -0,0 +1,2 @@
+import { Skeleton, SkeletonRootProps } from "./skeleton.mjs";
+export { Skeleton, type SkeletonRootProps };

package/dist/components/skeleton/index.mjs

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

package/dist/components/skeleton/skeleton.anatomy.mjs

@@ -0,0 +1,8 @@
+import { createAnatomy } from "@zag-js/anatomy";
+//#region src/components/skeleton/skeleton.anatomy.ts
+const anatomy = createAnatomy("skeleton").parts("root");
+const parts = anatomy.build();
+//#endregion
+export { anatomy, parts };
+
+//# sourceMappingURL=skeleton.anatomy.mjs.map

package/dist/components/skeleton/skeleton.anatomy.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"skeleton.anatomy.mjs","names":[],"sources":["../../../src/components/skeleton/skeleton.anatomy.ts"],"sourcesContent":["import { createAnatomy } from '@zag-js/anatomy'\n\nexport const anatomy = createAnatomy('skeleton').parts('root')\n\nexport const parts = anatomy.build()\n"],"mappings":";;AAEA,MAAa,UAAU,cAAc,UAAU,CAAC,CAAC,MAAM,MAAM;AAE7D,MAAa,QAAQ,QAAQ,MAAM"}

package/dist/components/skeleton/skeleton.connect.mjs

@@ -0,0 +1,26 @@
+import { __exportAll } from "../../_virtual/_rolldown/runtime.mjs";
+import { anatomy, parts } from "./skeleton.anatomy.mjs";
+//#region src/components/skeleton/skeleton.connect.ts
+var skeleton_connect_exports = /* @__PURE__ */ __exportAll({
+	anatomy: () => anatomy,
+	connect: () => connect,
+	machine: () => null,
+	props: () => props
+});
+const props = ["id", "loading"];
+function connect(machineProps) {
+	const loading = machineProps["loading"] !== false;
+	return {
+		loading,
+		getRootProps: () => loading ? {
+			...parts.root.attrs,
+			"aria-hidden": true,
+			inert: true,
+			"data-loading": ""
+		} : { ...parts.root.attrs }
+	};
+}
+//#endregion
+export { anatomy, connect, props, skeleton_connect_exports };
+
+//# sourceMappingURL=skeleton.connect.mjs.map

package/dist/components/skeleton/skeleton.connect.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"skeleton.connect.mjs","names":[],"sources":["../../../src/components/skeleton/skeleton.connect.ts"],"sourcesContent":["import { parts } from '#/components/skeleton/skeleton.anatomy.ts'\n\nexport { anatomy } from '#/components/skeleton/skeleton.anatomy.ts'\n\nexport const machine = null\n\nexport const props: readonly string[] = ['id', 'loading']\n\nexport interface SkeletonApi {\n  loading: boolean\n  getRootProps: () => Record<string, unknown>\n}\n\nexport function connect(machineProps: Readonly<Record<string, unknown>>): SkeletonApi {\n  const loading = machineProps['loading'] !== false\n  return {\n    loading,\n    getRootProps: () =>\n      loading\n        ? { ...parts.root.attrs, 'aria-hidden': true, inert: true, 'data-loading': '' }\n        : { ...parts.root.attrs },\n  }\n}\n"],"mappings":";;;;;;;;;AAMA,MAAa,QAA2B,CAAC,MAAM,SAAS;AAOxD,SAAgB,QAAQ,cAA8D;CACpF,MAAM,UAAU,aAAa,eAAe;CAC5C,OAAO;EACL;EACA,oBACE,UACI;GAAE,GAAG,MAAM,KAAK;GAAO,eAAe;GAAM,OAAO;GAAM,gBAAgB;EAAG,IAC5E,EAAE,GAAG,MAAM,KAAK,MAAM;CAC9B;AACF"}

package/dist/components/skeleton/skeleton.d.mts

@@ -0,0 +1,9 @@
+import { SynapseComponent } from "../../system/types.mjs";
+//#region src/components/skeleton/skeleton.d.ts
+export interface SkeletonRootProps {
+  /** 사용처가 소유한 불러오기가 진행 중인지. `true`(기본값)인 동안 자식은 자리와 크기만 남긴 채 가려지고 보조기술과 포인터에서 빠지며, 그 자리에 자리표시 모양이 그려집니다. `false`가 되면 자식이 그대로 나타나고 Skeleton은 레이아웃에 아무 상자도 남기지 않습니다. */
+  loading?: boolean;
+}
+export declare const Skeleton: SynapseComponent<"root", "root", SkeletonRootProps, never>;
+//#endregion
+//# sourceMappingURL=skeleton.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"skeleton.d.mts","names":[],"sources":["../../../src/components/skeleton/skeleton.tsx"],"mappings":";;iBAMiB;;EAEf;;qBAGW,UAAQ,iCAAA"}

package/dist/components/skeleton/skeleton.mjs

@@ -0,0 +1,16 @@
+"use client";
+import { defineComponent } from "../../system/create-component.mjs";
+import { skeleton_connect_exports } from "./skeleton.connect.mjs";
+import { skeletonRecipe } from "./skeleton.recipe.mjs";
+//#region src/components/skeleton/skeleton.tsx
+const Skeleton = defineComponent()({
+	name: "Skeleton",
+	module: skeleton_connect_exports,
+	rootPart: "root",
+	rootElement: "div",
+	slots: () => skeletonRecipe()
+});
+//#endregion
+export { Skeleton };
+
+//# sourceMappingURL=skeleton.mjs.map

package/dist/components/skeleton/skeleton.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"skeleton.mjs","names":["skeleton"],"sources":["../../../src/components/skeleton/skeleton.tsx"],"sourcesContent":["'use client'\n\nimport * as skeleton from '#/components/skeleton/skeleton.connect.ts'\nimport { skeletonRecipe } from '#/components/skeleton/skeleton.recipe.ts'\nimport { defineComponent } from '#/system/create-component.ts'\n\nexport interface SkeletonRootProps {\n  /** 사용처가 소유한 불러오기가 진행 중인지. `true`(기본값)인 동안 자식은 자리와 크기만 남긴 채 가려지고 보조기술과 포인터에서 빠지며, 그 자리에 자리표시 모양이 그려집니다. `false`가 되면 자식이 그대로 나타나고 Skeleton은 레이아웃에 아무 상자도 남기지 않습니다. */\n  loading?: boolean\n}\n\nexport const Skeleton = defineComponent<SkeletonRootProps>()({\n  name: 'Skeleton',\n  module: skeleton,\n  rootPart: 'root',\n  rootElement: 'div',\n  slots: () => skeletonRecipe(),\n})\n"],"mappings":";;;;;AAWA,MAAa,WAAW,gBAAmC,CAAC,CAAC;CAC3D,MAAM;CACN,QAAQA;CACR,UAAU;CACV,aAAa;CACb,aAAa,eAAe;AAC9B,CAAC"}

package/dist/components/skeleton/skeleton.recipe.mjs

@@ -0,0 +1,46 @@
+import { sva } from "../../react/styled-system/css/sva.mjs";
+//#region src/components/skeleton/skeleton.recipe.ts
+const skeletonRecipe = sva({
+	slots: ["root"],
+	base: { root: {
+		display: "contents",
+		"&[data-loading]": {
+			display: "block",
+			position: "relative",
+			overflow: "hidden",
+			rounded: "control",
+			bg: "background.muted",
+			color: "surface.transparent",
+			pointerEvents: "none",
+			userSelect: "none",
+			"& *": { visibility: "hidden" },
+			_after: {
+				content: "\"\"",
+				position: "absolute",
+				insetBlock: "inset.none",
+				"--skeleton-start": "-100%",
+				insetInlineStart: "var(--skeleton-start)",
+				width: "fill",
+				bgGradient: "to-r",
+				gradientFrom: "surface.transparent",
+				gradientVia: "background.subtle",
+				gradientTo: "surface.transparent",
+				"--progress-travel": "200%",
+				"--skeleton-sweep": "calc(token(durations.expand) * 6)",
+				animationName: "progressX",
+				animationDuration: "var(--skeleton-sweep)",
+				animationIterationCount: "infinite",
+				_motionReduce: { display: "none" }
+			},
+			_highContrast: {
+				outlineStyle: "solid",
+				outlineWidth: "hairline",
+				outlineColor: "system.grayText"
+			}
+		}
+	} }
+});
+//#endregion
+export { skeletonRecipe };
+
+//# sourceMappingURL=skeleton.recipe.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"skeleton.recipe.mjs","names":[],"sources":["../../../src/components/skeleton/skeleton.recipe.ts"],"sourcesContent":["import { sva } from '#styled-system/css/index.js'\n\nexport const skeletonRecipe = sva({\n  slots: ['root'],\n  base: {\n    root: {\n      display: 'contents',\n      '&[data-loading]': {\n        display: 'block',\n        position: 'relative',\n        overflow: 'hidden',\n        rounded: 'control',\n        bg: 'background.muted',\n        color: 'surface.transparent',\n        pointerEvents: 'none',\n        userSelect: 'none',\n        '& *': { visibility: 'hidden' },\n        _after: {\n          content: '\"\"',\n          position: 'absolute',\n          insetBlock: 'inset.none',\n          '--skeleton-start': '-100%',\n          insetInlineStart: 'var(--skeleton-start)',\n          width: 'fill',\n          bgGradient: 'to-r',\n          gradientFrom: 'surface.transparent',\n          gradientVia: 'background.subtle',\n          gradientTo: 'surface.transparent',\n          '--progress-travel': '200%',\n          '--skeleton-sweep': 'calc(token(durations.expand) * 6)',\n          animationName: 'progressX',\n          animationDuration: 'var(--skeleton-sweep)',\n          animationIterationCount: 'infinite',\n          _motionReduce: { display: 'none' },\n        },\n        _highContrast: {\n          outlineStyle: 'solid',\n          outlineWidth: 'hairline',\n          outlineColor: 'system.grayText',\n        },\n      },\n    },\n  },\n})\n"],"mappings":";;AAEA,MAAa,iBAAiB,IAAI;CAChC,OAAO,CAAC,MAAM;CACd,MAAM,EACJ,MAAM;EACJ,SAAS;EACT,mBAAmB;GACjB,SAAS;GACT,UAAU;GACV,UAAU;GACV,SAAS;GACT,IAAI;GACJ,OAAO;GACP,eAAe;GACf,YAAY;GACZ,OAAO,EAAE,YAAY,SAAS;GAC9B,QAAQ;IACN,SAAS;IACT,UAAU;IACV,YAAY;IACZ,oBAAoB;IACpB,kBAAkB;IAClB,OAAO;IACP,YAAY;IACZ,cAAc;IACd,aAAa;IACb,YAAY;IACZ,qBAAqB;IACrB,oBAAoB;IACpB,eAAe;IACf,mBAAmB;IACnB,yBAAyB;IACzB,eAAe,EAAE,SAAS,OAAO;GACnC;GACA,eAAe;IACb,cAAc;IACd,cAAc;IACd,cAAc;GAChB;EACF;CACF,EACF;AACF,CAAC"}

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

@@ -0,0 +1,2 @@
+import { Slider, SliderFocusChangeDetails, SliderOrigin, SliderRootProps, SliderThumbAlignment, SliderThumbCollisionBehavior, SliderValueChangeDetails, SliderValueTextDetails } from "./slider.mjs";
+export { Slider, type SliderFocusChangeDetails, type SliderOrigin, type SliderRootProps, type SliderThumbAlignment, type SliderThumbCollisionBehavior, type SliderValueChangeDetails, type SliderValueTextDetails };

package/dist/components/slider/index.mjs

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

package/dist/components/slider/slider.d.mts

@@ -0,0 +1,72 @@
+import { Orientation, SynapseComponent } from "../../system/types.mjs";
+import { ValueChangeDetails } from "../details.mjs";
+import { Size } from "../../shared/size-scale.mjs";
+//#region src/components/slider/slider.d.ts
+export type SliderValueChangeDetails = ValueChangeDetails<readonly number[]>;
+export interface SliderFocusChangeDetails {
+  readonly focusedIndex: number;
+  readonly value: readonly number[];
+}
+export interface SliderValueTextDetails {
+  readonly value: number;
+  readonly index: number;
+}
+export type SliderOrigin = 'start' | 'center' | 'end';
+export type SliderThumbAlignment = 'contain' | 'center';
+export type SliderThumbCollisionBehavior = 'none' | 'push' | 'swap';
+export interface SliderRootProps {
+  /**
+   * 제어되는 값이며, 언제나 배열입니다. 범위 패턴은 별도 컴포넌트가 아니라 같은 Slider의
+   * variant라서 값의 형태도 하나입니다. 항목이 하나면 단일 값 패턴이고, 둘이면 범위 패턴이며,
+   * machine은 그보다 많은 경우도 지원합니다.
+   */
+  value?: readonly number[];
+  /** 비제어 모드의 초기 값. `value`를 주면 무시됩니다. */
+  defaultValue?: readonly number[];
+  /** 값이 바뀔 때마다 호출됩니다. 드래그 도중의 각 단계도 포함합니다. */
+  onValueChange?: (details: SliderValueChangeDetails) => void;
+  /** 드래그나 키 반복이 가라앉은 뒤 호출됩니다. 값을 저장할 시점은 이쪽입니다. */
+  onValueChangeEnd?: (details: SliderValueChangeDetails) => void;
+  /** 범위 Slider에서 키보드가 썸 사이를 오갈 때 호출됩니다. */
+  onFocusChange?: (details: SliderFocusChangeDetails) => void;
+  /** 가장 낮은 값. 기본값은 0입니다. */
+  min?: number;
+  /** 가장 높은 값. 기본값은 100입니다. */
+  max?: number;
+  /** 화살표 키와 드래그의 단위. 기본값은 1입니다. */
+  step?: number;
+  /** PageUp/PageDown과 Shift+화살표의 단위. 기본값은 열 스텝입니다. */
+  largeStep?: number;
+  /**
+   * 범위 패턴의 두 썸이 지켜야 하는 간격이며, 스텝 수로 세요. 썸이 하나면 아무 효과가 없습니다.
+   */
+  minStepsBetweenThumbs?: number;
+  /** 범위 패턴의 두 썸이 서로에게 끌려 들어갔을 때 보이는 동작. */
+  thumbCollisionBehavior?: SliderThumbCollisionBehavior;
+  /** 채워진 범위가 시작되는 지점. 기본값은 `start`입니다. */
+  origin?: SliderOrigin;
+  /** Slider가 배치되는 축. 기본값은 `horizontal`입니다. */
+  orientation?: Orientation;
+  /** 썸을 트랙 경계 안에 붙잡아 둘지 여부. 기본값은 `center`입니다. */
+  thumbAlignment?: SliderThumbAlignment;
+  /**
+   * 보조 기술에 값의 이름을 지어 줍니다 — `"42"`가 아니라 `"42 percent"`처럼.
+   *
+   * machine은 그 결과를 `aria-valuetext`에 넣고, 스크린 리더는 숫자 대신 그것을 읽습니다. 이것이
+   * 없으면 통화나 평점이 맨 정수로 읽힙니다.
+   */
+  getAriaValueText?: (details: SliderValueTextDetails) => string;
+  /** 비활성화된 Slider는 반응하지 않고 탭 순서에도 들어가지 않습니다. */
+  disabled?: boolean;
+  /** 읽기 전용 Slider는 포커스하고 읽을 수는 있지만 바꿀 수는 없습니다. */
+  readOnly?: boolean;
+  /** 보조 기술에 `aria-invalid`로 알립니다. */
+  invalid?: boolean;
+  /** 하나뿐인 공용 척도를 따릅니다. 모든 컴포넌트와 마찬가지로 기본값은 `md`입니다. */
+  size?: Size;
+  /** 팩토리가 만드는 식별자를 덮어씁니다. 서버와 클라이언트에서 같은 값으로 유지됩니다. */
+  id?: string;
+}
+export declare const Slider: SynapseComponent<"control" | "draggingIndicator" | "label" | "marker" | "markerGroup" | "range" | "root" | "thumb" | "track" | "valueText", "root", SliderRootProps, never>;
+//#endregion
+//# sourceMappingURL=slider.d.mts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"slider.d.mts","names":[],"sources":["../../../src/components/slider/slider.tsx"],"mappings":";;;;YAUY,2BAA2B;iBAEtB;WACN;WACA;;iBAGM;WACN;WACA;;YAGC;YAEA;YAEA;iBAEK;;;;;;EAMf;;EAEA;;EAEA,iBAAiB,SAAS;;EAE1B,oBAAoB,SAAS;;EAE7B,iBAAiB,SAAS;;EAE1B;;EAEA;;EAEA;;EAEA;;;;EAIA;;EAEA,yBAAyB;;EAEzB,SAAS;;EAET,cAAc;;EAEd,iBAAiB;;;;;;;EAOjB,oBAAoB,SAAS;;EAE7B;;EAEA;;EAEA;;EAEA,OAAO;;EAEP;;qBAGW,QAAM,oJAAA"}