@plasmicapp/react-web 0.2.201 → 0.2.203
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/all.d.ts +1926 -1925
- package/dist/auth/PlasmicPageGuard.d.ts +11 -11
- package/dist/common.d.ts +10 -10
- package/dist/data-sources/index.d.ts +1 -1
- package/dist/host/index.d.ts +1 -1
- package/dist/index-common.d.ts +18 -18
- package/dist/index-skinny.d.ts +1 -1
- package/dist/index.cjs.js +3495 -3495
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.d.ts +11 -11
- package/dist/plume/button/index.d.ts +36 -36
- package/dist/plume/checkbox/index.d.ts +47 -47
- package/dist/plume/collection-utils.d.ts +191 -191
- package/dist/plume/collection-utils.spec.d.ts +1 -1
- package/dist/plume/menu/context.d.ts +8 -8
- package/dist/plume/menu/index.d.ts +3 -3
- package/dist/plume/menu/menu-group.d.ts +23 -23
- package/dist/plume/menu/menu-item.d.ts +23 -23
- package/dist/plume/menu/menu.d.ts +39 -39
- package/dist/plume/menu-button/DropdownMenu.d.ts +34 -34
- package/dist/plume/menu-button/index.d.ts +2 -2
- package/dist/plume/menu-button/menu-button.d.ts +72 -72
- package/dist/plume/menu-button/menu-trigger.d.ts +21 -21
- package/dist/plume/plume-utils.d.ts +41 -41
- package/dist/plume/props-utils.d.ts +15 -15
- package/dist/plume/select/context.d.ts +3 -3
- package/dist/plume/select/index.d.ts +4 -4
- package/dist/plume/select/select-option-group.d.ts +23 -23
- package/dist/plume/select/select-option.d.ts +23 -23
- package/dist/plume/select/select.d.ts +111 -111
- package/dist/plume/switch/index.d.ts +39 -39
- package/dist/plume/text-input/index.d.ts +36 -36
- package/dist/plume/triggered-overlay/context.d.ts +14 -14
- package/dist/plume/triggered-overlay/index.d.ts +2 -2
- package/dist/plume/triggered-overlay/triggered-overlay.d.ts +24 -24
- package/dist/query/index.d.ts +1 -1
- package/dist/react-utils.d.ts +21 -21
- package/dist/react-utils.spec.d.ts +1 -1
- package/dist/react-web.esm.js +3496 -3496
- package/dist/react-web.esm.js.map +1 -1
- package/dist/render/PlasmicHead/index.d.ts +37 -37
- package/dist/render/PlasmicIcon.d.ts +4 -4
- package/dist/render/PlasmicImg/index.d.ts +81 -81
- package/dist/render/PlasmicLink.d.ts +2 -2
- package/dist/render/PlasmicSlot.d.ts +11 -11
- package/dist/render/Stack.d.ts +51 -51
- package/dist/render/elements.d.ts +74 -74
- package/dist/render/global-variants.d.ts +1 -1
- package/dist/render/screen-variants.d.ts +5 -5
- package/dist/render/ssr.d.ts +21 -21
- package/dist/render/translation.d.ts +19 -19
- package/dist/render/triggers.d.ts +39 -39
- package/dist/states/errors.d.ts +13 -13
- package/dist/states/graph.d.ts +25 -25
- package/dist/states/helpers.d.ts +43 -43
- package/dist/states/index.d.ts +4 -4
- package/dist/states/types.d.ts +66 -66
- package/dist/states/valtio.d.ts +10 -10
- package/dist/states/vanilla.d.ts +3 -3
- package/dist/stories/PlasmicImg.stories.d.ts +6 -6
- package/dist/stories/UseDollarState.stories.d.ts +78 -78
- package/lib/data-sources/index.d.ts +1 -1
- package/lib/host/index.d.ts +1 -1
- package/lib/query/index.d.ts +1 -1
- package/package.json +8 -9
- package/skinny/dist/auth/PlasmicPageGuard.d.ts +11 -11
- package/skinny/dist/{collection-utils-0967eaf0.js → collection-utils-2f28e4eb.js} +297 -297
- package/skinny/dist/{collection-utils-0967eaf0.js.map → collection-utils-2f28e4eb.js.map} +1 -1
- package/skinny/dist/{common-9d6d348d.js → common-ed411407.js} +130 -130
- package/skinny/dist/{common-9d6d348d.js.map → common-ed411407.js.map} +1 -1
- package/skinny/dist/common.d.ts +10 -10
- package/skinny/dist/data-sources/index.d.ts +1 -1
- package/skinny/dist/host/index.d.ts +1 -1
- package/skinny/dist/index-common.d.ts +18 -18
- package/skinny/dist/index-skinny.d.ts +1 -1
- package/skinny/dist/index.d.ts +11 -11
- package/skinny/dist/index.js +1559 -1559
- package/skinny/dist/index.js.map +1 -1
- package/skinny/dist/plume/button/index.d.ts +36 -36
- package/skinny/dist/plume/button/index.js +21 -21
- package/skinny/dist/plume/checkbox/index.d.ts +47 -47
- package/skinny/dist/plume/checkbox/index.js +64 -64
- package/skinny/dist/plume/collection-utils.d.ts +191 -191
- package/skinny/dist/plume/collection-utils.spec.d.ts +1 -1
- package/skinny/dist/plume/menu/context.d.ts +8 -8
- package/skinny/dist/plume/menu/index.d.ts +3 -3
- package/skinny/dist/plume/menu/index.js +165 -165
- package/skinny/dist/plume/menu/menu-group.d.ts +23 -23
- package/skinny/dist/plume/menu/menu-item.d.ts +23 -23
- package/skinny/dist/plume/menu/menu.d.ts +39 -39
- package/skinny/dist/plume/menu-button/DropdownMenu.d.ts +34 -34
- package/skinny/dist/plume/menu-button/index.d.ts +2 -2
- package/skinny/dist/plume/menu-button/index.js +125 -125
- package/skinny/dist/plume/menu-button/index.js.map +1 -1
- package/skinny/dist/plume/menu-button/menu-button.d.ts +72 -72
- package/skinny/dist/plume/menu-button/menu-trigger.d.ts +21 -21
- package/skinny/dist/plume/plume-utils.d.ts +41 -41
- package/skinny/dist/plume/props-utils.d.ts +15 -15
- package/skinny/dist/plume/select/context.d.ts +3 -3
- package/skinny/dist/plume/select/index.d.ts +4 -4
- package/skinny/dist/plume/select/index.js +250 -250
- package/skinny/dist/plume/select/index.js.map +1 -1
- package/skinny/dist/plume/select/select-option-group.d.ts +23 -23
- package/skinny/dist/plume/select/select-option.d.ts +23 -23
- package/skinny/dist/plume/select/select.d.ts +111 -111
- package/skinny/dist/plume/switch/index.d.ts +39 -39
- package/skinny/dist/plume/switch/index.js +61 -61
- package/skinny/dist/plume/text-input/index.d.ts +36 -36
- package/skinny/dist/plume/text-input/index.js +45 -45
- package/skinny/dist/plume/triggered-overlay/context.d.ts +14 -14
- package/skinny/dist/plume/triggered-overlay/index.d.ts +2 -2
- package/skinny/dist/plume/triggered-overlay/index.js +100 -100
- package/skinny/dist/plume/triggered-overlay/index.js.map +1 -1
- package/skinny/dist/plume/triggered-overlay/triggered-overlay.d.ts +24 -24
- package/skinny/dist/{plume-utils-7d68bcc0.js → plume-utils-e699cd08.js} +30 -30
- package/skinny/dist/{plume-utils-7d68bcc0.js.map → plume-utils-e699cd08.js.map} +1 -1
- package/skinny/dist/{props-utils-9f9c761a.js → props-utils-9d74371f.js} +4 -4
- package/skinny/dist/{props-utils-9f9c761a.js.map → props-utils-9d74371f.js.map} +1 -1
- package/skinny/dist/query/index.d.ts +1 -1
- package/skinny/dist/{react-utils-ee4e03ba.js → react-utils-5ff031c2.js} +195 -195
- package/skinny/dist/{react-utils-ee4e03ba.js.map → react-utils-5ff031c2.js.map} +1 -1
- package/skinny/dist/react-utils.d.ts +21 -21
- package/skinny/dist/react-utils.spec.d.ts +1 -1
- package/skinny/dist/render/PlasmicHead/index.d.ts +37 -37
- package/skinny/dist/render/PlasmicHead/index.js +54 -54
- package/skinny/dist/render/PlasmicIcon.d.ts +4 -4
- package/skinny/dist/render/PlasmicImg/index.d.ts +81 -81
- package/skinny/dist/render/PlasmicImg/index.js +297 -297
- package/skinny/dist/render/PlasmicLink.d.ts +2 -2
- package/skinny/dist/render/PlasmicSlot.d.ts +11 -11
- package/skinny/dist/render/Stack.d.ts +51 -51
- package/skinny/dist/render/elements.d.ts +74 -74
- package/skinny/dist/render/global-variants.d.ts +1 -1
- package/skinny/dist/render/screen-variants.d.ts +5 -5
- package/skinny/dist/render/ssr.d.ts +21 -21
- package/skinny/dist/render/translation.d.ts +19 -19
- package/skinny/dist/render/triggers.d.ts +39 -39
- package/skinny/dist/{ssr-c9834f50.js → ssr-8625df04.js} +107 -107
- package/skinny/dist/{ssr-c9834f50.js.map → ssr-8625df04.js.map} +1 -1
- package/skinny/dist/states/errors.d.ts +13 -13
- package/skinny/dist/states/graph.d.ts +25 -25
- package/skinny/dist/states/helpers.d.ts +43 -43
- package/skinny/dist/states/index.d.ts +4 -4
- package/skinny/dist/states/types.d.ts +66 -66
- package/skinny/dist/states/valtio.d.ts +10 -10
- package/skinny/dist/states/vanilla.d.ts +3 -3
- package/skinny/dist/stories/PlasmicImg.stories.d.ts +6 -6
- package/skinny/dist/stories/UseDollarState.stories.d.ts +78 -78
|
@@ -1,36 +1,36 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { AnyPlasmicClass, PlasmicClassArgs, PlasmicClassOverrides, PlasmicClassVariants, VariantDef } from "../plume-utils";
|
|
3
|
-
interface CommonProps {
|
|
4
|
-
showStartIcon?: boolean;
|
|
5
|
-
showEndIcon?: boolean;
|
|
6
|
-
startIcon?: React.ReactNode;
|
|
7
|
-
endIcon?: React.ReactNode;
|
|
8
|
-
children?: React.ReactNode;
|
|
9
|
-
isDisabled?: boolean;
|
|
10
|
-
}
|
|
11
|
-
interface HtmlButtonProps extends Omit<React.ComponentProps<"button">, "ref" | "disabled"> {
|
|
12
|
-
}
|
|
13
|
-
interface HtmlAnchorProps extends Omit<React.ComponentProps<"a">, "ref" | "href"> {
|
|
14
|
-
link?: string;
|
|
15
|
-
}
|
|
16
|
-
export type BaseButtonProps = CommonProps & HtmlButtonProps & HtmlAnchorProps;
|
|
17
|
-
export type HtmlAnchorOnlyProps = Exclude<keyof HtmlAnchorProps, keyof HtmlButtonProps>;
|
|
18
|
-
export type HtmlButtonOnlyProps = Exclude<keyof HtmlButtonProps, keyof HtmlAnchorProps>;
|
|
19
|
-
export type ButtonRef = React.Ref<HTMLButtonElement | HTMLAnchorElement>;
|
|
20
|
-
interface ButtonConfig<C extends AnyPlasmicClass> {
|
|
21
|
-
showStartIconVariant: VariantDef<PlasmicClassVariants<C>>;
|
|
22
|
-
showEndIconVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
23
|
-
isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
24
|
-
startIconSlot?: keyof PlasmicClassArgs<C>;
|
|
25
|
-
endIconSlot?: keyof PlasmicClassArgs<C>;
|
|
26
|
-
contentSlot: keyof PlasmicClassArgs<C>;
|
|
27
|
-
root: keyof PlasmicClassOverrides<C>;
|
|
28
|
-
}
|
|
29
|
-
export declare function useButton<P extends BaseButtonProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: ButtonConfig<C>, ref?: ButtonRef): {
|
|
30
|
-
plasmicProps: {
|
|
31
|
-
variants: PlasmicClassVariants<C>;
|
|
32
|
-
args: PlasmicClassArgs<C>;
|
|
33
|
-
overrides: PlasmicClassOverrides<C>;
|
|
34
|
-
};
|
|
35
|
-
};
|
|
36
|
-
export {};
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { AnyPlasmicClass, PlasmicClassArgs, PlasmicClassOverrides, PlasmicClassVariants, VariantDef } from "../plume-utils";
|
|
3
|
+
interface CommonProps {
|
|
4
|
+
showStartIcon?: boolean;
|
|
5
|
+
showEndIcon?: boolean;
|
|
6
|
+
startIcon?: React.ReactNode;
|
|
7
|
+
endIcon?: React.ReactNode;
|
|
8
|
+
children?: React.ReactNode;
|
|
9
|
+
isDisabled?: boolean;
|
|
10
|
+
}
|
|
11
|
+
interface HtmlButtonProps extends Omit<React.ComponentProps<"button">, "ref" | "disabled"> {
|
|
12
|
+
}
|
|
13
|
+
interface HtmlAnchorProps extends Omit<React.ComponentProps<"a">, "ref" | "href"> {
|
|
14
|
+
link?: string;
|
|
15
|
+
}
|
|
16
|
+
export type BaseButtonProps = CommonProps & HtmlButtonProps & HtmlAnchorProps;
|
|
17
|
+
export type HtmlAnchorOnlyProps = Exclude<keyof HtmlAnchorProps, keyof HtmlButtonProps>;
|
|
18
|
+
export type HtmlButtonOnlyProps = Exclude<keyof HtmlButtonProps, keyof HtmlAnchorProps>;
|
|
19
|
+
export type ButtonRef = React.Ref<HTMLButtonElement | HTMLAnchorElement>;
|
|
20
|
+
interface ButtonConfig<C extends AnyPlasmicClass> {
|
|
21
|
+
showStartIconVariant: VariantDef<PlasmicClassVariants<C>>;
|
|
22
|
+
showEndIconVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
23
|
+
isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
24
|
+
startIconSlot?: keyof PlasmicClassArgs<C>;
|
|
25
|
+
endIconSlot?: keyof PlasmicClassArgs<C>;
|
|
26
|
+
contentSlot: keyof PlasmicClassArgs<C>;
|
|
27
|
+
root: keyof PlasmicClassOverrides<C>;
|
|
28
|
+
}
|
|
29
|
+
export declare function useButton<P extends BaseButtonProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: ButtonConfig<C>, ref?: ButtonRef): {
|
|
30
|
+
plasmicProps: {
|
|
31
|
+
variants: PlasmicClassVariants<C>;
|
|
32
|
+
args: PlasmicClassArgs<C>;
|
|
33
|
+
overrides: PlasmicClassOverrides<C>;
|
|
34
|
+
};
|
|
35
|
+
};
|
|
36
|
+
export {};
|
|
@@ -1,26 +1,26 @@
|
|
|
1
|
-
import { c as __rest, b as __assign, p as pick, d as __spreadArray, e as __read, o as omit } from '../../common-
|
|
2
|
-
import { m as mergeVariantToggles } from '../../plume-utils-
|
|
1
|
+
import { c as __rest, b as __assign, p as pick, d as __spreadArray, e as __read, o as omit } from '../../common-ed411407.js';
|
|
2
|
+
import { m as mergeVariantToggles } from '../../plume-utils-e699cd08.js';
|
|
3
3
|
import 'react';
|
|
4
4
|
|
|
5
|
-
function useButton(plasmicClass, props, config, ref) {
|
|
6
|
-
var _a, _b, _c, _d;
|
|
7
|
-
if (ref === void 0) { ref = null; }
|
|
8
|
-
var link = props.link, isDisabled = props.isDisabled, startIcon = props.startIcon, endIcon = props.endIcon, showStartIcon = props.showStartIcon, showEndIcon = props.showEndIcon, children = props.children, rest = __rest(props, ["link", "isDisabled", "startIcon", "endIcon", "showStartIcon", "showEndIcon", "children"]);
|
|
9
|
-
var variants = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalVariantProps), false))), mergeVariantToggles({ def: config.showStartIconVariant, active: showStartIcon }, { def: config.showEndIconVariant, active: showEndIcon }, { def: config.isDisabledVariant, active: isDisabled }));
|
|
10
|
-
var args = __assign(__assign(__assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalArgProps), false))), (config.startIconSlot && (_a = {}, _a[config.startIconSlot] = startIcon, _a))), (config.endIconSlot && (_b = {}, _b[config.endIconSlot] = endIcon, _b))), (_c = {}, _c[config.contentSlot] = children, _c));
|
|
11
|
-
var overrides = (_d = {},
|
|
12
|
-
_d[config.root] = {
|
|
13
|
-
as: !!link ? "a" : "button",
|
|
14
|
-
props: __assign(__assign(__assign({}, omit.apply(void 0, __spreadArray(__spreadArray([rest], __read(plasmicClass.internalArgProps), false), __read(plasmicClass.internalVariantProps), false))), { ref: ref, disabled: isDisabled }), (!!link && { href: link }))
|
|
15
|
-
},
|
|
16
|
-
_d);
|
|
17
|
-
return {
|
|
18
|
-
plasmicProps: {
|
|
19
|
-
variants: variants,
|
|
20
|
-
args: args,
|
|
21
|
-
overrides: overrides
|
|
22
|
-
}
|
|
23
|
-
};
|
|
5
|
+
function useButton(plasmicClass, props, config, ref) {
|
|
6
|
+
var _a, _b, _c, _d;
|
|
7
|
+
if (ref === void 0) { ref = null; }
|
|
8
|
+
var link = props.link, isDisabled = props.isDisabled, startIcon = props.startIcon, endIcon = props.endIcon, showStartIcon = props.showStartIcon, showEndIcon = props.showEndIcon, children = props.children, rest = __rest(props, ["link", "isDisabled", "startIcon", "endIcon", "showStartIcon", "showEndIcon", "children"]);
|
|
9
|
+
var variants = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalVariantProps), false))), mergeVariantToggles({ def: config.showStartIconVariant, active: showStartIcon }, { def: config.showEndIconVariant, active: showEndIcon }, { def: config.isDisabledVariant, active: isDisabled }));
|
|
10
|
+
var args = __assign(__assign(__assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalArgProps), false))), (config.startIconSlot && (_a = {}, _a[config.startIconSlot] = startIcon, _a))), (config.endIconSlot && (_b = {}, _b[config.endIconSlot] = endIcon, _b))), (_c = {}, _c[config.contentSlot] = children, _c));
|
|
11
|
+
var overrides = (_d = {},
|
|
12
|
+
_d[config.root] = {
|
|
13
|
+
as: !!link ? "a" : "button",
|
|
14
|
+
props: __assign(__assign(__assign({}, omit.apply(void 0, __spreadArray(__spreadArray([rest], __read(plasmicClass.internalArgProps), false), __read(plasmicClass.internalVariantProps), false))), { ref: ref, disabled: isDisabled }), (!!link && { href: link })),
|
|
15
|
+
},
|
|
16
|
+
_d);
|
|
17
|
+
return {
|
|
18
|
+
plasmicProps: {
|
|
19
|
+
variants: variants,
|
|
20
|
+
args: args,
|
|
21
|
+
overrides: overrides,
|
|
22
|
+
},
|
|
23
|
+
};
|
|
24
24
|
}
|
|
25
25
|
|
|
26
26
|
export { useButton };
|
|
@@ -1,47 +1,47 @@
|
|
|
1
|
-
import { AriaCheckboxProps } from "@react-types/checkbox";
|
|
2
|
-
import * as React from "react";
|
|
3
|
-
import { AnyPlasmicClass, PlasmicClassArgs, PlasmicClassOverrides, PlasmicClassVariants, VariantDef } from "../plume-utils";
|
|
4
|
-
import { StyleProps } from "../props-utils";
|
|
5
|
-
export type CheckboxRef = React.Ref<CheckboxRefValue>;
|
|
6
|
-
export interface CheckboxRefValue extends CheckboxState {
|
|
7
|
-
getRoot: () => HTMLElement | null;
|
|
8
|
-
focus: () => void;
|
|
9
|
-
blur: () => void;
|
|
10
|
-
}
|
|
11
|
-
interface CheckboxState {
|
|
12
|
-
setChecked: (checked: boolean) => void;
|
|
13
|
-
}
|
|
14
|
-
export interface CheckboxProps extends Omit<AriaCheckboxProps, "isSelected" | "defaultSelected">, StyleProps {
|
|
15
|
-
/**
|
|
16
|
-
* Whether the Checkbox is checked or not; controlled
|
|
17
|
-
*/
|
|
18
|
-
isChecked?: boolean;
|
|
19
|
-
/**
|
|
20
|
-
* Whether the Checkbox is checked by default; uncontrolled
|
|
21
|
-
*/
|
|
22
|
-
defaultChecked?: boolean;
|
|
23
|
-
/**
|
|
24
|
-
* Whether the Checkbox is in an "indeterminate" state; this usually
|
|
25
|
-
* refers to a "check all" that is used to check / uncheck many other
|
|
26
|
-
* checkboxes, and is visually indeterminate if some of its controlled
|
|
27
|
-
* checkboxes are checked and some are not.
|
|
28
|
-
*/
|
|
29
|
-
isIndeterminate?: boolean;
|
|
30
|
-
}
|
|
31
|
-
interface CheckboxConfig<C extends AnyPlasmicClass> {
|
|
32
|
-
isCheckedVariant: VariantDef<PlasmicClassVariants<C>>;
|
|
33
|
-
isIndeterminateVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
34
|
-
isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
35
|
-
noLabelVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
36
|
-
labelSlot?: keyof PlasmicClassArgs<C>;
|
|
37
|
-
root: keyof PlasmicClassOverrides<C>;
|
|
38
|
-
}
|
|
39
|
-
export declare function useCheckbox<P extends CheckboxProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: CheckboxConfig<C>, ref?: CheckboxRef): {
|
|
40
|
-
plasmicProps: {
|
|
41
|
-
variants: PlasmicClassVariants<C>;
|
|
42
|
-
overrides: PlasmicClassOverrides<C>;
|
|
43
|
-
args: PlasmicClassArgs<C>;
|
|
44
|
-
};
|
|
45
|
-
state: CheckboxState;
|
|
46
|
-
};
|
|
47
|
-
export {};
|
|
1
|
+
import { AriaCheckboxProps } from "@react-types/checkbox";
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
import { AnyPlasmicClass, PlasmicClassArgs, PlasmicClassOverrides, PlasmicClassVariants, VariantDef } from "../plume-utils";
|
|
4
|
+
import { StyleProps } from "../props-utils";
|
|
5
|
+
export type CheckboxRef = React.Ref<CheckboxRefValue>;
|
|
6
|
+
export interface CheckboxRefValue extends CheckboxState {
|
|
7
|
+
getRoot: () => HTMLElement | null;
|
|
8
|
+
focus: () => void;
|
|
9
|
+
blur: () => void;
|
|
10
|
+
}
|
|
11
|
+
interface CheckboxState {
|
|
12
|
+
setChecked: (checked: boolean) => void;
|
|
13
|
+
}
|
|
14
|
+
export interface CheckboxProps extends Omit<AriaCheckboxProps, "isSelected" | "defaultSelected">, StyleProps {
|
|
15
|
+
/**
|
|
16
|
+
* Whether the Checkbox is checked or not; controlled
|
|
17
|
+
*/
|
|
18
|
+
isChecked?: boolean;
|
|
19
|
+
/**
|
|
20
|
+
* Whether the Checkbox is checked by default; uncontrolled
|
|
21
|
+
*/
|
|
22
|
+
defaultChecked?: boolean;
|
|
23
|
+
/**
|
|
24
|
+
* Whether the Checkbox is in an "indeterminate" state; this usually
|
|
25
|
+
* refers to a "check all" that is used to check / uncheck many other
|
|
26
|
+
* checkboxes, and is visually indeterminate if some of its controlled
|
|
27
|
+
* checkboxes are checked and some are not.
|
|
28
|
+
*/
|
|
29
|
+
isIndeterminate?: boolean;
|
|
30
|
+
}
|
|
31
|
+
interface CheckboxConfig<C extends AnyPlasmicClass> {
|
|
32
|
+
isCheckedVariant: VariantDef<PlasmicClassVariants<C>>;
|
|
33
|
+
isIndeterminateVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
34
|
+
isDisabledVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
35
|
+
noLabelVariant?: VariantDef<PlasmicClassVariants<C>>;
|
|
36
|
+
labelSlot?: keyof PlasmicClassArgs<C>;
|
|
37
|
+
root: keyof PlasmicClassOverrides<C>;
|
|
38
|
+
}
|
|
39
|
+
export declare function useCheckbox<P extends CheckboxProps, C extends AnyPlasmicClass>(plasmicClass: C, props: P, config: CheckboxConfig<C>, ref?: CheckboxRef): {
|
|
40
|
+
plasmicProps: {
|
|
41
|
+
variants: PlasmicClassVariants<C>;
|
|
42
|
+
overrides: PlasmicClassOverrides<C>;
|
|
43
|
+
args: PlasmicClassArgs<C>;
|
|
44
|
+
};
|
|
45
|
+
state: CheckboxState;
|
|
46
|
+
};
|
|
47
|
+
export {};
|
|
@@ -1,76 +1,76 @@
|
|
|
1
|
-
import { b as __assign, p as pick, d as __spreadArray, e as __read } from '../../common-
|
|
1
|
+
import { b as __assign, p as pick, d as __spreadArray, e as __read } from '../../common-ed411407.js';
|
|
2
2
|
import { useCheckbox as useCheckbox$1 } from '@react-aria/checkbox';
|
|
3
3
|
import { VisuallyHidden } from '@react-aria/visually-hidden';
|
|
4
4
|
import { useToggleState } from '@react-stately/toggle';
|
|
5
5
|
import * as React from 'react';
|
|
6
|
-
import { m as mergeProps } from '../../react-utils-
|
|
7
|
-
import { a as useEnsureSSRProvider } from '../../ssr-
|
|
8
|
-
import { m as mergeVariantToggles } from '../../plume-utils-
|
|
9
|
-
import { g as getStyleProps } from '../../props-utils-
|
|
6
|
+
import { m as mergeProps } from '../../react-utils-5ff031c2.js';
|
|
7
|
+
import { a as useEnsureSSRProvider } from '../../ssr-8625df04.js';
|
|
8
|
+
import { m as mergeVariantToggles } from '../../plume-utils-e699cd08.js';
|
|
9
|
+
import { g as getStyleProps } from '../../props-utils-9d74371f.js';
|
|
10
10
|
import 'classnames';
|
|
11
11
|
import '@plasmicapp/data-sources-context';
|
|
12
12
|
import '@react-aria/ssr';
|
|
13
13
|
import '../../render/PlasmicHead/index.js';
|
|
14
14
|
|
|
15
|
-
function asAriaCheckboxProps(props) {
|
|
16
|
-
var ariaProps = __assign(__assign({}, props), { isSelected: props.isChecked, defaultSelected: props.defaultChecked });
|
|
17
|
-
delete ariaProps["isChecked"];
|
|
18
|
-
delete ariaProps["defaultChecked"];
|
|
19
|
-
return ariaProps;
|
|
20
|
-
}
|
|
21
|
-
function useCheckbox(plasmicClass, props, config, ref) {
|
|
22
|
-
var _a, _b;
|
|
23
|
-
if (ref === void 0) { ref = null; }
|
|
24
|
-
var children = props.children, isDisabled = props.isDisabled, isIndeterminate = props.isIndeterminate;
|
|
25
|
-
useEnsureSSRProvider();
|
|
26
|
-
var inputRef = React.useRef(null);
|
|
27
|
-
var rootRef = React.useRef(null);
|
|
28
|
-
var ariaProps = asAriaCheckboxProps(props);
|
|
29
|
-
var state = useToggleState(ariaProps);
|
|
30
|
-
var inputProps = useCheckbox$1(ariaProps, state, inputRef).inputProps;
|
|
31
|
-
var variants = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalVariantProps), false))), mergeVariantToggles({
|
|
32
|
-
def: config.isDisabledVariant,
|
|
33
|
-
active: isDisabled
|
|
34
|
-
}, {
|
|
35
|
-
def: config.isCheckedVariant,
|
|
36
|
-
active: state.isSelected
|
|
37
|
-
}, {
|
|
38
|
-
def: config.isIndeterminateVariant,
|
|
39
|
-
active: isIndeterminate
|
|
40
|
-
}, {
|
|
41
|
-
def: config.noLabelVariant,
|
|
42
|
-
active: !children
|
|
43
|
-
}));
|
|
44
|
-
var overrides = (_a = {},
|
|
45
|
-
_a[config.root] = {
|
|
46
|
-
as: "label",
|
|
47
|
-
props: mergeProps(getStyleProps(props), {
|
|
48
|
-
ref: rootRef
|
|
49
|
-
}),
|
|
50
|
-
wrapChildren: function (children) { return (React.createElement(React.Fragment, null,
|
|
51
|
-
React.createElement(VisuallyHidden, null,
|
|
52
|
-
React.createElement("input", __assign({}, inputProps, { ref: inputRef }))),
|
|
53
|
-
children)); }
|
|
54
|
-
},
|
|
55
|
-
_a);
|
|
56
|
-
var args = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalArgProps), false))), (config.labelSlot ? (_b = {}, _b[config.labelSlot] = children, _b) : {}));
|
|
57
|
-
var plumeState = React.useMemo(function () { return ({
|
|
58
|
-
setChecked: function (checked) { return state.setSelected(checked); }
|
|
59
|
-
}); }, [state]);
|
|
60
|
-
React.useImperativeHandle(ref, function () { return ({
|
|
61
|
-
getRoot: function () { return rootRef.current; },
|
|
62
|
-
focus: function () { var _a; return (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus(); },
|
|
63
|
-
blur: function () { var _a; return (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.blur(); },
|
|
64
|
-
setChecked: function (checked) { return plumeState.setChecked(checked); }
|
|
65
|
-
}); }, [rootRef, inputRef, plumeState]);
|
|
66
|
-
return {
|
|
67
|
-
plasmicProps: {
|
|
68
|
-
variants: variants,
|
|
69
|
-
overrides: overrides,
|
|
70
|
-
args: args
|
|
71
|
-
},
|
|
72
|
-
state: plumeState
|
|
73
|
-
};
|
|
15
|
+
function asAriaCheckboxProps(props) {
|
|
16
|
+
var ariaProps = __assign(__assign({}, props), { isSelected: props.isChecked, defaultSelected: props.defaultChecked });
|
|
17
|
+
delete ariaProps["isChecked"];
|
|
18
|
+
delete ariaProps["defaultChecked"];
|
|
19
|
+
return ariaProps;
|
|
20
|
+
}
|
|
21
|
+
function useCheckbox(plasmicClass, props, config, ref) {
|
|
22
|
+
var _a, _b;
|
|
23
|
+
if (ref === void 0) { ref = null; }
|
|
24
|
+
var children = props.children, isDisabled = props.isDisabled, isIndeterminate = props.isIndeterminate;
|
|
25
|
+
useEnsureSSRProvider();
|
|
26
|
+
var inputRef = React.useRef(null);
|
|
27
|
+
var rootRef = React.useRef(null);
|
|
28
|
+
var ariaProps = asAriaCheckboxProps(props);
|
|
29
|
+
var state = useToggleState(ariaProps);
|
|
30
|
+
var inputProps = useCheckbox$1(ariaProps, state, inputRef).inputProps;
|
|
31
|
+
var variants = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalVariantProps), false))), mergeVariantToggles({
|
|
32
|
+
def: config.isDisabledVariant,
|
|
33
|
+
active: isDisabled,
|
|
34
|
+
}, {
|
|
35
|
+
def: config.isCheckedVariant,
|
|
36
|
+
active: state.isSelected,
|
|
37
|
+
}, {
|
|
38
|
+
def: config.isIndeterminateVariant,
|
|
39
|
+
active: isIndeterminate,
|
|
40
|
+
}, {
|
|
41
|
+
def: config.noLabelVariant,
|
|
42
|
+
active: !children,
|
|
43
|
+
}));
|
|
44
|
+
var overrides = (_a = {},
|
|
45
|
+
_a[config.root] = {
|
|
46
|
+
as: "label",
|
|
47
|
+
props: mergeProps(getStyleProps(props), {
|
|
48
|
+
ref: rootRef,
|
|
49
|
+
}),
|
|
50
|
+
wrapChildren: function (children) { return (React.createElement(React.Fragment, null,
|
|
51
|
+
React.createElement(VisuallyHidden, null,
|
|
52
|
+
React.createElement("input", __assign({}, inputProps, { ref: inputRef }))),
|
|
53
|
+
children)); },
|
|
54
|
+
},
|
|
55
|
+
_a);
|
|
56
|
+
var args = __assign(__assign({}, pick.apply(void 0, __spreadArray([props], __read(plasmicClass.internalArgProps), false))), (config.labelSlot ? (_b = {}, _b[config.labelSlot] = children, _b) : {}));
|
|
57
|
+
var plumeState = React.useMemo(function () { return ({
|
|
58
|
+
setChecked: function (checked) { return state.setSelected(checked); },
|
|
59
|
+
}); }, [state]);
|
|
60
|
+
React.useImperativeHandle(ref, function () { return ({
|
|
61
|
+
getRoot: function () { return rootRef.current; },
|
|
62
|
+
focus: function () { var _a; return (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus(); },
|
|
63
|
+
blur: function () { var _a; return (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.blur(); },
|
|
64
|
+
setChecked: function (checked) { return plumeState.setChecked(checked); },
|
|
65
|
+
}); }, [rootRef, inputRef, plumeState]);
|
|
66
|
+
return {
|
|
67
|
+
plasmicProps: {
|
|
68
|
+
variants: variants,
|
|
69
|
+
overrides: overrides,
|
|
70
|
+
args: args,
|
|
71
|
+
},
|
|
72
|
+
state: plumeState,
|
|
73
|
+
};
|
|
74
74
|
}
|
|
75
75
|
|
|
76
76
|
export { useCheckbox };
|