@destyler/checkbox 0.0.1-beta.9 → 0.0.2

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023-PRESENT Elone Hoo
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/component.cjs

@@ -0,0 +1,14 @@
+'use strict';
+
+const index = require('./index.cjs');
+require('vue');
+require('@destyler/primitive');
+require('@destyler/composition');
+require('@destyler/shared');
+require('@destyler/directives');
+require('@destyler/presence');
+
+
+
+exports.DestylerCheckboxIndicator = index.DestylerCheckboxIndicator;
+exports.DestylerCheckboxRoot = index.DestylerCheckboxRoot;

package/dist/component.d.cts

@@ -0,0 +1,4 @@
+export { DestylerCheckboxIndicator, DestylerCheckboxIndicatorProps, DestylerCheckboxRoot, DestylerCheckboxRootProps } from './index.cjs';
+import 'vue';
+import '@destyler/primitive';
+import '@destyler/shared';

package/dist/component.d.mts

@@ -0,0 +1,4 @@
+export { DestylerCheckboxIndicator, DestylerCheckboxIndicatorProps, DestylerCheckboxRoot, DestylerCheckboxRootProps } from './index.mjs';
+import 'vue';
+import '@destyler/primitive';
+import '@destyler/shared';

package/dist/component.d.ts

@@ -0,0 +1,4 @@
+export { DestylerCheckboxIndicator, DestylerCheckboxIndicatorProps, DestylerCheckboxRoot, DestylerCheckboxRootProps } from './index.js';
+import 'vue';
+import '@destyler/primitive';
+import '@destyler/shared';

package/dist/component.mjs

@@ -0,0 +1,7 @@
+export { DestylerCheckboxIndicator, DestylerCheckboxRoot } from './index.mjs';
+import 'vue';
+import '@destyler/primitive';
+import '@destyler/composition';
+import '@destyler/shared';
+import '@destyler/directives';
+import '@destyler/presence';

package/dist/index.cjs

