@ui-sdk/vue 0.0.0-stage → 0.1.0-beta.1

package/dist/carousel.d.ts

@@ -0,0 +1,236 @@
+import type { ChangeDetails } from "@ui-sdk/core";
+import { type CarouselAlign, type CarouselController, type CarouselOrientation, type CarouselPageChangeReason, type CarouselPlayingChangeReason, type CarouselSlidesPerPage } from "@ui-sdk/core/carousel";
+import { type PropType } from "vue";
+import { type PartSlots } from "./use-primitive.js";
+/**
+ * A region of slides that scroll a page at a time. Name it with `aria-label`.
+ * @stable
+ */
+declare const Carousel: import("./create-parts.js").ElementPart<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    page: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    modelValue: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    defaultPage: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    playing: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    defaultPlaying: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    interval: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    orientation: PropType<CarouselOrientation>;
+    align: PropType<CarouselAlign>;
+    slidesPerPage: PropType<CarouselSlidesPerPage>;
+    loop: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    skipSnaps: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    dragFree: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    drag: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    controller: PropType<CarouselController>;
+    debug: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+}>, (() => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>[] | null) & {
+    state: NoInfer<import("@ui-sdk/core/carousel").CarouselState>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:page": (_page: number) => true;
+    "update:modelValue": (_page: number) => true;
+    pageChange: (_page: number, _details: ChangeDetails<CarouselPageChangeReason>) => true;
+    pageChangeComplete: (_page: number) => true;
+    "update:playing": (_playing: boolean) => true;
+    playingChange: (_playing: boolean, _details: ChangeDetails<CarouselPlayingChangeReason>) => true;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    page: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    modelValue: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    defaultPage: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    playing: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    defaultPlaying: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    interval: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    orientation: PropType<CarouselOrientation>;
+    align: PropType<CarouselAlign>;
+    slidesPerPage: PropType<CarouselSlidesPerPage>;
+    loop: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    skipSnaps: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    dragFree: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    drag: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    controller: PropType<CarouselController>;
+    debug: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((_page: number) => any) | undefined;
+    "onUpdate:page"?: ((_page: number) => any) | undefined;
+    onPageChange?: ((_page: number, _details: ChangeDetails<CarouselPageChangeReason>) => any) | undefined;
+    onPageChangeComplete?: ((_page: number) => any) | undefined;
+    "onUpdate:playing"?: ((_playing: boolean) => any) | undefined;
+    onPlayingChange?: ((_playing: boolean, _details: ChangeDetails<CarouselPlayingChangeReason>) => any) | undefined;
+}>, {
+    drag: boolean;
+    playing: boolean;
+    debug: boolean;
+    loop: boolean;
+    interval: number;
+    page: number;
+    modelValue: number;
+    skipSnaps: boolean;
+    dragFree: boolean;
+    defaultPage: number;
+    defaultPlaying: boolean;
+}, PartSlots<import("@ui-sdk/core/carousel").CarouselPrimitive, "root">, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, "div">;
+/**
+ * The scrolling window onto the slides. Touch, wheels and keys scroll it natively.
+ * @stable
+ */
+declare const CarouselViewport: Pick<import("vue").DefineSetupFnComponent<Omit<import("@ui-sdk/core/renderer").BaseSlotProps, never>, {} & {}, import("./use-primitive.js").StateSlots<NoInfer<import("@ui-sdk/core/carousel").CarouselViewportState>>>, never> & import("./create-parts.js").ElementConstructor<import("vue").DefineSetupFnComponent<Omit<import("@ui-sdk/core/renderer").BaseSlotProps, never>, {} & {}, import("./use-primitive.js").StateSlots<NoInfer<import("@ui-sdk/core/carousel").CarouselViewportState>>>, "div">;
+/**
+ * The row, or column, of slides inside the viewport.
+ * @stable
+ */
+declare const CarouselContent: Pick<import("vue").DefineSetupFnComponent<Omit<import("@ui-sdk/core/renderer").BaseSlotProps, never>, {} & {}, import("./use-primitive.js").StateSlots<NoInfer<import("@ui-sdk/core/carousel").CarouselContentState>>>, never> & import("./create-parts.js").ElementConstructor<import("vue").DefineSetupFnComponent<Omit<import("@ui-sdk/core/renderer").BaseSlotProps, never>, {} & {}, import("./use-primitive.js").StateSlots<NoInfer<import("@ui-sdk/core/carousel").CarouselContentState>>>, "div">;
+/**
+ * One slide. It's labelled "1 of 5" unless it has an `aria-label`, and inert while out of view.
+ * @stable
+ */
+declare const CarouselItem: Pick<import("vue").DefineSetupFnComponent<Omit<import("@ui-sdk/core/renderer").BaseSlotProps, never>, {} & {}, import("./use-primitive.js").StateSlots<NoInfer<import("@ui-sdk/core/carousel").CarouselItemState>>>, never> & import("./create-parts.js").ElementConstructor<import("vue").DefineSetupFnComponent<Omit<import("@ui-sdk/core/renderer").BaseSlotProps, never>, {} & {}, import("./use-primitive.js").StateSlots<NoInfer<import("@ui-sdk/core/carousel").CarouselItemState>>>, "div">;
+/**
+ * Goes to the previous page. `aria-disabled` on the first page without `loop`, where it stays focusable.
+ * @stable
+ */
+declare const CarouselPrevious: import("./create-parts.js").ElementPart<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    controller: PropType<CarouselController>;
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>[], {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    controller: PropType<CarouselController>;
+}>> & Readonly<{}>, {}, PartSlots<import("@ui-sdk/core/carousel").CarouselPrimitive, "previous">, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, "button">;
+/**
+ * Goes to the next page. `aria-disabled` on the last page without `loop`, where it stays focusable.
+ * @stable
+ */
+declare const CarouselNext: import("./create-parts.js").ElementPart<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    controller: PropType<CarouselController>;
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>[], {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    controller: PropType<CarouselController>;
+}>> & Readonly<{}>, {}, PartSlots<import("@ui-sdk/core/carousel").CarouselPrimitive, "next">, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, "button">;
+/**
+ * The indicators, as a tablist with one tab stop. Its default slot gets `{ state }` with `pageCount`.
+ * @stable
+ */
+declare const CarouselIndicatorGroup: import("./create-parts.js").ElementPart<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    controller: PropType<CarouselController>;
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>[], {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    controller: PropType<CarouselController>;
+}>> & Readonly<{}>, {}, PartSlots<import("@ui-sdk/core/carousel").CarouselPrimitive, "indicator-group">, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, "div">;
+/**
+ * Starts and stops rotation. Label it from `playing` in its slot state, as the carousel pattern asks.
+ * @stable
+ */
+declare const CarouselPlayToggle: import("./create-parts.js").ElementPart<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    controller: PropType<CarouselController>;
+}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>[], {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    controller: PropType<CarouselController>;
+}>> & Readonly<{}>, {}, PartSlots<import("@ui-sdk/core/carousel").CarouselPrimitive, "play-toggle">, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, "button">;
+/**
+ * Shows a page and goes to it. Indicators past the page count hide themselves.
+ * @stable
+ */
+declare const CarouselIndicator: import("./create-parts.js").ElementPart<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    page: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+}>, (() => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>[]) | ((() => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>[] | null) & {
+    state: NoInfer<import("@ui-sdk/core/carousel").CarouselIndicatorState>;
+}), {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    page: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+}>> & Readonly<{}>, {
+    page: number;
+}, PartSlots<import("@ui-sdk/core/carousel").CarouselPrimitive, "indicator">, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, "button">;
+export { createCarouselController } from "@ui-sdk/core/carousel";
+export type { CarouselAlign, CarouselApi, CarouselContentState, CarouselControlProps, CarouselController, CarouselIndicatorGroupState, CarouselIndicatorProps, CarouselIndicatorState, CarouselItemState, CarouselNextState, CarouselOptions, CarouselOrientation, CarouselPageChangeReason, CarouselPageOptions, CarouselPlayToggleState, CarouselPlayingChangeReason, CarouselPlayingOptions, CarouselPreviousState, CarouselPrimitive, CarouselSlidesPerPage, CarouselState, CarouselStepState, CarouselViewportState, } from "@ui-sdk/core/carousel";
+export { Carousel, CarouselContent, CarouselIndicator, CarouselIndicatorGroup, CarouselItem, CarouselNext, CarouselPlayToggle, CarouselPrevious, CarouselViewport, };

