@gunkin/uiify 0.0.22-alpha → 0.0.25-alpha

package/dist/components/radio-group/RadioGroup.js

@@ -8,7 +8,9 @@ function RadioGroup({
   disabled = false,
   orientation = "vertical",
   className,
-  "aria-label": ariaLabel
+  slotProps,
+  "aria-label": ariaLabel,
+  ...rootProps
 }) {
   const resolvedItems = items.map((item) => ({
     ...item,
@@ -19,6 +21,7 @@ function RadioGroup({
     {
       ...className !== void 0 ? { className } : {},
       ...name !== void 0 ? { name } : {},
+      rootProps,
       id,
       items: resolvedItems,
       isChecked: (item) => item.value === defaultValue,
@@ -26,6 +29,7 @@ function RadioGroup({
       kind: "single",
       namespace: "radio-group",
       orientation,
+      ...slotProps !== void 0 ? { slotProps } : {},
       rootAttributes: { "aria-label": ariaLabel, "data-disabled": disabled ? "" : void 0 }
     }
   );

package/dist/components/radio-group/RadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/radio-group/RadioGroup.tsx"],"sourcesContent":["import type { ReactElement } from \"react\";\nimport { ChoiceGroup } from \"../internal/choice-family/ChoiceGroup.js\";\nimport type { RadioGroupItem, RadioGroupProps } from \"./types.js\";\n\nexport function RadioGroup({\n  id,\n  items,\n  defaultValue,\n  name,\n  disabled = false,\n  orientation = \"vertical\",\n  className,\n  \"aria-label\": ariaLabel,\n}: RadioGroupProps): ReactElement {\n  const resolvedItems = items.map((item) => ({\n    ...item,\n    disabled: disabled || item.disabled === true,\n  }));\n\n  return (\n    <ChoiceGroup<RadioGroupItem>\n      {...(className !== undefined ? { className } : {})}\n      {...(name !== undefined ? { name } : {})}\n      id={id}\n      items={resolvedItems}\n      isChecked={(item) => item.value === defaultValue}\n      itemInputClassName={(item) => item.className}\n      kind=\"single\"\n      namespace=\"radio-group\"\n      orientation={orientation}\n      rootAttributes={{ \"aria-label\": ariaLabel, \"data-disabled\": disabled ? \"\" : undefined }}\n    />\n  );\n}\nRadioGroup.displayName = \"RadioGroup\";\n"],"mappings":"AAoBI;AAnBJ,SAAS,mBAAmB;AAGrB,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,cAAc;AAAA,EACd;AAAA,EACA,cAAc;AAChB,GAAkC;AAChC,QAAM,gBAAgB,MAAM,IAAI,CAAC,UAAU;AAAA,IACzC,GAAG;AAAA,IACH,UAAU,YAAY,KAAK,aAAa;AAAA,EAC1C,EAAE;AAEF,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAI,cAAc,SAAY,EAAE,UAAU,IAAI,CAAC;AAAA,MAC/C,GAAI,SAAS,SAAY,EAAE,KAAK,IAAI,CAAC;AAAA,MACtC;AAAA,MACA,OAAO;AAAA,MACP,WAAW,CAAC,SAAS,KAAK,UAAU;AAAA,MACpC,oBAAoB,CAAC,SAAS,KAAK;AAAA,MACnC,MAAK;AAAA,MACL,WAAU;AAAA,MACV;AAAA,MACA,gBAAgB,EAAE,cAAc,WAAW,iBAAiB,WAAW,KAAK,OAAU;AAAA;AAAA,EACxF;AAEJ;AACA,WAAW,cAAc;","names":[]}
+{"version":3,"sources":["../../../src/components/radio-group/RadioGroup.tsx"],"sourcesContent":["import type { ReactElement } from \"react\";\nimport { ChoiceGroup } from \"../internal/choice-family/ChoiceGroup.js\";\nimport type { RadioGroupItem, RadioGroupProps } from \"./types.js\";\n\nexport function RadioGroup({\n  id,\n  items,\n  defaultValue,\n  name,\n  disabled = false,\n  orientation = \"vertical\",\n  className,\n  slotProps,\n  \"aria-label\": ariaLabel,\n  ...rootProps\n}: RadioGroupProps): ReactElement {\n  const resolvedItems = items.map((item) => ({\n    ...item,\n    disabled: disabled || item.disabled === true,\n  }));\n\n  return (\n    <ChoiceGroup<RadioGroupItem>\n      {...(className !== undefined ? { className } : {})}\n      {...(name !== undefined ? { name } : {})}\n      rootProps={rootProps}\n      id={id}\n      items={resolvedItems}\n      isChecked={(item) => item.value === defaultValue}\n      itemInputClassName={(item) => item.className}\n      kind=\"single\"\n      namespace=\"radio-group\"\n      orientation={orientation}\n      {...(slotProps !== undefined ? { slotProps } : {})}\n      rootAttributes={{ \"aria-label\": ariaLabel, \"data-disabled\": disabled ? \"\" : undefined }}\n    />\n  );\n}\nRadioGroup.displayName = \"RadioGroup\";\n"],"mappings":"AAsBI;AArBJ,SAAS,mBAAmB;AAGrB,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,GAAG;AACL,GAAkC;AAChC,QAAM,gBAAgB,MAAM,IAAI,CAAC,UAAU;AAAA,IACzC,GAAG;AAAA,IACH,UAAU,YAAY,KAAK,aAAa;AAAA,EAC1C,EAAE;AAEF,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAI,cAAc,SAAY,EAAE,UAAU,IAAI,CAAC;AAAA,MAC/C,GAAI,SAAS,SAAY,EAAE,KAAK,IAAI,CAAC;AAAA,MACtC;AAAA,MACA;AAAA,MACA,OAAO;AAAA,MACP,WAAW,CAAC,SAAS,KAAK,UAAU;AAAA,MACpC,oBAAoB,CAAC,SAAS,KAAK;AAAA,MACnC,MAAK;AAAA,MACL,WAAU;AAAA,MACV;AAAA,MACC,GAAI,cAAc,SAAY,EAAE,UAAU,IAAI,CAAC;AAAA,MAChD,gBAAgB,EAAE,cAAc,WAAW,iBAAiB,WAAW,KAAK,OAAU;AAAA;AAAA,EACxF;AAEJ;AACA,WAAW,cAAc;","names":[]}

package/dist/components/radio-group/index.d.ts

@@ -1,3 +1,3 @@
 export { RadioGroup } from "./RadioGroup.js";
-export type { RadioGroupItem, RadioGroupProps } from "./types.js";
+export type { RadioGroupItem, RadioGroupProps, RadioGroupSlotProps } from "./types.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/components/radio-group/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/radio-group/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,YAAY,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/radio-group/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,YAAY,EAAE,cAAc,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAC"}

package/dist/components/radio-group/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/radio-group/index.ts"],"sourcesContent":["export { RadioGroup } from \"./RadioGroup.js\";\nexport type { RadioGroupItem, RadioGroupProps } from \"./types.js\";\n"],"mappings":"AAAA,SAAS,kBAAkB;","names":[]}
+{"version":3,"sources":["../../../src/components/radio-group/index.ts"],"sourcesContent":["export { RadioGroup } from \"./RadioGroup.js\";\nexport type { RadioGroupItem, RadioGroupProps, RadioGroupSlotProps } from \"./types.js\";\n"],"mappings":"AAAA,SAAS,kBAAkB;","names":[]}

package/dist/components/radio-group/types.d.ts

@@ -1,11 +1,13 @@
 import type { ReactNode } from "react";
+import type { ChoiceGroupRootProps, ChoiceOptionSlotProps } from "../internal/choice-family/types.js";
+export type RadioGroupSlotProps = ChoiceOptionSlotProps;
 export interface RadioGroupItem {
     readonly value: string;
     readonly label: ReactNode;
     readonly disabled?: boolean;
     readonly className?: string;
 }
-export interface RadioGroupProps {
+export interface RadioGroupProps extends ChoiceGroupRootProps {
     readonly id: string;
     readonly items: readonly RadioGroupItem[];
     readonly defaultValue?: string;
@@ -13,6 +15,6 @@ export interface RadioGroupProps {
     readonly disabled?: boolean;
     readonly orientation?: "horizontal" | "vertical";
     readonly className?: string;
-    readonly "aria-label"?: string;
+    readonly slotProps?: RadioGroupSlotProps;
 }
 //# sourceMappingURL=types.d.ts.map

package/dist/components/radio-group/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/radio-group/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAC;IAC1B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,KAAK,EAAE,SAAS,cAAc,EAAE,CAAC;IAC1C,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;IAC/B,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACjD,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;CAChC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/radio-group/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EACV,oBAAoB,EACpB,qBAAqB,EACtB,MAAM,oCAAoC,CAAC;AAE5C,MAAM,MAAM,mBAAmB,GAAG,qBAAqB,CAAC;AAExD,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAC;IAC1B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,WAAW,eAAgB,SAAQ,oBAAoB;IAC3D,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,KAAK,EAAE,SAAS,cAAc,EAAE,CAAC;IAC1C,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;IAC/B,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACjD,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,SAAS,CAAC,EAAE,mBAAmB,CAAC;CAC1C"}

package/dist/components/rating/Rating.d.ts

@@ -1,6 +1,6 @@
 import type { ReactElement } from "react";
 import type { RatingProps } from "./types.js";
-export declare function Rating({ id, defaultValue, max, readOnly, disabled, className, "aria-label": ariaLabel, }: RatingProps): ReactElement;
+export declare function Rating({ id, defaultValue, max, readOnly, disabled, className, slotProps, "aria-label": ariaLabel, ...rootProps }: RatingProps): ReactElement;
 export declare namespace Rating {
     var displayName: string;
 }

package/dist/components/rating/Rating.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Rating.d.ts","sourceRoot":"","sources":["../../../src/components/rating/Rating.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAI1C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAE9C,wBAAgB,MAAM,CAAC,EACrB,EAAE,EACF,YAAgB,EAChB,GAAO,EACP,QAAgB,EAChB,QAAgB,EAChB,SAAS,EACT,YAAY,EAAE,SAAS,GACxB,EAAE,WAAW,GAAG,YAAY,CAiB5B;yBAzBe,MAAM"}
+{"version":3,"file":"Rating.d.ts","sourceRoot":"","sources":["../../../src/components/rating/Rating.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAI1C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAE9C,wBAAgB,MAAM,CAAC,EACrB,EAAE,EACF,YAAgB,EAChB,GAAO,EACP,QAAgB,EAChB,QAAgB,EAChB,SAAS,EACT,SAAS,EACT,YAAY,EAAE,SAAS,EACvB,GAAG,SAAS,EACb,EAAE,WAAW,GAAG,YAAY,CAmB5B;yBA7Be,MAAM"}

package/dist/components/rating/Rating.js

@@ -8,7 +8,9 @@ function Rating({
   readOnly = false,
   disabled = false,
   className,
-  "aria-label": ariaLabel
+  slotProps,
+  "aria-label": ariaLabel,
+  ...rootProps
 }) {
   return /* @__PURE__ */ jsx(
     ChoiceGroup,
@@ -20,6 +22,8 @@ function Rating({
       kind: "single",
       namespace: "rating",
       orientation: "horizontal",
+      rootProps,
+      ...slotProps ? { slotProps } : {},
       rootAttributes: {
         "aria-label": ariaLabel,
         "data-disabled": disabled ? "" : void 0,

package/dist/components/rating/Rating.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/rating/Rating.tsx"],"sourcesContent":["import type { ReactElement } from \"react\";\nimport { ChoiceGroup } from \"../internal/choice-family/ChoiceGroup.js\";\nimport type { ChoiceItem } from \"../internal/choice-family/types.js\";\nimport { buildRatingItems } from \"./rating-items.js\";\nimport type { RatingProps } from \"./types.js\";\n\nexport function Rating({\n  id,\n  defaultValue = 0,\n  max = 5,\n  readOnly = false,\n  disabled = false,\n  className,\n  \"aria-label\": ariaLabel,\n}: RatingProps): ReactElement {\n  return (\n    <ChoiceGroup<ChoiceItem>\n      {...(className !== undefined ? { className } : {})}\n      id={id}\n      items={buildRatingItems(max, disabled || readOnly)}\n      isChecked={(item) => Number(item.value) === defaultValue}\n      kind=\"single\"\n      namespace=\"rating\"\n      orientation=\"horizontal\"\n      rootAttributes={{\n        \"aria-label\": ariaLabel,\n        \"data-disabled\": disabled ? \"\" : undefined,\n        \"data-readonly\": readOnly ? \"\" : undefined,\n      }}\n    />\n  );\n}\nRating.displayName = \"Rating\";\n"],"mappings":"AAgBI;AAfJ,SAAS,mBAAmB;AAE5B,SAAS,wBAAwB;AAG1B,SAAS,OAAO;AAAA,EACrB;AAAA,EACA,eAAe;AAAA,EACf,MAAM;AAAA,EACN,WAAW;AAAA,EACX,WAAW;AAAA,EACX;AAAA,EACA,cAAc;AAChB,GAA8B;AAC5B,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAI,cAAc,SAAY,EAAE,UAAU,IAAI,CAAC;AAAA,MAChD;AAAA,MACA,OAAO,iBAAiB,KAAK,YAAY,QAAQ;AAAA,MACjD,WAAW,CAAC,SAAS,OAAO,KAAK,KAAK,MAAM;AAAA,MAC5C,MAAK;AAAA,MACL,WAAU;AAAA,MACV,aAAY;AAAA,MACZ,gBAAgB;AAAA,QACd,cAAc;AAAA,QACd,iBAAiB,WAAW,KAAK;AAAA,QACjC,iBAAiB,WAAW,KAAK;AAAA,MACnC;AAAA;AAAA,EACF;AAEJ;AACA,OAAO,cAAc;","names":[]}
+{"version":3,"sources":["../../../src/components/rating/Rating.tsx"],"sourcesContent":["import type { ReactElement } from \"react\";\nimport { ChoiceGroup } from \"../internal/choice-family/ChoiceGroup.js\";\nimport type { ChoiceItem } from \"../internal/choice-family/types.js\";\nimport { buildRatingItems } from \"./rating-items.js\";\nimport type { RatingProps } from \"./types.js\";\n\nexport function Rating({\n  id,\n  defaultValue = 0,\n  max = 5,\n  readOnly = false,\n  disabled = false,\n  className,\n  slotProps,\n  \"aria-label\": ariaLabel,\n  ...rootProps\n}: RatingProps): ReactElement {\n  return (\n    <ChoiceGroup<ChoiceItem>\n      {...(className !== undefined ? { className } : {})}\n      id={id}\n      items={buildRatingItems(max, disabled || readOnly)}\n      isChecked={(item) => Number(item.value) === defaultValue}\n      kind=\"single\"\n      namespace=\"rating\"\n      orientation=\"horizontal\"\n      rootProps={rootProps}\n      {...(slotProps ? { slotProps } : {})}\n      rootAttributes={{\n        \"aria-label\": ariaLabel,\n        \"data-disabled\": disabled ? \"\" : undefined,\n        \"data-readonly\": readOnly ? \"\" : undefined,\n      }}\n    />\n  );\n}\nRating.displayName = \"Rating\";\n"],"mappings":"AAkBI;AAjBJ,SAAS,mBAAmB;AAE5B,SAAS,wBAAwB;AAG1B,SAAS,OAAO;AAAA,EACrB;AAAA,EACA,eAAe;AAAA,EACf,MAAM;AAAA,EACN,WAAW;AAAA,EACX,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,GAAG;AACL,GAA8B;AAC5B,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAI,cAAc,SAAY,EAAE,UAAU,IAAI,CAAC;AAAA,MAChD;AAAA,MACA,OAAO,iBAAiB,KAAK,YAAY,QAAQ;AAAA,MACjD,WAAW,CAAC,SAAS,OAAO,KAAK,KAAK,MAAM;AAAA,MAC5C,MAAK;AAAA,MACL,WAAU;AAAA,MACV,aAAY;AAAA,MACZ;AAAA,MACC,GAAI,YAAY,EAAE,UAAU,IAAI,CAAC;AAAA,MAClC,gBAAgB;AAAA,QACd,cAAc;AAAA,QACd,iBAAiB,WAAW,KAAK;AAAA,QACjC,iBAAiB,WAAW,KAAK;AAAA,MACnC;AAAA;AAAA,EACF;AAEJ;AACA,OAAO,cAAc;","names":[]}

package/dist/components/rating/client/RatingClient.d.ts

@@ -9,7 +9,7 @@ import type { RatingClientProps } from "../types.js";
  * genuinely uncontrolled DOM nodes rather than teaching ChoiceGroup a
  * React-controlled `checked` mode.
  */
-export declare function RatingClient({ id, value: controlledValue, defaultValue, onValueChange, max, readOnly, disabled, className, "aria-label": ariaLabel, }: RatingClientProps): ReactElement;
+export declare function RatingClient({ id, value: controlledValue, defaultValue, onValueChange, max, readOnly, disabled, className, slotProps, "aria-label": ariaLabel, ...rootProps }: RatingClientProps): ReactElement;
 export declare namespace RatingClient {
     var displayName: string;
 }

package/dist/components/rating/client/RatingClient.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RatingClient.d.ts","sourceRoot":"","sources":["../../../../src/components/rating/client/RatingClient.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAK1C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAErD;;;;;;;;GAQG;AACH,wBAAgB,YAAY,CAAC,EAC3B,EAAE,EACF,KAAK,EAAE,eAAe,EACtB,YAAgB,EAChB,aAAa,EACb,GAAO,EACP,QAAgB,EAChB,QAAgB,EAChB,SAAS,EACT,YAAY,EAAE,SAAS,GACxB,EAAE,iBAAiB,GAAG,YAAY,CAyBlC;yBAnCe,YAAY"}
+{"version":3,"file":"RatingClient.d.ts","sourceRoot":"","sources":["../../../../src/components/rating/client/RatingClient.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAK1C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAErD;;;;;;;;GAQG;AACH,wBAAgB,YAAY,CAAC,EAC3B,EAAE,EACF,KAAK,EAAE,eAAe,EACtB,YAAgB,EAChB,aAAa,EACb,GAAO,EACP,QAAgB,EAChB,QAAgB,EAChB,SAAS,EACT,SAAS,EACT,YAAY,EAAE,SAAS,EACvB,GAAG,SAAS,EACb,EAAE,iBAAiB,GAAG,YAAY,CA2BlC;yBAvCe,YAAY"}

package/dist/components/rating/client/RatingClient.js

@@ -12,7 +12,9 @@ function RatingClient({
   readOnly = false,
   disabled = false,
   className,
-  "aria-label": ariaLabel
+  slotProps,
+  "aria-label": ariaLabel,
+  ...rootProps
 }) {
   const [value, setValue] = useControllableState({
     defaultValue,
@@ -31,6 +33,8 @@ function RatingClient({
       namespace: "rating",
       onItemChange: (item) => setValue(Number(item.value)),
       orientation: "horizontal",
+      rootProps,
+      ...slotProps ? { slotProps } : {},
       rootAttributes: {
         "aria-label": ariaLabel,
         "data-disabled": disabled ? "" : void 0,

package/dist/components/rating/client/RatingClient.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/rating/client/RatingClient.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ReactElement } from \"react\";\nimport { useControllableState } from \"@gunkin/uiify/hooks\";\nimport { ChoiceGroup } from \"../../internal/choice-family/ChoiceGroup.js\";\nimport type { ChoiceItem } from \"../../internal/choice-family/types.js\";\nimport { buildRatingItems } from \"../rating-items.js\";\nimport type { RatingClientProps } from \"../types.js\";\n\n/**\n * Controlled entry point. The default `Rating` (server, Tier 0) covers the\n * common uncontrolled case with zero client JS — hover preview and\n * persisted selection are pure CSS (`:checked`/`:hover` sibling rules). This entry only exists\n * for `value`/`onValueChange`:\n * remounting on every value change (via `key`) keeps the underlying radios\n * genuinely uncontrolled DOM nodes rather than teaching ChoiceGroup a\n * React-controlled `checked` mode.\n */\nexport function RatingClient({\n  id,\n  value: controlledValue,\n  defaultValue = 0,\n  onValueChange,\n  max = 5,\n  readOnly = false,\n  disabled = false,\n  className,\n  \"aria-label\": ariaLabel,\n}: RatingClientProps): ReactElement {\n  const [value, setValue] = useControllableState({\n    defaultValue,\n    onChange: onValueChange,\n    value: controlledValue,\n  });\n\n  return (\n    <ChoiceGroup<ChoiceItem>\n      {...(className !== undefined ? { className } : {})}\n      id={id}\n      items={buildRatingItems(max, disabled || readOnly)}\n      isChecked={(item) => Number(item.value) === value}\n      key={value}\n      kind=\"single\"\n      namespace=\"rating\"\n      onItemChange={(item) => setValue(Number(item.value))}\n      orientation=\"horizontal\"\n      rootAttributes={{\n        \"aria-label\": ariaLabel,\n        \"data-disabled\": disabled ? \"\" : undefined,\n        \"data-readonly\": readOnly ? \"\" : undefined,\n      }}\n    />\n  );\n}\nRatingClient.displayName = \"RatingClient\";\n"],"mappings":";AAoCI;AAjCJ,SAAS,4BAA4B;AACrC,SAAS,mBAAmB;AAE5B,SAAS,wBAAwB;AAY1B,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA,OAAO;AAAA,EACP,eAAe;AAAA,EACf;AAAA,EACA,MAAM;AAAA,EACN,WAAW;AAAA,EACX,WAAW;AAAA,EACX;AAAA,EACA,cAAc;AAChB,GAAoC;AAClC,QAAM,CAAC,OAAO,QAAQ,IAAI,qBAAqB;AAAA,IAC7C;AAAA,IACA,UAAU;AAAA,IACV,OAAO;AAAA,EACT,CAAC;AAED,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAI,cAAc,SAAY,EAAE,UAAU,IAAI,CAAC;AAAA,MAChD;AAAA,MACA,OAAO,iBAAiB,KAAK,YAAY,QAAQ;AAAA,MACjD,WAAW,CAAC,SAAS,OAAO,KAAK,KAAK,MAAM;AAAA,MAC5C,KAAK;AAAA,MACL,MAAK;AAAA,MACL,WAAU;AAAA,MACV,cAAc,CAAC,SAAS,SAAS,OAAO,KAAK,KAAK,CAAC;AAAA,MACnD,aAAY;AAAA,MACZ,gBAAgB;AAAA,QACd,cAAc;AAAA,QACd,iBAAiB,WAAW,KAAK;AAAA,QACjC,iBAAiB,WAAW,KAAK;AAAA,MACnC;AAAA;AAAA,EACF;AAEJ;AACA,aAAa,cAAc;","names":[]}
+{"version":3,"sources":["../../../../src/components/rating/client/RatingClient.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ReactElement } from \"react\";\nimport { useControllableState } from \"@gunkin/uiify/hooks\";\nimport { ChoiceGroup } from \"../../internal/choice-family/ChoiceGroup.js\";\nimport type { ChoiceItem } from \"../../internal/choice-family/types.js\";\nimport { buildRatingItems } from \"../rating-items.js\";\nimport type { RatingClientProps } from \"../types.js\";\n\n/**\n * Controlled entry point. The default `Rating` (server, Tier 0) covers the\n * common uncontrolled case with zero client JS — hover preview and\n * persisted selection are pure CSS (`:checked`/`:hover` sibling rules). This entry only exists\n * for `value`/`onValueChange`:\n * remounting on every value change (via `key`) keeps the underlying radios\n * genuinely uncontrolled DOM nodes rather than teaching ChoiceGroup a\n * React-controlled `checked` mode.\n */\nexport function RatingClient({\n  id,\n  value: controlledValue,\n  defaultValue = 0,\n  onValueChange,\n  max = 5,\n  readOnly = false,\n  disabled = false,\n  className,\n  slotProps,\n  \"aria-label\": ariaLabel,\n  ...rootProps\n}: RatingClientProps): ReactElement {\n  const [value, setValue] = useControllableState({\n    defaultValue,\n    onChange: onValueChange,\n    value: controlledValue,\n  });\n\n  return (\n    <ChoiceGroup<ChoiceItem>\n      {...(className !== undefined ? { className } : {})}\n      id={id}\n      items={buildRatingItems(max, disabled || readOnly)}\n      isChecked={(item) => Number(item.value) === value}\n      key={value}\n      kind=\"single\"\n      namespace=\"rating\"\n      onItemChange={(item) => setValue(Number(item.value))}\n      orientation=\"horizontal\"\n      rootProps={rootProps}\n      {...(slotProps ? { slotProps } : {})}\n      rootAttributes={{\n        \"aria-label\": ariaLabel,\n        \"data-disabled\": disabled ? \"\" : undefined,\n        \"data-readonly\": readOnly ? \"\" : undefined,\n      }}\n    />\n  );\n}\nRatingClient.displayName = \"RatingClient\";\n"],"mappings":";AAsCI;AAnCJ,SAAS,4BAA4B;AACrC,SAAS,mBAAmB;AAE5B,SAAS,wBAAwB;AAY1B,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA,OAAO;AAAA,EACP,eAAe;AAAA,EACf;AAAA,EACA,MAAM;AAAA,EACN,WAAW;AAAA,EACX,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,GAAG;AACL,GAAoC;AAClC,QAAM,CAAC,OAAO,QAAQ,IAAI,qBAAqB;AAAA,IAC7C;AAAA,IACA,UAAU;AAAA,IACV,OAAO;AAAA,EACT,CAAC;AAED,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAI,cAAc,SAAY,EAAE,UAAU,IAAI,CAAC;AAAA,MAChD;AAAA,MACA,OAAO,iBAAiB,KAAK,YAAY,QAAQ;AAAA,MACjD,WAAW,CAAC,SAAS,OAAO,KAAK,KAAK,MAAM;AAAA,MAC5C,KAAK;AAAA,MACL,MAAK;AAAA,MACL,WAAU;AAAA,MACV,cAAc,CAAC,SAAS,SAAS,OAAO,KAAK,KAAK,CAAC;AAAA,MACnD,aAAY;AAAA,MACZ;AAAA,MACC,GAAI,YAAY,EAAE,UAAU,IAAI,CAAC;AAAA,MAClC,gBAAgB;AAAA,QACd,cAAc;AAAA,QACd,iBAAiB,WAAW,KAAK;AAAA,QACjC,iBAAiB,WAAW,KAAK;AAAA,MACnC;AAAA;AAAA,EACF;AAEJ;AACA,aAAa,cAAc;","names":[]}

package/dist/components/rating/index.d.ts

@@ -1,3 +1,3 @@
 export { Rating } from "./Rating.js";
-export type { RatingProps } from "./types.js";
+export type { RatingOwnProps, RatingProps, RatingSlotProps } from "./types.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/components/rating/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/rating/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,YAAY,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/rating/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrC,YAAY,EAAE,cAAc,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC"}

package/dist/components/rating/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/rating/index.ts"],"sourcesContent":["export { Rating } from \"./Rating.js\";\nexport type { RatingProps } from \"./types.js\";\n"],"mappings":"AAAA,SAAS,cAAc;","names":[]}
+{"version":3,"sources":["../../../src/components/rating/index.ts"],"sourcesContent":["export { Rating } from \"./Rating.js\";\nexport type { RatingOwnProps, RatingProps, RatingSlotProps } from \"./types.js\";\n"],"mappings":"AAAA,SAAS,cAAc;","names":[]}

package/dist/components/rating/types.d.ts

@@ -1,4 +1,7 @@
-export interface RatingProps {
+import type { ComponentPropsWithRef } from "react";
+import type { ConsumerDataAttributes } from "../../core/slot-props.js";
+import type { ChoiceOptionSlotProps } from "../internal/choice-family/types.js";
+export interface RatingOwnProps {
     readonly id: string;
     readonly defaultValue?: number;
     readonly max?: number;
@@ -6,7 +9,15 @@ export interface RatingProps {
     readonly disabled?: boolean;
     readonly className?: string;
     readonly "aria-label"?: string;
+    /** Props for each generated item, radio input, or label. Values target one rating item. */
+    readonly slotProps?: RatingSlotProps;
 }
+export type RatingSlotProps = ChoiceOptionSlotProps;
+export type RatingProps = RatingOwnProps & Omit<ComponentPropsWithRef<"div">, keyof RatingOwnProps | "children" | "dangerouslySetInnerHTML" | "data-orientation" | "data-part" | "data-uiify-choice" | "data-uiify-rating"> & ConsumerDataAttributes & {
+    readonly "data-orientation"?: never;
+    readonly "data-uiify-choice"?: never;
+    readonly "data-uiify-rating"?: never;
+};
 export interface RatingClientProps extends RatingProps {
     readonly value?: number;
     readonly onValueChange?: (value: number) => void;

package/dist/components/rating/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/rating/types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,WAAW;IAC1B,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;IAC/B,QAAQ,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;CAChC;AAED,MAAM,WAAW,iBAAkB,SAAQ,WAAW;IACpD,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAClD"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/rating/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AACvE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,oCAAoC,CAAC;AAEhF,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;IAC/B,QAAQ,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;IAC/B,2FAA2F;IAC3F,QAAQ,CAAC,SAAS,CAAC,EAAE,eAAe,CAAC;CACtC;AAED,MAAM,MAAM,eAAe,GAAG,qBAAqB,CAAC;AAEpD,MAAM,MAAM,WAAW,GAAG,cAAc,GACtC,IAAI,CACF,qBAAqB,CAAC,KAAK,CAAC,EAC1B,MAAM,cAAc,GACpB,UAAU,GACV,yBAAyB,GACzB,kBAAkB,GAClB,WAAW,GACX,mBAAmB,GACnB,mBAAmB,CACtB,GACD,sBAAsB,GAAG;IACvB,QAAQ,CAAC,kBAAkB,CAAC,EAAE,KAAK,CAAC;IACpC,QAAQ,CAAC,mBAAmB,CAAC,EAAE,KAAK,CAAC;IACrC,QAAQ,CAAC,mBAAmB,CAAC,EAAE,KAAK,CAAC;CACtC,CAAC;AAEJ,MAAM,WAAW,iBAAkB,SAAQ,WAAW;IACpD,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAClD"}

package/dist/components/segmented-control/SegmentedControl.d.ts

@@ -1,6 +1,6 @@
 import type { ReactElement } from "react";
 import type { SegmentedControlProps } from "./types.js";
-export declare function SegmentedControl({ id, items, defaultValue, disabled, orientation, fullWidth, className, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, }: SegmentedControlProps): ReactElement;
+export declare function SegmentedControl({ id, items, defaultValue, disabled, orientation, fullWidth, className, slotProps, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...rootProps }: SegmentedControlProps): ReactElement;
 export declare namespace SegmentedControl {
     var displayName: string;
 }

package/dist/components/segmented-control/SegmentedControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../../src/components/segmented-control/SegmentedControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAwB,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAE9E,wBAAgB,gBAAgB,CAAC,EAC/B,EAAE,EACF,KAAK,EACL,YAAY,EACZ,QAAgB,EAChB,WAA0B,EAC1B,SAAiB,EACjB,SAAS,EACT,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,GAClC,EAAE,qBAAqB,GAAG,YAAY,CAyBtC;yBAnCe,gBAAgB"}
+{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../../src/components/segmented-control/SegmentedControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAwB,qBAAqB,EAAE,MAAM,YAAY,CAAC;AAE9E,wBAAgB,gBAAgB,CAAC,EAC/B,EAAE,EACF,KAAK,EACL,YAAY,EACZ,QAAgB,EAChB,WAA0B,EAC1B,SAAiB,EACjB,SAAS,EACT,SAAS,EACT,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,GAAG,SAAS,EACb,EAAE,qBAAqB,GAAG,YAAY,CA2BtC;yBAvCe,gBAAgB"}

package/dist/components/segmented-control/SegmentedControl.js

@@ -8,8 +8,10 @@ function SegmentedControl({
   orientation = "horizontal",
   fullWidth = false,
   className,
+  slotProps,
   "aria-label": ariaLabel,
-  "aria-labelledby": ariaLabelledBy
+  "aria-labelledby": ariaLabelledBy,
+  ...rootProps
 }) {
   const resolvedItems = items.map((item) => ({
     ...item,
@@ -19,6 +21,7 @@ function SegmentedControl({
     ChoiceGroup,
     {
       ...className !== void 0 ? { className } : {},
+      rootProps,
       id,
       items: resolvedItems,
       isChecked: (item) => item.value === defaultValue,
@@ -26,6 +29,7 @@ function SegmentedControl({
       namespace: "segmented-control",
       labelAttributes: { "data-uiify-button": "", "data-variant": "ghost", "data-size": "sm" },
       orientation,
+      ...slotProps !== void 0 ? { slotProps } : {},
       rootAttributes: {
         role: "radiogroup",
         "aria-label": ariaLabel,

package/dist/components/segmented-control/SegmentedControl.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/segmented-control/SegmentedControl.tsx"],"sourcesContent":["import type { ReactElement } from \"react\";\nimport { ChoiceGroup } from \"../internal/choice-family/ChoiceGroup.js\";\nimport type { SegmentedControlItem, SegmentedControlProps } from \"./types.js\";\n\nexport function SegmentedControl({\n  id,\n  items,\n  defaultValue,\n  disabled = false,\n  orientation = \"horizontal\",\n  fullWidth = false,\n  className,\n  \"aria-label\": ariaLabel,\n  \"aria-labelledby\": ariaLabelledBy,\n}: SegmentedControlProps): ReactElement {\n  const resolvedItems = items.map((item) => ({\n    ...item,\n    disabled: disabled || item.disabled === true,\n  }));\n\n  return (\n    <ChoiceGroup<SegmentedControlItem>\n      {...(className !== undefined ? { className } : {})}\n      id={id}\n      items={resolvedItems}\n      isChecked={(item) => item.value === defaultValue}\n      kind=\"single\"\n      namespace=\"segmented-control\"\n      labelAttributes={{ \"data-uiify-button\": \"\", \"data-variant\": \"ghost\", \"data-size\": \"sm\" }}\n      orientation={orientation}\n      rootAttributes={{\n        role: \"radiogroup\",\n        \"aria-label\": ariaLabel,\n        \"aria-labelledby\": ariaLabelledBy,\n        \"data-disabled\": disabled ? \"\" : undefined,\n        \"data-full-width\": fullWidth ? \"\" : undefined,\n      }}\n    />\n  );\n}\nSegmentedControl.displayName = \"SegmentedControl\";\n"],"mappings":"AAqBI;AApBJ,SAAS,mBAAmB;AAGrB,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,cAAc;AAAA,EACd,YAAY;AAAA,EACZ;AAAA,EACA,cAAc;AAAA,EACd,mBAAmB;AACrB,GAAwC;AACtC,QAAM,gBAAgB,MAAM,IAAI,CAAC,UAAU;AAAA,IACzC,GAAG;AAAA,IACH,UAAU,YAAY,KAAK,aAAa;AAAA,EAC1C,EAAE;AAEF,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAI,cAAc,SAAY,EAAE,UAAU,IAAI,CAAC;AAAA,MAChD;AAAA,MACA,OAAO;AAAA,MACP,WAAW,CAAC,SAAS,KAAK,UAAU;AAAA,MACpC,MAAK;AAAA,MACL,WAAU;AAAA,MACV,iBAAiB,EAAE,qBAAqB,IAAI,gBAAgB,SAAS,aAAa,KAAK;AAAA,MACvF;AAAA,MACA,gBAAgB;AAAA,QACd,MAAM;AAAA,QACN,cAAc;AAAA,QACd,mBAAmB;AAAA,QACnB,iBAAiB,WAAW,KAAK;AAAA,QACjC,mBAAmB,YAAY,KAAK;AAAA,MACtC;AAAA;AAAA,EACF;AAEJ;AACA,iBAAiB,cAAc;","names":[]}
+{"version":3,"sources":["../../../src/components/segmented-control/SegmentedControl.tsx"],"sourcesContent":["import type { ReactElement } from \"react\";\nimport { ChoiceGroup } from \"../internal/choice-family/ChoiceGroup.js\";\nimport type { SegmentedControlItem, SegmentedControlProps } from \"./types.js\";\n\nexport function SegmentedControl({\n  id,\n  items,\n  defaultValue,\n  disabled = false,\n  orientation = \"horizontal\",\n  fullWidth = false,\n  className,\n  slotProps,\n  \"aria-label\": ariaLabel,\n  \"aria-labelledby\": ariaLabelledBy,\n  ...rootProps\n}: SegmentedControlProps): ReactElement {\n  const resolvedItems = items.map((item) => ({\n    ...item,\n    disabled: disabled || item.disabled === true,\n  }));\n\n  return (\n    <ChoiceGroup<SegmentedControlItem>\n      {...(className !== undefined ? { className } : {})}\n      rootProps={rootProps}\n      id={id}\n      items={resolvedItems}\n      isChecked={(item) => item.value === defaultValue}\n      kind=\"single\"\n      namespace=\"segmented-control\"\n      labelAttributes={{ \"data-uiify-button\": \"\", \"data-variant\": \"ghost\", \"data-size\": \"sm\" }}\n      orientation={orientation}\n      {...(slotProps !== undefined ? { slotProps } : {})}\n      rootAttributes={{\n        role: \"radiogroup\",\n        \"aria-label\": ariaLabel,\n        \"aria-labelledby\": ariaLabelledBy,\n        \"data-disabled\": disabled ? \"\" : undefined,\n        \"data-full-width\": fullWidth ? \"\" : undefined,\n      }}\n    />\n  );\n}\nSegmentedControl.displayName = \"SegmentedControl\";\n"],"mappings":"AAuBI;AAtBJ,SAAS,mBAAmB;AAGrB,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,cAAc;AAAA,EACd,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,GAAG;AACL,GAAwC;AACtC,QAAM,gBAAgB,MAAM,IAAI,CAAC,UAAU;AAAA,IACzC,GAAG;AAAA,IACH,UAAU,YAAY,KAAK,aAAa;AAAA,EAC1C,EAAE;AAEF,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAI,cAAc,SAAY,EAAE,UAAU,IAAI,CAAC;AAAA,MAChD;AAAA,MACA;AAAA,MACA,OAAO;AAAA,MACP,WAAW,CAAC,SAAS,KAAK,UAAU;AAAA,MACpC,MAAK;AAAA,MACL,WAAU;AAAA,MACV,iBAAiB,EAAE,qBAAqB,IAAI,gBAAgB,SAAS,aAAa,KAAK;AAAA,MACvF;AAAA,MACC,GAAI,cAAc,SAAY,EAAE,UAAU,IAAI,CAAC;AAAA,MAChD,gBAAgB;AAAA,QACd,MAAM;AAAA,QACN,cAAc;AAAA,QACd,mBAAmB;AAAA,QACnB,iBAAiB,WAAW,KAAK;AAAA,QACjC,mBAAmB,YAAY,KAAK;AAAA,MACtC;AAAA;AAAA,EACF;AAEJ;AACA,iBAAiB,cAAc;","names":[]}

package/dist/components/segmented-control/client/SegmentedControlClient.d.ts

@@ -1,6 +1,6 @@
 import type { ReactElement } from "react";
 import type { SegmentedControlClientProps } from "../types.js";
-export declare function SegmentedControlClient({ id, items, value: controlledValue, defaultValue, onValueChange, disabled, orientation, fullWidth, className, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, }: SegmentedControlClientProps): ReactElement;
+export declare function SegmentedControlClient({ id, items, value: controlledValue, defaultValue, onValueChange, disabled, orientation, fullWidth, className, slotProps, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...rootProps }: SegmentedControlClientProps): ReactElement;
 export declare namespace SegmentedControlClient {
     var displayName: string;
 }

package/dist/components/segmented-control/client/SegmentedControlClient.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControlClient.d.ts","sourceRoot":"","sources":["../../../../src/components/segmented-control/client/SegmentedControlClient.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,2BAA2B,EAAwB,MAAM,aAAa,CAAC;AAErF,wBAAgB,sBAAsB,CAAC,EACrC,EAAE,EACF,KAAK,EACL,KAAK,EAAE,eAAe,EACtB,YAAY,EACZ,aAAa,EACb,QAAgB,EAChB,WAA0B,EAC1B,SAAiB,EACjB,SAAS,EACT,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,GAClC,EAAE,2BAA2B,GAAG,YAAY,CAkC5C;yBA9Ce,sBAAsB"}
+{"version":3,"file":"SegmentedControlClient.d.ts","sourceRoot":"","sources":["../../../../src/components/segmented-control/client/SegmentedControlClient.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,2BAA2B,EAAwB,MAAM,aAAa,CAAC;AAErF,wBAAgB,sBAAsB,CAAC,EACrC,EAAE,EACF,KAAK,EACL,KAAK,EAAE,eAAe,EACtB,YAAY,EACZ,aAAa,EACb,QAAgB,EAChB,WAA0B,EAC1B,SAAiB,EACjB,SAAS,EACT,SAAS,EACT,YAAY,EAAE,SAAS,EACvB,iBAAiB,EAAE,cAAc,EACjC,GAAG,SAAS,EACb,EAAE,2BAA2B,GAAG,YAAY,CAoC5C;yBAlDe,sBAAsB"}

package/dist/components/segmented-control/client/SegmentedControlClient.js

@@ -12,8 +12,10 @@ function SegmentedControlClient({
   orientation = "horizontal",
   fullWidth = false,
   className,
+  slotProps,
   "aria-label": ariaLabel,
-  "aria-labelledby": ariaLabelledBy
+  "aria-labelledby": ariaLabelledBy,
+  ...rootProps
 }) {
   const [selectedValue, setSelectedValue] = useControllableState({
     defaultValue,
@@ -30,6 +32,7 @@ function SegmentedControlClient({
     ChoiceGroup,
     {
       ...className !== void 0 ? { className } : {},
+      rootProps,
       id,
       items: resolvedItems,
       isChecked: (item) => item.value === selectedValue,
@@ -39,6 +42,7 @@ function SegmentedControlClient({
       labelAttributes: { "data-uiify-button": "", "data-variant": "ghost", "data-size": "sm" },
       onItemChange: (item) => setSelectedValue(item.value),
       orientation,
+      ...slotProps !== void 0 ? { slotProps } : {},
       rootAttributes: {
         role: "radiogroup",
         "aria-label": ariaLabel,

package/dist/components/segmented-control/client/SegmentedControlClient.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/segmented-control/client/SegmentedControlClient.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ReactElement } from \"react\";\nimport { useControllableState } from \"@gunkin/uiify/hooks\";\nimport { ChoiceGroup } from \"../../internal/choice-family/ChoiceGroup.js\";\nimport type { SegmentedControlClientProps, SegmentedControlItem } from \"../types.js\";\n\nexport function SegmentedControlClient({\n  id,\n  items,\n  value: controlledValue,\n  defaultValue,\n  onValueChange,\n  disabled = false,\n  orientation = \"horizontal\",\n  fullWidth = false,\n  className,\n  \"aria-label\": ariaLabel,\n  \"aria-labelledby\": ariaLabelledBy,\n}: SegmentedControlClientProps): ReactElement {\n  const [selectedValue, setSelectedValue] = useControllableState<string | undefined>({\n    defaultValue,\n    onChange: (nextValue) => {\n      if (nextValue !== undefined) onValueChange?.(nextValue);\n    },\n    value: controlledValue,\n  });\n  const resolvedItems = items.map((item) => ({\n    ...item,\n    disabled: disabled || item.disabled === true,\n  }));\n\n  return (\n    <ChoiceGroup<SegmentedControlItem>\n      {...(className !== undefined ? { className } : {})}\n      id={id}\n      items={resolvedItems}\n      isChecked={(item) => item.value === selectedValue}\n      isControlled={controlledValue !== undefined}\n      kind=\"single\"\n      namespace=\"segmented-control\"\n      labelAttributes={{ \"data-uiify-button\": \"\", \"data-variant\": \"ghost\", \"data-size\": \"sm\" }}\n      onItemChange={(item) => setSelectedValue(item.value)}\n      orientation={orientation}\n      rootAttributes={{\n        role: \"radiogroup\",\n        \"aria-label\": ariaLabel,\n        \"aria-labelledby\": ariaLabelledBy,\n        \"data-disabled\": disabled ? \"\" : undefined,\n        \"data-full-width\": fullWidth ? \"\" : undefined,\n      }}\n    />\n  );\n}\n\nSegmentedControlClient.displayName = \"SegmentedControlClient\";\n"],"mappings":";AAiCI;AA9BJ,SAAS,4BAA4B;AACrC,SAAS,mBAAmB;AAGrB,SAAS,uBAAuB;AAAA,EACrC;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,cAAc;AAAA,EACd,YAAY;AAAA,EACZ;AAAA,EACA,cAAc;AAAA,EACd,mBAAmB;AACrB,GAA8C;AAC5C,QAAM,CAAC,eAAe,gBAAgB,IAAI,qBAAyC;AAAA,IACjF;AAAA,IACA,UAAU,CAAC,cAAc;AACvB,UAAI,cAAc,OAAW,iBAAgB,SAAS;AAAA,IACxD;AAAA,IACA,OAAO;AAAA,EACT,CAAC;AACD,QAAM,gBAAgB,MAAM,IAAI,CAAC,UAAU;AAAA,IACzC,GAAG;AAAA,IACH,UAAU,YAAY,KAAK,aAAa;AAAA,EAC1C,EAAE;AAEF,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAI,cAAc,SAAY,EAAE,UAAU,IAAI,CAAC;AAAA,MAChD;AAAA,MACA,OAAO;AAAA,MACP,WAAW,CAAC,SAAS,KAAK,UAAU;AAAA,MACpC,cAAc,oBAAoB;AAAA,MAClC,MAAK;AAAA,MACL,WAAU;AAAA,MACV,iBAAiB,EAAE,qBAAqB,IAAI,gBAAgB,SAAS,aAAa,KAAK;AAAA,MACvF,cAAc,CAAC,SAAS,iBAAiB,KAAK,KAAK;AAAA,MACnD;AAAA,MACA,gBAAgB;AAAA,QACd,MAAM;AAAA,QACN,cAAc;AAAA,QACd,mBAAmB;AAAA,QACnB,iBAAiB,WAAW,KAAK;AAAA,QACjC,mBAAmB,YAAY,KAAK;AAAA,MACtC;AAAA;AAAA,EACF;AAEJ;AAEA,uBAAuB,cAAc;","names":[]}
+{"version":3,"sources":["../../../../src/components/segmented-control/client/SegmentedControlClient.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ReactElement } from \"react\";\nimport { useControllableState } from \"@gunkin/uiify/hooks\";\nimport { ChoiceGroup } from \"../../internal/choice-family/ChoiceGroup.js\";\nimport type { SegmentedControlClientProps, SegmentedControlItem } from \"../types.js\";\n\nexport function SegmentedControlClient({\n  id,\n  items,\n  value: controlledValue,\n  defaultValue,\n  onValueChange,\n  disabled = false,\n  orientation = \"horizontal\",\n  fullWidth = false,\n  className,\n  slotProps,\n  \"aria-label\": ariaLabel,\n  \"aria-labelledby\": ariaLabelledBy,\n  ...rootProps\n}: SegmentedControlClientProps): ReactElement {\n  const [selectedValue, setSelectedValue] = useControllableState<string | undefined>({\n    defaultValue,\n    onChange: (nextValue) => {\n      if (nextValue !== undefined) onValueChange?.(nextValue);\n    },\n    value: controlledValue,\n  });\n  const resolvedItems = items.map((item) => ({\n    ...item,\n    disabled: disabled || item.disabled === true,\n  }));\n\n  return (\n    <ChoiceGroup<SegmentedControlItem>\n      {...(className !== undefined ? { className } : {})}\n      rootProps={rootProps}\n      id={id}\n      items={resolvedItems}\n      isChecked={(item) => item.value === selectedValue}\n      isControlled={controlledValue !== undefined}\n      kind=\"single\"\n      namespace=\"segmented-control\"\n      labelAttributes={{ \"data-uiify-button\": \"\", \"data-variant\": \"ghost\", \"data-size\": \"sm\" }}\n      onItemChange={(item) => setSelectedValue(item.value)}\n      orientation={orientation}\n      {...(slotProps !== undefined ? { slotProps } : {})}\n      rootAttributes={{\n        role: \"radiogroup\",\n        \"aria-label\": ariaLabel,\n        \"aria-labelledby\": ariaLabelledBy,\n        \"data-disabled\": disabled ? \"\" : undefined,\n        \"data-full-width\": fullWidth ? \"\" : undefined,\n      }}\n    />\n  );\n}\n\nSegmentedControlClient.displayName = \"SegmentedControlClient\";\n"],"mappings":";AAmCI;AAhCJ,SAAS,4BAA4B;AACrC,SAAS,mBAAmB;AAGrB,SAAS,uBAAuB;AAAA,EACrC;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,cAAc;AAAA,EACd,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,GAAG;AACL,GAA8C;AAC5C,QAAM,CAAC,eAAe,gBAAgB,IAAI,qBAAyC;AAAA,IACjF;AAAA,IACA,UAAU,CAAC,cAAc;AACvB,UAAI,cAAc,OAAW,iBAAgB,SAAS;AAAA,IACxD;AAAA,IACA,OAAO;AAAA,EACT,CAAC;AACD,QAAM,gBAAgB,MAAM,IAAI,CAAC,UAAU;AAAA,IACzC,GAAG;AAAA,IACH,UAAU,YAAY,KAAK,aAAa;AAAA,EAC1C,EAAE;AAEF,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAI,cAAc,SAAY,EAAE,UAAU,IAAI,CAAC;AAAA,MAChD;AAAA,MACA;AAAA,MACA,OAAO;AAAA,MACP,WAAW,CAAC,SAAS,KAAK,UAAU;AAAA,MACpC,cAAc,oBAAoB;AAAA,MAClC,MAAK;AAAA,MACL,WAAU;AAAA,MACV,iBAAiB,EAAE,qBAAqB,IAAI,gBAAgB,SAAS,aAAa,KAAK;AAAA,MACvF,cAAc,CAAC,SAAS,iBAAiB,KAAK,KAAK;AAAA,MACnD;AAAA,MACC,GAAI,cAAc,SAAY,EAAE,UAAU,IAAI,CAAC;AAAA,MAChD,gBAAgB;AAAA,QACd,MAAM;AAAA,QACN,cAAc;AAAA,QACd,mBAAmB;AAAA,QACnB,iBAAiB,WAAW,KAAK;AAAA,QACjC,mBAAmB,YAAY,KAAK;AAAA,MACtC;AAAA;AAAA,EACF;AAEJ;AAEA,uBAAuB,cAAc;","names":[]}

package/dist/components/segmented-control/index.d.ts

@@ -1,3 +1,3 @@
 export { SegmentedControl } from "./SegmentedControl.js";
-export type { SegmentedControlClientProps, SegmentedControlItem, SegmentedControlProps, } from "./types.js";
+export type { SegmentedControlClientProps, SegmentedControlItem, SegmentedControlProps, SegmentedControlSlotProps, } from "./types.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/components/segmented-control/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/segmented-control/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,YAAY,EACV,2BAA2B,EAC3B,oBAAoB,EACpB,qBAAqB,GACtB,MAAM,YAAY,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/segmented-control/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,YAAY,EACV,2BAA2B,EAC3B,oBAAoB,EACpB,qBAAqB,EACrB,yBAAyB,GAC1B,MAAM,YAAY,CAAC"}

package/dist/components/segmented-control/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/segmented-control/index.ts"],"sourcesContent":["export { SegmentedControl } from \"./SegmentedControl.js\";\nexport type {\n  SegmentedControlClientProps,\n  SegmentedControlItem,\n  SegmentedControlProps,\n} from \"./types.js\";\n"],"mappings":"AAAA,SAAS,wBAAwB;","names":[]}
+{"version":3,"sources":["../../../src/components/segmented-control/index.ts"],"sourcesContent":["export { SegmentedControl } from \"./SegmentedControl.js\";\nexport type {\n  SegmentedControlClientProps,\n  SegmentedControlItem,\n  SegmentedControlProps,\n  SegmentedControlSlotProps,\n} from \"./types.js\";\n"],"mappings":"AAAA,SAAS,wBAAwB;","names":[]}

package/dist/components/segmented-control/types.d.ts

@@ -1,7 +1,8 @@
-import type { ChoiceItem, ChoiceOrientation } from "../internal/choice-family/types.js";
+import type { ChoiceGroupRootProps, ChoiceOptionSlotProps, ChoiceItem, ChoiceOrientation } from "../internal/choice-family/types.js";
+export type SegmentedControlSlotProps = ChoiceOptionSlotProps;
 export interface SegmentedControlItem extends ChoiceItem {
 }
-export interface SegmentedControlProps {
+export interface SegmentedControlProps extends ChoiceGroupRootProps {
     readonly id: string;
     readonly items: readonly SegmentedControlItem[];
     readonly defaultValue?: string;
@@ -9,8 +10,7 @@ export interface SegmentedControlProps {
     readonly orientation?: ChoiceOrientation;
     readonly fullWidth?: boolean;
     readonly className?: string;
-    readonly "aria-label"?: string;
-    readonly "aria-labelledby"?: string;
+    readonly slotProps?: SegmentedControlSlotProps;
 }
 export interface SegmentedControlClientProps extends SegmentedControlProps {
     readonly value?: string;

package/dist/components/segmented-control/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/segmented-control/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AAExF,MAAM,WAAW,oBAAqB,SAAQ,UAAU;CAAG;AAE3D,MAAM,WAAW,qBAAqB;IACpC,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,KAAK,EAAE,SAAS,oBAAoB,EAAE,CAAC;IAChD,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;IAC/B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,WAAW,CAAC,EAAE,iBAAiB,CAAC;IACzC,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAC;IAC7B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;IAC/B,QAAQ,CAAC,iBAAiB,CAAC,EAAE,MAAM,CAAC;CACrC;AAED,MAAM,WAAW,2BAA4B,SAAQ,qBAAqB;IACxE,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAClD"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/segmented-control/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,oBAAoB,EACpB,qBAAqB,EACrB,UAAU,EACV,iBAAiB,EAClB,MAAM,oCAAoC,CAAC;AAE5C,MAAM,MAAM,yBAAyB,GAAG,qBAAqB,CAAC;AAE9D,MAAM,WAAW,oBAAqB,SAAQ,UAAU;CAAG;AAE3D,MAAM,WAAW,qBAAsB,SAAQ,oBAAoB;IACjE,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,KAAK,EAAE,SAAS,oBAAoB,EAAE,CAAC;IAChD,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC;IAC/B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,WAAW,CAAC,EAAE,iBAAiB,CAAC;IACzC,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAC;IAC7B,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,SAAS,CAAC,EAAE,yBAAyB,CAAC;CAChD;AAED,MAAM,WAAW,2BAA4B,SAAQ,qBAAqB;IACxE,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAClD"}

package/dist/components/slider/client/SliderClient.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SliderClient.d.ts","sourceRoot":"","sources":["../../../../src/components/slider/client/SliderClient.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAEV,WAAW,EAEX,YAAY,EAEb,MAAM,OAAO,CAAC;AAOf,OAAO,KAAK,EAAE,iBAAiB,EAAiC,MAAM,aAAa,CAAC;AAoDpF,wBAAgB,YAAY,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,EAC1D,KAAK,EAAE,iBAAiB,CAAC,GAAG,CAAC,GAC5B,YAAY,GAAG,IAAI,CAoLrB;yBAtLe,YAAY"}
+{"version":3,"file":"SliderClient.d.ts","sourceRoot":"","sources":["../../../../src/components/slider/client/SliderClient.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAEV,WAAW,EAEX,YAAY,EAEb,MAAM,OAAO,CAAC;AAYf,OAAO,KAAK,EACV,iBAAiB,EAIlB,MAAM,aAAa,CAAC;AAmErB,wBAAgB,YAAY,CAAC,GAAG,SAAS,WAAW,GAAG,KAAK,EAC1D,KAAK,EAAE,iBAAiB,CAAC,GAAG,CAAC,GAC5B,YAAY,GAAG,IAAI,CA4OrB;yBA9Oe,YAAY"}

package/dist/components/slider/client/SliderClient.js

@@ -1,9 +1,15 @@
 "use client";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { createElement } from "react";
 import { useEffect, useState } from "react";
 import { useControllableState } from "@gunkin/uiify/hooks";
 import { useRenderElement } from "@gunkin/uiify/core/render";
 import { resolveDirection } from "@gunkin/uiify/core/text-direction";
+import {
+  mergeRepeatedSlotProps,
+  omitProps,
+  resolveRepeatedSlotProps
+} from "../../../core/slot-props.js";
 import { getSliderStops, snapSliderToStops } from "../slider-values.js";
 const DEFAULT_SLIDER_LABELS = {
   minimum: "Minimum value",
@@ -31,6 +37,16 @@ function position(value, min, max) {
 function marksInRange(marks, min, max) {
   return marks.filter(({ value }) => Number.isFinite(value) && value >= min && value <= max);
 }
+function resolveMarkSlotProps(slotProps, markValue, index) {
+  const { byItemValue, byItemIndex, ...commonProps } = slotProps ?? {};
+  return omitProps(
+    mergeRepeatedSlotProps(
+      mergeRepeatedSlotProps(commonProps, byItemValue?.[String(markValue)]),
+      byItemIndex?.[index]
+    ),
+    ["children", "dangerouslySetInnerHTML", "data-part"]
+  );
+}
 function SliderClient(props) {
   const {
     as,
@@ -45,6 +61,7 @@ function SliderClient(props) {
     orientation = "horizontal",
     marks = [],
     labels,
+    slotProps,
     thumbLabels,
     "aria-label": ariaLabel,
     "aria-labelledby": ariaLabelledBy,
@@ -108,12 +125,33 @@ function SliderClient(props) {
     const nextValue = availableStops[currentIndex + direction];
     if (nextValue !== void 0) setThumbValue(index, nextValue);
   };
+  const thumbKeys = isRange ? ["minimum", "maximum"] : ["value"];
   const inputNodes = values.map((currentValue, index) => {
+    const thumbKey = thumbKeys[index];
+    const inputProps = resolveRepeatedSlotProps(slotProps?.input, thumbKey, [
+      "aria-label",
+      "aria-labelledby",
+      "aria-orientation",
+      "data-disabled",
+      "data-orientation",
+      "data-part",
+      "data-state",
+      "defaultChecked",
+      "defaultValue",
+      "disabled",
+      "max",
+      "min",
+      "step",
+      "type",
+      "value"
+    ]);
     const inputLabel = isRange ? thumbLabels?.[index] ?? (index === 0 ? accessibleLabels.minimum : accessibleLabels.maximum) : ariaLabel;
     const inputLabelledBy = isRange ? void 0 : ariaLabelledBy;
-    return /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ createElement(
       "input",
       {
+        ...inputProps,
+        key: index,
         type: "range",
         min,
         max,
@@ -127,10 +165,15 @@ function SliderClient(props) {
         "data-state": String(currentValue),
         "data-orientation": orientation,
         "data-disabled": disabled ? "" : void 0,
-        onChange: (event) => handleChange(index, event),
-        onKeyDown: (event) => handleKeyDown(index, event)
-      },
-      index
+        onChange: (event) => {
+          inputProps.onChange?.(event);
+          if (!event.defaultPrevented) handleChange(index, event);
+        },
+        onKeyDown: (event) => {
+          inputProps.onKeyDown?.(event);
+          if (!event.defaultPrevented) handleKeyDown(index, event);
+        }
+      }
     );
   });
   return useRenderElement({
@@ -150,21 +193,60 @@ function SliderClient(props) {
       "data-enhanced": enhanced ? "" : void 0,
       style: rootStyle,
       children: /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsxs("div", { "data-part": "track", "aria-hidden": "true", children: [
-          /* @__PURE__ */ jsx("span", { "data-part": "range" }),
-          visibleMarks.map((mark) => /* @__PURE__ */ jsx(
-            "span",
-            {
-              "data-part": "mark",
-              style: {
-                "--uiify-slider-position": String(position(mark.value, min, max)) + "%"
-              },
-              children: mark.label
-            },
-            mark.value
-          )),
-          positionStyles.map((style, index) => /* @__PURE__ */ jsx("span", { "data-part": "visual-thumb", style }, index))
-        ] }),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            ...omitProps(slotProps?.track, [
+              "aria-hidden",
+              "children",
+              "dangerouslySetInnerHTML",
+              "data-part"
+            ]),
+            "data-part": "track",
+            "aria-hidden": "true",
+            children: [
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  ...omitProps(slotProps?.range, ["children", "dangerouslySetInnerHTML", "data-part"]),
+                  "data-part": "range"
+                }
+              ),
+              visibleMarks.map((mark, index) => {
+                const markProps = resolveMarkSlotProps(slotProps?.mark, mark.value, index);
+                return /* @__PURE__ */ createElement(
+                  "span",
+                  {
+                    ...markProps,
+                    key: index,
+                    "data-part": "mark",
+                    style: {
+                      ...markProps.style,
+                      "--uiify-slider-position": String(position(mark.value, min, max)) + "%"
+                    }
+                  },
+                  mark.label
+                );
+              }),
+              positionStyles.map((style, index) => {
+                const thumbProps = resolveRepeatedSlotProps(
+                  slotProps?.visualThumb,
+                  thumbKeys[index],
+                  ["data-part"]
+                );
+                return /* @__PURE__ */ createElement(
+                  "span",
+                  {
+                    ...thumbProps,
+                    key: index,
+                    "data-part": "visual-thumb",
+                    style: { ...thumbProps.style, ...style }
+                  }
+                );
+              })
+            ]
+          }
+        ),
         inputNodes
       ] })
     },