@@ -15,7 +15,11 @@ function getState(checked) {
 }
 
 const destylerCheckboxRootProps = {
-  ...primitive.destylerPrimitiveProp,
+  asChild: {
+    type: Boolean,
+    required: false,
+    default: false
+  },
   as: {
     type: [String, Object],
     required: false,
@@ -53,7 +57,7 @@ const destylerCheckboxRootProps = {
     required: false
   }
 };
-const [injectCheckboxRootContext, provideCheckboxRootContext] = shared.createContext("CheckboxRoot");
+const [injectCheckboxRootContext, provideCheckboxRootContext] = shared.createContext("DestylerCheckboxRoot");
 const DestylerCheckboxRoot = vue.defineComponent({
   name: "DestylerCheckboxRoot",
   props: destylerCheckboxRootProps,
@@ -64,7 +68,7 @@ const DestylerCheckboxRoot = vue.defineComponent({
       defaultValue: props.defaultChecked,
       passive: props.checked === void 0
     });
-    const { customElement, currentElement } = composition.useCustomElement();
+    const { forwardRef, currentElement } = composition.useForwardExpose();
     const isFormControl = composition.useFormControl(currentElement);
     const ariaLabel = vue.computed(() => props.id && currentElement.value ? document.querySelector(`[for="${props.id}"]`)?.textContent : void 0);
     provideCheckboxRootContext({
@@ -74,7 +78,7 @@ const DestylerCheckboxRoot = vue.defineComponent({
     return {
       disabled: disabledRef,
       checked: checkedRef,
-      customElement,
+      forwardRef,
       isFormControl,
       ariaLabel
     };
@@ -83,7 +87,7 @@ const DestylerCheckboxRoot = vue.defineComponent({
     const useVShow = this.isFormControl;
     return [
       vue.withDirectives(vue.h(primitive.DestylerPrimitive, vue.mergeProps(this.$attrs, {
-        "ref": "customElement",
+        "ref": (el) => this.forwardRef(el),
         "role": "checkbox",
         "asChild": this.$props.asChild,
         "as": this.$props.as,
@@ -97,7 +101,9 @@ const DestylerCheckboxRoot = vue.defineComponent({
         "onClick": () => {
           this.checked = !this.checked;
         }
-      }), this.$slots.default?.()), [
+      }), {
+        default: () => this.$slots.default?.()
+      }), [
         [directives.BindOnceDirective, { id: this.$props.id }]
       ]),
       useVShow ? vue.h("input", {
@@ -122,7 +128,11 @@ const DestylerCheckboxRoot = vue.defineComponent({
 });
 
 const destylerCheckboxIndicatorProps = {
-  ...primitive.destylerPrimitiveProp,
+  asChild: {
+    type: Boolean,
+    required: false,
+    default: false
+  },
   as: {
     type: [String, Object],
     required: false,
@@ -154,27 +164,11 @@ const DestylerCheckboxIndicator = vue.defineComponent({
       "style": {
         pointerEvents: "none"
       }
-    }), this.$slots.default?.()));
+    }), {
+      default: () => this.$slots.default?.()
+    }));
   }
 });
 
-const name = "@destyler/checkbox";
-
-const packageName = name;
-function DestylerCheckboxResolver() {
-  return {
-    type: "component",
-    resolve: (name2) => {
-      if (name2 === "DestylerTemplate")
-        return { name: name2, from: packageName };
-    }
-  };
-}
-
 exports.DestylerCheckboxIndicator = DestylerCheckboxIndicator;
-exports.DestylerCheckboxResolver = DestylerCheckboxResolver;
 exports.DestylerCheckboxRoot = DestylerCheckboxRoot;
-exports.destylerCheckboxIndicatorProps = destylerCheckboxIndicatorProps;
-exports.destylerCheckboxRootProps = destylerCheckboxRootProps;
-exports.injectCheckboxRootContext = injectCheckboxRootContext;
-exports.provideCheckboxRootContext = provideCheckboxRootContext;

package/dist/index.d.cts

@@ -1,22 +1,16 @@
 import * as vue from 'vue';
-import { Component, PropType, Ref } from 'vue';
+import { PropType, Component, Ref } from 'vue';
 import { AsTag } from '@destyler/primitive';
-import { ComponentResolver } from 'unplugin-vue-components';
+import { ExtractPublicPropTypes } from '@destyler/shared';
 
 type CheckedState = boolean | 'indeterminate';
 
-interface DestylerCheckboxRootProps {
-    asChild?: boolean;
-    as?: AsTag | Component;
-    defaultChecked?: boolean;
-    checked?: boolean | 'indeterminate';
-    disabled?: boolean;
-    required?: boolean;
-    name?: string;
-    value?: string;
-    id?: string;
-}
 declare const destylerCheckboxRootProps: {
+    readonly asChild: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
+    };
     readonly as: {
         readonly type: PropType<AsTag | Component>;
         readonly required: false;
@@ -53,19 +47,18 @@ declare const destylerCheckboxRootProps: {
         readonly type: PropType<string>;
         readonly required: false;
     };
-    readonly asChild: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
-    };
 };
+type DestylerCheckboxRootProps = ExtractPublicPropTypes<typeof destylerCheckboxRootProps>;
 interface CheckboxRootContext {
     disabled: Ref<boolean>;
     state: Ref<CheckedState>;
 }
-declare const injectCheckboxRootContext: <T extends CheckboxRootContext | null | undefined = CheckboxRootContext>(fallback?: T | undefined) => T extends null ? CheckboxRootContext | null : CheckboxRootContext;
-declare const provideCheckboxRootContext: (contextValue: CheckboxRootContext) => CheckboxRootContext;
 declare const DestylerCheckboxRoot: vue.DefineComponent<{
+    readonly asChild: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
+    };
     readonly as: {
         readonly type: PropType<AsTag | Component>;
         readonly required: false;
@@ -102,18 +95,18 @@ declare const DestylerCheckboxRoot: vue.DefineComponent<{
         readonly type: PropType<string>;
         readonly required: false;
     };
-    readonly asChild: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
-    };
 }, {
     disabled: Ref<false> | Ref<true>;
     checked: Ref<CheckedState>;
-    customElement: Ref<vue.ComponentPublicInstance | undefined>;
+    forwardRef: (ref: Element | vue.ComponentPublicInstance | null) => void;
     isFormControl: vue.ComputedRef<boolean>;
     ariaLabel: vue.ComputedRef<string | null | undefined>;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "update:checked"[], "update:checked", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    readonly asChild: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
+    };
     readonly as: {
         readonly type: PropType<AsTag | Component>;
         readonly required: false;
@@ -150,78 +143,72 @@ declare const DestylerCheckboxRoot: vue.DefineComponent<{
         readonly type: PropType<string>;
         readonly required: false;
     };
-    readonly asChild: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
-    };
 }>> & {
     "onUpdate:checked"?: ((...args: any[]) => any) | undefined;
 }, {
     readonly checked: boolean | "indeterminate";
+    readonly asChild: boolean;
     readonly as: AsTag | Component;
     readonly disabled: boolean;
     readonly value: string;
-    readonly asChild: boolean;
 }, {}>;
 
 declare const destylerCheckboxIndicatorProps: {
-    as: {
-        type: PropType<AsTag | Component>;
-        required: boolean;
-        default: string;
+    readonly asChild: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
     };
-    forceMount: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
+    readonly as: {
+        readonly type: PropType<AsTag | Component>;
+        readonly required: false;
+        readonly default: "button";
     };
-    asChild: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
+    readonly forceMount: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
     };
 };
+type DestylerCheckboxIndicatorProps = ExtractPublicPropTypes<typeof destylerCheckboxIndicatorProps>;
 declare const DestylerCheckboxIndicator: vue.DefineComponent<{
-    as: {
-        type: PropType<AsTag | Component>;
-        required: boolean;
-        default: string;
+    readonly asChild: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
     };
-    forceMount: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
+    readonly as: {
+        readonly type: PropType<AsTag | Component>;
+        readonly required: false;
+        readonly default: "button";
     };
-    asChild: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
+    readonly forceMount: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
     };
 }, {
     rootContext: CheckboxRootContext;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
-    as: {
-        type: PropType<AsTag | Component>;
-        required: boolean;
-        default: string;
+    readonly asChild: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
     };
-    forceMount: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
+    readonly as: {
+        readonly type: PropType<AsTag | Component>;
+        readonly required: false;
+        readonly default: "button";
     };
-    asChild: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
+    readonly forceMount: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
     };
 }>>, {
-    as: AsTag | Component;
-    asChild: boolean;
-    forceMount: boolean;
+    readonly asChild: boolean;
+    readonly as: AsTag | Component;
+    readonly forceMount: boolean;
 }, {}>;
 