package/dist/carousel.js

@@ -0,0 +1,204 @@
+// src/carousel.ts
+import {
+  carousel as carouselPrimitive
+} from "@ui-sdk/core/carousel";
+import { defineComponent, h, useId } from "vue";
+import {
+  renderUnbound,
+  useControllerEntry,
+  useControllerTarget
+} from "./controller-target.js";
+import { createParts, withElement } from "./create-parts.js";
+import {
+  optionalBoolean,
+  orModel,
+  provideHandle,
+  usePart,
+  usePrimitive,
+  useScope
+} from "./use-primitive.js";
+import { createCarouselController } from "@ui-sdk/core/carousel";
+var parts = createParts(carouselPrimitive, {
+  viewport: "div",
+  content: "div",
+  item: "div"
+});
+var Carousel = withElement(
+  "div",
+  defineComponent({
+    name: "Carousel",
+    inheritAttrs: false,
+    props: {
+      page: { type: Number, default: void 0 },
+      modelValue: { type: Number, default: void 0 },
+      defaultPage: { type: Number, default: void 0 },
+      playing: optionalBoolean,
+      defaultPlaying: optionalBoolean,
+      interval: { type: Number, default: void 0 },
+      orientation: String,
+      align: String,
+      slidesPerPage: [Number, String],
+      loop: optionalBoolean,
+      skipSnaps: optionalBoolean,
+      dragFree: optionalBoolean,
+      drag: optionalBoolean,
+      controller: Object,
+      debug: optionalBoolean
+    },
+    emits: {
+      "update:page": (_page) => true,
+      "update:modelValue": (_page) => true,
+      pageChange: (_page, _details) => true,
+      pageChangeComplete: (_page) => true,
+      "update:playing": (_playing) => true,
+      playingChange: (_playing, _details) => true
+    },
+    slots: Object,
+    setup(props, { emit }) {
+      const carousel = usePrimitive(carouselPrimitive, () => ({
+        page: orModel(props.page, props.modelValue),
+        defaultPage: props.defaultPage,
+        playing: props.playing,
+        defaultPlaying: props.defaultPlaying,
+        interval: props.interval,
+        orientation: props.orientation,
+        align: props.align,
+        slidesPerPage: props.slidesPerPage,
+        loop: props.loop,
+        skipSnaps: props.skipSnaps,
+        dragFree: props.dragFree,
+        drag: props.drag,
+        controller: props.controller,
+        debug: props.debug,
+        // The change events run first, so canceling one also keeps v-model as it was.
+        onPageChange: (page, details) => {
+          emit("pageChange", page, details);
+          if (details.canceled) {
+            return;
+          }
+          emit("update:page", page);
+          emit("update:modelValue", page);
+        },
+        onPageChangeComplete: (page) => emit("pageChangeComplete", page),
+        onPlayingChange: (playing, details) => {
+          emit("playingChange", playing, details);
+          if (!details.canceled) {
+            emit("update:playing", playing);
+          }
+        }
+      }));
+      useControllerEntry(() => props.controller, carousel);
+      return usePart(carousel, "root");
+    }
+  })
+);
+var CarouselViewport = parts.Viewport;
+var CarouselContent = parts.Content;
+var CarouselItem = parts.Item;
+function connectedPart(name, slot, tag, unconnected) {
+  const Part = defineComponent({
+    name: `${name}Part`,
+    inheritAttrs: false,
+    props: {
+      carousel: { type: Object, required: true }
+    },
+    setup(props) {
+      provideHandle(props.carousel);
+      return usePart(props.carousel, slot, void 0, void 0, tag);
+    }
+  });
+  return withElement(
+    tag,
+    defineComponent({
+      name,
+      inheritAttrs: false,
+      props: { controller: Object },
+      slots: Object,
+      setup(props, { slots, attrs }) {
+        const connected = useControllerTarget(
+          carouselPrimitive,
+          () => props.controller
+        );
+        return () => {
+          const carousel = connected();
+          if (!carousel) {
+            const plain = tag === "button" ? { type: "button", ...attrs } : attrs;
+            return renderUnbound(tag, plain, { slots, state: unconnected });
+          }
+          return h(
+            Part,
+            { carousel, key: carousel.instance.id, ...attrs },
+            slots
+          );
+        };
+      }
+    })
+  );
+}
+var CarouselPrevious = connectedPart(
+  "CarouselPrevious",
+  "previous",
+  "button",
+  { disabled: true }
+);
+var CarouselNext = connectedPart("CarouselNext", "next", "button", {
+  disabled: true
+});
+var CarouselIndicatorGroup = connectedPart(
+  "CarouselIndicatorGroup",
+  "indicator-group",
+  "div",
+  {
+    page: 1,
+    pageCount: null
+  }
+);
+var CarouselPlayToggle = connectedPart(
+  "CarouselPlayToggle",
+  "play-toggle",
+  "button",
+  {
+    playing: false,
+    paused: false
+  }
+);
+var CarouselIndicator = withElement(
+  "button",
+  defineComponent({
+    name: "CarouselIndicator",
+    inheritAttrs: false,
+    props: { page: { type: Number, default: void 0 } },
+    slots: Object,
+    setup(props, { slots, attrs }) {
+      const carousel = useScope(carouselPrimitive)?.handle;
+      if (!carousel) {
+        const unconnected = { page: props.page ?? 0, selected: false };
+        return () => renderUnbound(
+          "button",
+          { type: "button", ...attrs },
+          { slots, state: unconnected }
+        );
+      }
+      const id = useId();
+      return usePart(
+        carousel,
+        "indicator",
+        () => ({ id, page: props.page }),
+        void 0,
+        "button"
+      );
+    }
+  })
+);
+export {
+  Carousel,
+  CarouselContent,
+  CarouselIndicator,
+  CarouselIndicatorGroup,
+  CarouselItem,
+  CarouselNext,
+  CarouselPlayToggle,
+  CarouselPrevious,
+  CarouselViewport,
+  createCarouselController
+};