-declare function DestylerCheckboxResolver(): ComponentResolver;
-
-export { type CheckboxRootContext, DestylerCheckboxIndicator, DestylerCheckboxResolver, DestylerCheckboxRoot, type DestylerCheckboxRootProps, destylerCheckboxIndicatorProps, destylerCheckboxRootProps, injectCheckboxRootContext, provideCheckboxRootContext };
+export { DestylerCheckboxIndicator, type DestylerCheckboxIndicatorProps, DestylerCheckboxRoot, type DestylerCheckboxRootProps };

package/dist/index.d.mts

@@ -1,22 +1,16 @@
 import * as vue from 'vue';
-import { Component, PropType, Ref } from 'vue';
+import { PropType, Component, Ref } from 'vue';
 import { AsTag } from '@destyler/primitive';
-import { ComponentResolver } from 'unplugin-vue-components';
+import { ExtractPublicPropTypes } from '@destyler/shared';
 
 type CheckedState = boolean | 'indeterminate';
 
-interface DestylerCheckboxRootProps {
-    asChild?: boolean;
-    as?: AsTag | Component;
-    defaultChecked?: boolean;
-    checked?: boolean | 'indeterminate';
-    disabled?: boolean;
-    required?: boolean;
-    name?: string;
-    value?: string;
-    id?: string;
-}
 declare const destylerCheckboxRootProps: {
+    readonly asChild: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
+    };
     readonly as: {
         readonly type: PropType<AsTag | Component>;
         readonly required: false;
@@ -53,19 +47,18 @@ declare const destylerCheckboxRootProps: {
         readonly type: PropType<string>;
         readonly required: false;
     };
-    readonly asChild: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
-    };
 };
+type DestylerCheckboxRootProps = ExtractPublicPropTypes<typeof destylerCheckboxRootProps>;
 interface CheckboxRootContext {
     disabled: Ref<boolean>;
     state: Ref<CheckedState>;
 }
-declare const injectCheckboxRootContext: <T extends CheckboxRootContext | null | undefined = CheckboxRootContext>(fallback?: T | undefined) => T extends null ? CheckboxRootContext | null : CheckboxRootContext;
-declare const provideCheckboxRootContext: (contextValue: CheckboxRootContext) => CheckboxRootContext;
 declare const DestylerCheckboxRoot: vue.DefineComponent<{
+    readonly asChild: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
+    };
     readonly as: {
         readonly type: PropType<AsTag | Component>;
         readonly required: false;
@@ -102,18 +95,18 @@ declare const DestylerCheckboxRoot: vue.DefineComponent<{
         readonly type: PropType<string>;
         readonly required: false;
     };
-    readonly asChild: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
-    };
 }, {
     disabled: Ref<false> | Ref<true>;
     checked: Ref<CheckedState>;
-    customElement: Ref<vue.ComponentPublicInstance | undefined>;
+    forwardRef: (ref: Element | vue.ComponentPublicInstance | null) => void;
     isFormControl: vue.ComputedRef<boolean>;
     ariaLabel: vue.ComputedRef<string | null | undefined>;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "update:checked"[], "update:checked", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    readonly asChild: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
+    };
     readonly as: {
         readonly type: PropType<AsTag | Component>;
         readonly required: false;
@@ -150,78 +143,72 @@ declare const DestylerCheckboxRoot: vue.DefineComponent<{
         readonly type: PropType<string>;
         readonly required: false;
     };
-    readonly asChild: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
-    };
 }>> & {
     "onUpdate:checked"?: ((...args: any[]) => any) | undefined;
 }, {
     readonly checked: boolean | "indeterminate";
+    readonly asChild: boolean;
     readonly as: AsTag | Component;
     readonly disabled: boolean;
     readonly value: string;
-    readonly asChild: boolean;
 }, {}>;
 
 declare const destylerCheckboxIndicatorProps: {
-    as: {
-        type: PropType<AsTag | Component>;
-        required: boolean;
-        default: string;
+    readonly asChild: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
     };
-    forceMount: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
+    readonly as: {
+        readonly type: PropType<AsTag | Component>;
+        readonly required: false;
+        readonly default: "button";
     };
-    asChild: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
+    readonly forceMount: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
     };
 };
+type DestylerCheckboxIndicatorProps = ExtractPublicPropTypes<typeof destylerCheckboxIndicatorProps>;
 declare const DestylerCheckboxIndicator: vue.DefineComponent<{
-    as: {
-        type: PropType<AsTag | Component>;
-        required: boolean;
-        default: string;
+    readonly asChild: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
     };
-    forceMount: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
+    readonly as: {
+        readonly type: PropType<AsTag | Component>;
+        readonly required: false;
+        readonly default: "button";
     };
-    asChild: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
+    readonly forceMount: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
     };
 }, {
     rootContext: CheckboxRootContext;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
-    as: {
-        type: PropType<AsTag | Component>;
-        required: boolean;
-        default: string;
+    readonly asChild: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
     };
-    forceMount: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
+    readonly as: {
+        readonly type: PropType<AsTag | Component>;
+        readonly required: false;
+        readonly default: "button";
     };
-    asChild: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
+    readonly forceMount: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
     };
 }>>, {
-    as: AsTag | Component;
-    asChild: boolean;
-    forceMount: boolean;
+    readonly asChild: boolean;
+    readonly as: AsTag | Component;
+    readonly forceMount: boolean;
 }, {}>;
 
-declare function DestylerCheckboxResolver(): ComponentResolver;
-
-export { type CheckboxRootContext, DestylerCheckboxIndicator, DestylerCheckboxResolver, DestylerCheckboxRoot, type DestylerCheckboxRootProps, destylerCheckboxIndicatorProps, destylerCheckboxRootProps, injectCheckboxRootContext, provideCheckboxRootContext };
+export { DestylerCheckboxIndicator, type DestylerCheckboxIndicatorProps, DestylerCheckboxRoot, type DestylerCheckboxRootProps };

package/dist/index.d.ts

@@ -1,22 +1,16 @@
 import * as vue from 'vue';
-import { Component, PropType, Ref } from 'vue';
+import { PropType, Component, Ref } from 'vue';
 import { AsTag } from '@destyler/primitive';
-import { ComponentResolver } from 'unplugin-vue-components';
+import { ExtractPublicPropTypes } from '@destyler/shared';
 
 type CheckedState = boolean | 'indeterminate';
 