package/dist/checkbox.d.ts

@@ -0,0 +1,211 @@
+import { type CheckboxCheckedChangeReason, type CheckboxController, type CheckboxGroupController, type CheckboxGroupValueChangeReason, type CheckedState } from "@ui-sdk/core/checkbox";
+import type { ChangeDetails } from "@ui-sdk/core";
+import { type PropType } from "vue";
+import { type PartSlots } from "./use-primitive.js";
+/**
+ * The control and the hidden native input that takes part in the form.
+ * @stable
+ */
+declare const Checkbox: import("./create-parts.js").ElementPart<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    disabled: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    readOnly: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    name: StringConstructor;
+    value: StringConstructor;
+    form: StringConstructor;
+    debug: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    checked: {
+        type: PropType<CheckedState>;
+        default: undefined;
+    };
+    modelValue: {
+        type: PropType<CheckedState>;
+        default: undefined;
+    };
+    defaultChecked: {
+        type: PropType<CheckedState>;
+        default: undefined;
+    };
+    parent: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    controller: PropType<CheckboxController>;
+}>, () => (import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>[] | null)[], {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:checked": (_checked: CheckedState) => true;
+    "update:modelValue": (_checked: CheckedState) => true;
+    checkedChange: (_checked: CheckedState, _details: ChangeDetails<CheckboxCheckedChangeReason>) => true;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    disabled: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    readOnly: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    name: StringConstructor;
+    value: StringConstructor;
+    form: StringConstructor;
+    debug: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    checked: {
+        type: PropType<CheckedState>;
+        default: undefined;
+    };
+    modelValue: {
+        type: PropType<CheckedState>;
+        default: undefined;
+    };
+    defaultChecked: {
+        type: PropType<CheckedState>;
+        default: undefined;
+    };
+    parent: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    controller: PropType<CheckboxController>;
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((_checked: CheckedState) => any) | undefined;
+    "onUpdate:checked"?: ((_checked: CheckedState) => any) | undefined;
+    onCheckedChange?: ((_checked: CheckedState, _details: ChangeDetails<CheckboxCheckedChangeReason>) => any) | undefined;
+}>, {
+    disabled: boolean;
+    parent: boolean;
+    debug: boolean;
+    checked: CheckedState;
+    required: boolean;
+    readOnly: boolean;
+    defaultChecked: CheckedState;
+    modelValue: CheckedState;
+}, PartSlots<import("@ui-sdk/core/checkbox").CheckboxPrimitive, "root">, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, "button">;
+/**
+ * The check inside the checkbox. Rendered while it's checked or indeterminate, or always with `keepMounted`.
+ * @stable
+ */
+declare const CheckboxIndicator: Pick<import("vue").DefineSetupFnComponent<Omit<NoInfer<import("@ui-sdk/core/checkbox").CheckboxIndicatorProps> & import("@ui-sdk/core/renderer").BaseSlotProps, never>, {} & {}, import("./use-primitive.js").StateSlots<NoInfer<import("@ui-sdk/core/checkbox").CheckboxState>>>, never> & import("./create-parts.js").ElementConstructor<import("vue").DefineSetupFnComponent<Omit<NoInfer<import("@ui-sdk/core/checkbox").CheckboxIndicatorProps> & import("@ui-sdk/core/renderer").BaseSlotProps, never>, {} & {}, import("./use-primitive.js").StateSlots<NoInfer<import("@ui-sdk/core/checkbox").CheckboxState>>>, "span">;
+/**
+ * Checkboxes that share a name and a list of checked values. The group, not
+ * each checkbox, sits in a field.
+ * @stable
+ */
+declare const CheckboxGroup: import("./create-parts.js").ElementPart<import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    value: {
+        type: PropType<string[]>;
+        default: undefined;
+    };
+    modelValue: {
+        type: PropType<string[]>;
+        default: undefined;
+    };
+    defaultValue: {
+        type: PropType<string[]>;
+        default: undefined;
+    };
+    allValues: {
+        type: PropType<string[]>;
+        default: undefined;
+    };
+    readOnly: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    name: StringConstructor;
+    form: StringConstructor;
+    controller: PropType<CheckboxGroupController>;
+    debug: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+}>, () => (import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>[] | null)[], {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:value": (_value: string[]) => true;
+    "update:modelValue": (_value: string[]) => true;
+    valueChange: (_value: string[], _details: ChangeDetails<CheckboxGroupValueChangeReason>) => true;
+}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    value: {
+        type: PropType<string[]>;
+        default: undefined;
+    };
+    modelValue: {
+        type: PropType<string[]>;
+        default: undefined;
+    };
+    defaultValue: {
+        type: PropType<string[]>;
+        default: undefined;
+    };
+    allValues: {
+        type: PropType<string[]>;
+        default: undefined;
+    };
+    readOnly: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    required: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+    name: StringConstructor;
+    form: StringConstructor;
+    controller: PropType<CheckboxGroupController>;
+    debug: {
+        type: BooleanConstructor;
+        default: undefined;
+    };
+}>> & Readonly<{
+    "onUpdate:modelValue"?: ((_value: string[]) => any) | undefined;
+    "onUpdate:value"?: ((_value: string[]) => any) | undefined;
+    onValueChange?: ((_value: string[], _details: ChangeDetails<CheckboxGroupValueChangeReason>) => any) | undefined;
+}>, {
+    value: string[];
+    disabled: boolean;
+    debug: boolean;
+    defaultValue: string[];
+    required: boolean;
+    readOnly: boolean;
+    allValues: string[];
+    modelValue: string[];
+}, PartSlots<import("@ui-sdk/core/checkbox").CheckboxGroupPrimitive, "group">, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, "div">;
+export { createCheckboxController, createCheckboxGroupController, } from "@ui-sdk/core/checkbox";
+export type { CheckboxApi, CheckboxChangeOptions, CheckboxCheckedChangeReason, CheckboxController, CheckboxGroupApi, CheckboxGroupChangeOptions, CheckboxGroupController, CheckboxGroupOptions, CheckboxGroupPrimitive, CheckboxGroupState, CheckboxGroupValueChangeReason, CheckboxIndicatorProps, CheckboxIndicatorState, CheckboxOptions, CheckboxPrimitive, CheckboxState, CheckedState, } from "@ui-sdk/core/checkbox";
+export { Checkbox, CheckboxGroup, CheckboxIndicator };