-interface DestylerCheckboxRootProps {
-    asChild?: boolean;
-    as?: AsTag | Component;
-    defaultChecked?: boolean;
-    checked?: boolean | 'indeterminate';
-    disabled?: boolean;
-    required?: boolean;
-    name?: string;
-    value?: string;
-    id?: string;
-}
 declare const destylerCheckboxRootProps: {
+    readonly asChild: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
+    };
     readonly as: {
         readonly type: PropType<AsTag | Component>;
         readonly required: false;
@@ -53,19 +47,18 @@ declare const destylerCheckboxRootProps: {
         readonly type: PropType<string>;
         readonly required: false;
     };
-    readonly asChild: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
-    };
 };
+type DestylerCheckboxRootProps = ExtractPublicPropTypes<typeof destylerCheckboxRootProps>;
 interface CheckboxRootContext {
     disabled: Ref<boolean>;
     state: Ref<CheckedState>;
 }
-declare const injectCheckboxRootContext: <T extends CheckboxRootContext | null | undefined = CheckboxRootContext>(fallback?: T | undefined) => T extends null ? CheckboxRootContext | null : CheckboxRootContext;
-declare const provideCheckboxRootContext: (contextValue: CheckboxRootContext) => CheckboxRootContext;
 declare const DestylerCheckboxRoot: vue.DefineComponent<{
+    readonly asChild: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
+    };
     readonly as: {
         readonly type: PropType<AsTag | Component>;
         readonly required: false;
@@ -102,18 +95,18 @@ declare const DestylerCheckboxRoot: vue.DefineComponent<{
         readonly type: PropType<string>;
         readonly required: false;
     };
-    readonly asChild: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
-    };
 }, {
     disabled: Ref<false> | Ref<true>;
     checked: Ref<CheckedState>;
-    customElement: Ref<vue.ComponentPublicInstance | undefined>;
+    forwardRef: (ref: Element | vue.ComponentPublicInstance | null) => void;
     isFormControl: vue.ComputedRef<boolean>;
     ariaLabel: vue.ComputedRef<string | null | undefined>;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "update:checked"[], "update:checked", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+    readonly asChild: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
+    };
     readonly as: {
         readonly type: PropType<AsTag | Component>;
         readonly required: false;
@@ -150,78 +143,72 @@ declare const DestylerCheckboxRoot: vue.DefineComponent<{
         readonly type: PropType<string>;
         readonly required: false;
     };
-    readonly asChild: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
-    };
 }>> & {
     "onUpdate:checked"?: ((...args: any[]) => any) | undefined;
 }, {
     readonly checked: boolean | "indeterminate";
+    readonly asChild: boolean;
     readonly as: AsTag | Component;
     readonly disabled: boolean;
     readonly value: string;
-    readonly asChild: boolean;
 }, {}>;
 
 declare const destylerCheckboxIndicatorProps: {
-    as: {
-        type: PropType<AsTag | Component>;
-        required: boolean;
-        default: string;
+    readonly asChild: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
     };
-    forceMount: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
+    readonly as: {
+        readonly type: PropType<AsTag | Component>;
+        readonly required: false;
+        readonly default: "button";
     };
-    asChild: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
+    readonly forceMount: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
     };
 };
+type DestylerCheckboxIndicatorProps = ExtractPublicPropTypes<typeof destylerCheckboxIndicatorProps>;
 declare const DestylerCheckboxIndicator: vue.DefineComponent<{
-    as: {
-        type: PropType<AsTag | Component>;
-        required: boolean;
-        default: string;
+    readonly asChild: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
     };
-    forceMount: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
+    readonly as: {
+        readonly type: PropType<AsTag | Component>;
+        readonly required: false;
+        readonly default: "button";
     };
-    asChild: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
+    readonly forceMount: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
     };
 }, {
     rootContext: CheckboxRootContext;
 }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
-    as: {
-        type: PropType<AsTag | Component>;
-        required: boolean;
-        default: string;
+    readonly asChild: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
     };
-    forceMount: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
+    readonly as: {
+        readonly type: PropType<AsTag | Component>;
+        readonly required: false;
+        readonly default: "button";
     };
-    asChild: {
-        type: PropType<boolean>;
-        required: boolean;
-        default: boolean;
+    readonly forceMount: {
+        readonly type: PropType<boolean>;
+        readonly required: false;
+        readonly default: false;
     };
 }>>, {
-    as: AsTag | Component;
-    asChild: boolean;
-    forceMount: boolean;
+    readonly asChild: boolean;
+    readonly as: AsTag | Component;
+    readonly forceMount: boolean;
 }, {}>;
 
-declare function DestylerCheckboxResolver(): ComponentResolver;
-
-export { type CheckboxRootContext, DestylerCheckboxIndicator, DestylerCheckboxResolver, DestylerCheckboxRoot, type DestylerCheckboxRootProps, destylerCheckboxIndicatorProps, destylerCheckboxRootProps, injectCheckboxRootContext, provideCheckboxRootContext };
+export { DestylerCheckboxIndicator, type DestylerCheckboxIndicatorProps, DestylerCheckboxRoot, type DestylerCheckboxRootProps };

package/dist/index.mjs

@@ -1,6 +1,6 @@
 import { defineComponent, toRef, computed, withDirectives, h, mergeProps } from 'vue';
-import { destylerPrimitiveProp, DestylerPrimitive } from '@destyler/primitive';
-import { useVModel, useCustomElement, useFormControl } from '@destyler/composition';
+import { DestylerPrimitive } from '@destyler/primitive';
+import { useVModel, useForwardExpose, useFormControl } from '@destyler/composition';
 import { createContext } from '@destyler/shared';
 import { BindOnceDirective } from '@destyler/directives';
 import { DestylerPresence } from '@destyler/presence';
@@ -13,7 +13,11 @@ function getState(checked) {
 }
 
 const destylerCheckboxRootProps = {
-  ...destylerPrimitiveProp,
+  asChild: {
+    type: Boolean,
+    required: false,
+    default: false
+  },
   as: {
     type: [String, Object],
     required: false,
@@ -51,7 +55,7 @@ const destylerCheckboxRootProps = {
     required: false
   }
 };
-const [injectCheckboxRootContext, provideCheckboxRootContext] = createContext("CheckboxRoot");
+const [injectCheckboxRootContext, provideCheckboxRootContext] = createContext("DestylerCheckboxRoot");
 const DestylerCheckboxRoot = defineComponent({
   name: "DestylerCheckboxRoot",
   props: destylerCheckboxRootProps,
@@ -62,7 +66,7 @@ const DestylerCheckboxRoot = defineComponent({
       defaultValue: props.defaultChecked,
       passive: props.checked === void 0
     });
-    const { customElement, currentElement } = useCustomElement();
+    const { forwardRef, currentElement } = useForwardExpose();
     const isFormControl = useFormControl(currentElement);
     const ariaLabel = computed(() => props.id && currentElement.value ? document.querySelector(`[for="${props.id}"]`)?.textContent : void 0);
     provideCheckboxRootContext({
@@ -72,7 +76,7 @@ const DestylerCheckboxRoot = defineComponent({
     return {
       disabled: disabledRef,
       checked: checkedRef,
-      customElement,
+      forwardRef,
       isFormControl,
       ariaLabel
     };
@@ -81,7 +85,7 @@ const DestylerCheckboxRoot = defineComponent({
     const useVShow = this.isFormControl;
     return [
       withDirectives(h(DestylerPrimitive, mergeProps(this.$attrs, {
-        "ref": "customElement",
+        "ref": (el) => this.forwardRef(el),
         "role": "checkbox",
         "asChild": this.$props.asChild,
         "as": this.$props.as,
@@ -95,7 +99,9 @@ const DestylerCheckboxRoot = defineComponent({
         "onClick": () => {
           this.checked = !this.checked;
         }
-      }), this.$slots.default?.()), [
+      }), {
+        default: () => this.$slots.default?.()
+      }), [
         [BindOnceDirective, { id: this.$props.id }]
       ]),
       useVShow ? h("input", {
@@ -120,7 +126,11 @@ const DestylerCheckboxRoot = defineComponent({
 });
 
 const destylerCheckboxIndicatorProps = {
-  ...destylerPrimitiveProp,
+  asChild: {
+    type: Boolean,
+    required: false,
+    default: false
+  },
   as: {
     type: [String, Object],
     required: false,
@@ -152,21 +162,10 @@ const DestylerCheckboxIndicator = defineComponent({
       "style": {
         pointerEvents: "none"
       }
-    }), this.$slots.default?.()));
+    }), {
+      default: () => this.$slots.default?.()
+    }));
   }
 });
 
-const name = "@destyler/checkbox";
-
-const packageName = name;
-function DestylerCheckboxResolver() {
-  return {
-    type: "component",
-    resolve: (name2) => {
-      if (name2 === "DestylerTemplate")
-        return { name: name2, from: packageName };
-    }
-  };
-}
-
-export { DestylerCheckboxIndicator, DestylerCheckboxResolver, DestylerCheckboxRoot, destylerCheckboxIndicatorProps, destylerCheckboxRootProps, injectCheckboxRootContext, provideCheckboxRootContext };
+export { DestylerCheckboxIndicator, DestylerCheckboxRoot };

package/dist/resolver.cjs

@@ -0,0 +1,21 @@
+'use strict';
+
+const name = "@destyler/checkbox";
+
+const packageName = name;
+const checkboxComponentName = [
+  "DestylerCheckboxRoot",
+  "DestylerCheckboxIndicator"
+];
+function DestylerCheckboxResolver() {
+  return {
+    type: "component",
+    resolve: (name2) => {
+      if (checkboxComponentName.includes(name2))
+        return { name: name2, from: packageName };
+    }
+  };
+}
+
+exports.DestylerCheckboxResolver = DestylerCheckboxResolver;
+exports.checkboxComponentName = checkboxComponentName;

package/dist/resolver.d.cts

@@ -0,0 +1,6 @@
+import { ComponentResolver } from 'unplugin-vue-components';
+
+declare const checkboxComponentName: string[];
+declare function DestylerCheckboxResolver(): ComponentResolver;
+
+export { DestylerCheckboxResolver, checkboxComponentName };

package/dist/resolver.d.mts

@@ -0,0 +1,6 @@
+import { ComponentResolver } from 'unplugin-vue-components';
+
+declare const checkboxComponentName: string[];
+declare function DestylerCheckboxResolver(): ComponentResolver;
+
+export { DestylerCheckboxResolver, checkboxComponentName };

package/dist/resolver.d.ts

@@ -0,0 +1,6 @@
+import { ComponentResolver } from 'unplugin-vue-components';
+
+declare const checkboxComponentName: string[];
+declare function DestylerCheckboxResolver(): ComponentResolver;
+
+export { DestylerCheckboxResolver, checkboxComponentName };

package/dist/resolver.mjs

@@ -0,0 +1,18 @@
+const name = "@destyler/checkbox";
+
+const packageName = name;
+const checkboxComponentName = [
+  "DestylerCheckboxRoot",
+  "DestylerCheckboxIndicator"
+];
+function DestylerCheckboxResolver() {
+  return {
+    type: "component",
+    resolve: (name2) => {
+      if (checkboxComponentName.includes(name2))
+        return { name: name2, from: packageName };
+    }
+  };
+}
+
+export { DestylerCheckboxResolver, checkboxComponentName };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@destyler/checkbox",
-  "version": "0.0.1-beta.9",
+  "version": "0.0.2",
   "description": "unstyled checkbox component for vue",
   "author": "Elone Hoo <elonehoo@gmail.com>",
   "license": "MIT",
@@ -10,6 +10,16 @@
       "import": "./dist/index.mjs",
       "require": "./dist/index.cjs"
     },
+    "./resolver": {
+      "types": "./dist/resolver.d.ts",
+      "import": "./dist/resolver.mjs",
+      "require": "./dist/resolver.cjs"
+    },
+    "./component": {
+      "types": "./dist/component.d.ts",
+      "import": "./dist/component.mjs",
+      "require": "./dist/component.cjs"
+    },
     "./*": "./*"
   },
   "main": "dist/index.cjs",
@@ -23,11 +33,11 @@
     "vue": ">=3.3.4"
   },
   "dependencies": {
-    "@destyler/presence": "0.0.1-beta.9",
-    "@destyler/primitive": "0.0.1-beta.9",
-    "@destyler/composition": "0.0.1-beta.9",
-    "@destyler/shared": "0.0.1-beta.9",
-    "@destyler/directives": "0.0.1-beta.9"
+    "@destyler/composition": "0.0.2",
+    "@destyler/presence": "0.0.2",
+    "@destyler/shared": "0.0.2",
+    "@destyler/primitive": "0.0.2",
+    "@destyler/directives": "0.0.2"
   },
   "scripts": {
     "clear": "rimraf ./dist",