@plasmicpkgs/react-aria 0.0.153 → 0.0.154
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/.tsbuildinfo +1 -1
- package/dist/react-aria.esm.js +276 -287
- package/dist/react-aria.esm.js.map +1 -1
- package/dist/react-aria.js +275 -286
- package/dist/react-aria.js.map +1 -1
- package/dist/registerListBox.d.ts +1 -1
- package/dist/variant-utils.d.ts +4 -3
- package/package.json +2 -2
- package/skinny/registerButton.cjs.js +27 -22
- package/skinny/registerButton.cjs.js.map +1 -1
- package/skinny/registerButton.esm.js +27 -22
- package/skinny/registerButton.esm.js.map +1 -1
- package/skinny/registerCheckbox.cjs.js +18 -16
- package/skinny/registerCheckbox.cjs.js.map +1 -1
- package/skinny/registerCheckbox.esm.js +18 -16
- package/skinny/registerCheckbox.esm.js.map +1 -1
- package/skinny/registerCheckboxGroup.cjs.js +12 -12
- package/skinny/registerCheckboxGroup.cjs.js.map +1 -1
- package/skinny/registerCheckboxGroup.esm.js +12 -12
- package/skinny/registerCheckboxGroup.esm.js.map +1 -1
- package/skinny/registerComboBox.cjs.js +11 -16
- package/skinny/registerComboBox.cjs.js.map +1 -1
- package/skinny/registerComboBox.esm.js +11 -16
- package/skinny/registerComboBox.esm.js.map +1 -1
- package/skinny/registerDialogTrigger.cjs.js +1 -1
- package/skinny/registerDialogTrigger.esm.js +1 -1
- package/skinny/registerInput.cjs.js +1 -1
- package/skinny/registerInput.esm.js +1 -1
- package/skinny/{registerListBox-7a50077e.cjs.js → registerListBox-28474381.cjs.js} +24 -32
- package/skinny/registerListBox-28474381.cjs.js.map +1 -0
- package/skinny/{registerListBox-14503b0a.esm.js → registerListBox-7197abae.esm.js} +26 -34
- package/skinny/registerListBox-7197abae.esm.js.map +1 -0
- package/skinny/registerListBox.cjs.js +4 -3
- package/skinny/registerListBox.cjs.js.map +1 -1
- package/skinny/registerListBox.d.ts +1 -1
- package/skinny/registerListBox.esm.js +4 -3
- package/skinny/registerListBox.esm.js.map +1 -1
- package/skinny/registerListBoxItem.cjs.js +20 -17
- package/skinny/registerListBoxItem.cjs.js.map +1 -1
- package/skinny/registerListBoxItem.esm.js +20 -17
- package/skinny/registerListBoxItem.esm.js.map +1 -1
- package/skinny/registerOverlayArrow.cjs.js +12 -12
- package/skinny/registerOverlayArrow.cjs.js.map +1 -1
- package/skinny/registerOverlayArrow.esm.js +12 -12
- package/skinny/registerOverlayArrow.esm.js.map +1 -1
- package/skinny/registerRadio.cjs.js +17 -15
- package/skinny/registerRadio.cjs.js.map +1 -1
- package/skinny/registerRadio.esm.js +17 -15
- package/skinny/registerRadio.esm.js.map +1 -1
- package/skinny/registerRadioGroup.cjs.js +12 -10
- package/skinny/registerRadioGroup.cjs.js.map +1 -1
- package/skinny/registerRadioGroup.esm.js +12 -10
- package/skinny/registerRadioGroup.esm.js.map +1 -1
- package/skinny/registerSection.cjs.js +3 -2
- package/skinny/registerSection.cjs.js.map +1 -1
- package/skinny/registerSection.esm.js +3 -2
- package/skinny/registerSection.esm.js.map +1 -1
- package/skinny/registerSelect.cjs.js +19 -25
- package/skinny/registerSelect.cjs.js.map +1 -1
- package/skinny/registerSelect.esm.js +19 -25
- package/skinny/registerSelect.esm.js.map +1 -1
- package/skinny/registerSlider.cjs.js +10 -8
- package/skinny/registerSlider.cjs.js.map +1 -1
- package/skinny/registerSlider.esm.js +10 -8
- package/skinny/registerSlider.esm.js.map +1 -1
- package/skinny/registerSliderOutput.cjs.js +10 -10
- package/skinny/registerSliderOutput.cjs.js.map +1 -1
- package/skinny/registerSliderOutput.esm.js +10 -10
- package/skinny/registerSliderOutput.esm.js.map +1 -1
- package/skinny/registerSliderThumb.cjs.js +9 -15
- package/skinny/registerSliderThumb.cjs.js.map +1 -1
- package/skinny/registerSliderThumb.esm.js +9 -15
- package/skinny/registerSliderThumb.esm.js.map +1 -1
- package/skinny/registerSliderTrack.cjs.js +20 -20
- package/skinny/registerSliderTrack.cjs.js.map +1 -1
- package/skinny/registerSliderTrack.esm.js +20 -20
- package/skinny/registerSliderTrack.esm.js.map +1 -1
- package/skinny/registerSwitch.cjs.js +16 -14
- package/skinny/registerSwitch.cjs.js.map +1 -1
- package/skinny/registerSwitch.esm.js +16 -14
- package/skinny/registerSwitch.esm.js.map +1 -1
- package/skinny/registerTextArea.cjs.js +1 -1
- package/skinny/registerTextArea.esm.js +1 -1
- package/skinny/registerTextField.cjs.js +11 -9
- package/skinny/registerTextField.cjs.js.map +1 -1
- package/skinny/registerTextField.esm.js +11 -9
- package/skinny/registerTextField.esm.js.map +1 -1
- package/skinny/{variant-utils-0ad70db8.cjs.js → variant-utils-1c84aebb.cjs.js} +5 -9
- package/skinny/variant-utils-1c84aebb.cjs.js.map +1 -0
- package/skinny/{variant-utils-4405ebb0.esm.js → variant-utils-5f356d53.esm.js} +5 -10
- package/skinny/variant-utils-5f356d53.esm.js.map +1 -0
- package/skinny/variant-utils.d.ts +4 -3
- package/skinny/registerListBox-14503b0a.esm.js.map +0 -1
- package/skinny/registerListBox-7a50077e.cjs.js.map +0 -1
- package/skinny/variant-utils-0ad70db8.cjs.js.map +0 -1
- package/skinny/variant-utils-4405ebb0.esm.js.map +0 -1
|
@@ -5,7 +5,7 @@ import { WithVariants } from "./variant-utils";
|
|
|
5
5
|
export interface BaseListBoxControlContextData extends BaseControlContextDataForLists {
|
|
6
6
|
isStandalone: boolean;
|
|
7
7
|
}
|
|
8
|
-
declare const LISTBOX_VARIANTS:
|
|
8
|
+
declare const LISTBOX_VARIANTS: "focused"[];
|
|
9
9
|
export interface BaseListBoxProps extends Omit<React.ComponentProps<typeof ListBox>, "selectedKeys" | "defaultSelectedKeys" | "className">, HasControlContextData<BaseListBoxControlContextData>, WithVariants<typeof LISTBOX_VARIANTS> {
|
|
10
10
|
children?: React.ReactNode;
|
|
11
11
|
selectedKeys?: string | string[] | undefined;
|
package/dist/variant-utils.d.ts
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { CodeComponentMeta } from "@plasmicapp/host";
|
|
2
|
-
import React from "react";
|
|
3
2
|
declare const ARIA_COMPONENTS_VARIANTS: {
|
|
4
3
|
hovered: {
|
|
5
4
|
cssSelector: string;
|
|
@@ -62,9 +61,11 @@ export type UpdateVariant<T extends AriaVariant[]> = ((changes: Partial<Record<A
|
|
|
62
61
|
export interface WithVariants<T extends AriaVariant[]> {
|
|
63
62
|
plasmicUpdateVariant?: UpdateVariant<T>;
|
|
64
63
|
}
|
|
65
|
-
|
|
64
|
+
export declare function VariantUpdater<T extends AriaVariant[]>({ changes, updateVariant, }: {
|
|
65
|
+
changes: Partial<Record<ArrayElement<T>, boolean>>;
|
|
66
|
+
updateVariant?: UpdateVariant<T>;
|
|
67
|
+
}): null;
|
|
66
68
|
export declare function pickAriaComponentVariants<T extends AriaVariant[]>(keys: T): {
|
|
67
69
|
variants: Record<ArrayElement<T>, VariantMeta>;
|
|
68
|
-
withObservedValues: WithObservedValues<T>;
|
|
69
70
|
};
|
|
70
71
|
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@plasmicpkgs/react-aria",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.154",
|
|
4
4
|
"description": "Plasmic registration calls for react-aria based components",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -74,5 +74,5 @@
|
|
|
74
74
|
"publishConfig": {
|
|
75
75
|
"access": "public"
|
|
76
76
|
},
|
|
77
|
-
"gitHead": "
|
|
77
|
+
"gitHead": "0ab826e4da59d14b0f8754c60c0a1910bd04834e"
|
|
78
78
|
}
|
|
@@ -5,7 +5,7 @@ var React = require('react');
|
|
|
5
5
|
var reactAria = require('react-aria');
|
|
6
6
|
var reactAriaComponents = require('react-aria-components');
|
|
7
7
|
var common = require('./common-7f948fa5.cjs.js');
|
|
8
|
-
var variantUtils = require('./variant-utils-
|
|
8
|
+
var variantUtils = require('./variant-utils-1c84aebb.cjs.js');
|
|
9
9
|
require('@plasmicapp/host/registerComponent');
|
|
10
10
|
|
|
11
11
|
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
@@ -50,7 +50,7 @@ const BUTTON_VARIANTS = [
|
|
|
50
50
|
"focusVisible",
|
|
51
51
|
"disabled"
|
|
52
52
|
];
|
|
53
|
-
const { variants
|
|
53
|
+
const { variants } = variantUtils.pickAriaComponentVariants(BUTTON_VARIANTS);
|
|
54
54
|
const BaseButton = React__default.default.forwardRef(function BaseButtonInner(props, ref) {
|
|
55
55
|
const { href } = props;
|
|
56
56
|
if (href) {
|
|
@@ -69,17 +69,19 @@ const BaseButton = React__default.default.forwardRef(function BaseButtonInner(pr
|
|
|
69
69
|
style: common.COMMON_STYLES,
|
|
70
70
|
ref
|
|
71
71
|
});
|
|
72
|
-
return /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Button, __spreadValues({}, buttonProps), ({ isHovered, isPressed, isFocused, isFocusVisible, isDisabled }) =>
|
|
73
|
-
|
|
72
|
+
return /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Button, __spreadValues({}, buttonProps), ({ isHovered, isPressed, isFocused, isFocusVisible, isDisabled }) => /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, /* @__PURE__ */ React__default.default.createElement(
|
|
73
|
+
variantUtils.VariantUpdater,
|
|
74
74
|
{
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
75
|
+
changes: {
|
|
76
|
+
hovered: isHovered,
|
|
77
|
+
pressed: isPressed,
|
|
78
|
+
focused: isFocused,
|
|
79
|
+
focusVisible: isFocusVisible,
|
|
80
|
+
disabled: isDisabled
|
|
81
|
+
},
|
|
82
|
+
updateVariant: plasmicUpdateVariant
|
|
83
|
+
}
|
|
84
|
+
), children));
|
|
83
85
|
}
|
|
84
86
|
});
|
|
85
87
|
function LinkButton({
|
|
@@ -108,17 +110,20 @@ function LinkButton({
|
|
|
108
110
|
"data-focus-visible": isFocusVisible || void 0,
|
|
109
111
|
"data-disabled": props.isDisabled || void 0
|
|
110
112
|
}),
|
|
111
|
-
|
|
112
|
-
|
|
113
|
+
/* @__PURE__ */ React__default.default.createElement(
|
|
114
|
+
variantUtils.VariantUpdater,
|
|
113
115
|
{
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
116
|
+
changes: {
|
|
117
|
+
hovered: isHovered,
|
|
118
|
+
pressed: isPressed,
|
|
119
|
+
focused: isFocused,
|
|
120
|
+
focusVisible: isFocusVisible,
|
|
121
|
+
disabled: !!rest.isDisabled
|
|
122
|
+
},
|
|
123
|
+
updateVariant: plasmicUpdateVariant
|
|
124
|
+
}
|
|
125
|
+
),
|
|
126
|
+
children
|
|
122
127
|
);
|
|
123
128
|
}
|
|
124
129
|
const BUTTON_COMPONENT_NAME = common.makeComponentName("button");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"registerButton.cjs.js","sources":["../src/registerButton.tsx"],"sourcesContent":["import { usePlasmicLink } from \"@plasmicapp/host\";\nimport React from \"react\";\nimport { mergeProps, useFocusRing, useHover, useLink } from \"react-aria\";\nimport type { ButtonProps, LinkProps } from \"react-aria-components\";\nimport { Button } from \"react-aria-components\";\nimport {\n COMMON_STYLES,\n createAriaLabelProp,\n createAutoFocusProp,\n createDisabledProp,\n createIdProp,\n} from \"./common\";\nimport {\n CodeComponentMetaOverrides,\n makeComponentName,\n Registerable,\n registerComponentHelper,\n} from \"./utils\";\nimport { pickAriaComponentVariants, WithVariants } from \"./variant-utils\";\n\nconst BUTTON_VARIANTS = [\n \"hovered\" as const,\n \"pressed\" as const,\n \"focused\" as const,\n \"focusVisible\" as const,\n \"disabled\" as const,\n];\n\nconst { variants, withObservedValues } =\n pickAriaComponentVariants(BUTTON_VARIANTS);\n\ntype ButtonCommonProps = { children: React.ReactNode } & Omit<\n ButtonProps,\n \"className\" | \"children\"\n> &\n Omit<LinkProps, \"className\" | \"children\">;\ntype LinkSpecificProps = Pick<LinkProps, \"href\" | \"target\">;\ntype ButtonSpecificProps = {\n resetsForm?: boolean;\n submitsForm?: boolean;\n};\n\nexport interface BaseButtonProps\n extends ButtonCommonProps,\n LinkSpecificProps,\n ButtonSpecificProps,\n WithVariants<typeof BUTTON_VARIANTS> {\n children: React.ReactNode;\n className?: string;\n}\n\nexport const BaseButton = React.forwardRef(function BaseButtonInner(\n props: BaseButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>\n) {\n const { href } = props;\n\n if (href) {\n return (\n <LinkButton\n props={props}\n ref={ref as React.RefObject<HTMLAnchorElement>}\n />\n );\n } else {\n const { submitsForm, resetsForm, children, plasmicUpdateVariant, ...rest } =\n props;\n const type = submitsForm ? \"submit\" : resetsForm ? \"reset\" : \"button\";\n\n const buttonProps = mergeProps(rest, {\n type,\n style: COMMON_STYLES,\n ref: ref as React.Ref<HTMLButtonElement>,\n });\n\n return (\n <Button {...buttonProps}>\n {({ isHovered, isPressed, isFocused, isFocusVisible, isDisabled }) =>\n withObservedValues(\n children,\n {\n hovered: isHovered,\n pressed: isPressed,\n focused: isFocused,\n focusVisible: isFocusVisible,\n disabled: isDisabled,\n },\n plasmicUpdateVariant\n )\n }\n </Button>\n );\n }\n});\n\nfunction LinkButton({\n props,\n ref,\n}: {\n props: BaseButtonProps;\n ref: React.RefObject<HTMLAnchorElement>;\n}) {\n const { href, children, plasmicUpdateVariant, ...rest } = props;\n const PlasmicLink = usePlasmicLink();\n const { linkProps, isPressed } = useLink(props, ref);\n const { hoverProps, isHovered } = useHover(props);\n const { focusProps, isFocused, isFocusVisible } = useFocusRing();\n\n const combinedLinkProps = mergeProps(linkProps, hoverProps, focusProps, {\n href,\n className: props.className,\n style: COMMON_STYLES,\n id: props.id,\n \"aria-label\": props[\"aria-label\"],\n ref,\n });\n\n return (\n <PlasmicLink\n {...combinedLinkProps}\n data-focused={isFocused || undefined}\n data-hovered={isHovered || undefined}\n data-pressed={isPressed || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-disabled={props.isDisabled || undefined}\n >\n {withObservedValues(\n children,\n {\n hovered: isHovered,\n pressed: isPressed,\n focused: isFocused,\n focusVisible: isFocusVisible,\n disabled: !!rest.isDisabled,\n },\n plasmicUpdateVariant\n )}\n </PlasmicLink>\n );\n}\n\nexport const BUTTON_COMPONENT_NAME = makeComponentName(\"button\");\n\nexport function registerButton(\n loader?: Registerable,\n overrides?: CodeComponentMetaOverrides<typeof BaseButton>\n) {\n registerComponentHelper(\n loader,\n BaseButton,\n {\n name: BUTTON_COMPONENT_NAME,\n displayName: \"Aria Button\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerButton\",\n importName: \"BaseButton\",\n variants,\n defaultStyles: {\n // Ensure consistent design across rendered elements (button, anchor tag).\n backgroundColor: \"#EFEFEF\",\n borderColor: \"black\",\n borderStyle: \"solid\",\n borderWidth: \"1px\",\n color: \"#000000\",\n cursor: \"pointer\",\n fontFamily: \"Arial\",\n fontSize: \"1rem\",\n lineHeight: \"1.2\",\n padding: \"2px 10px\",\n textDecorationLine: \"none\",\n },\n props: {\n id: createIdProp(\"Button\"),\n autoFocus: createAutoFocusProp(\"Button\"),\n isDisabled: createDisabledProp(\"Button\"),\n \"aria-label\": createAriaLabelProp(\"Button\"),\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: {\n type: \"text\",\n value: \"Button\",\n },\n },\n href: {\n type: \"href\",\n description:\n \"The URL this button navigates to. If present, this button is an <a> element.\",\n },\n target: {\n type: \"choice\",\n options: [\"_blank\", \"_self\", \"_parent\", \"_top\"],\n description:\n \"Same as target attribute of <a> element. Only applies when the href prop is present.\",\n hidden: (props) => !props.href,\n defaultValueHint: \"_self\",\n },\n submitsForm: {\n type: \"boolean\",\n displayName: \"Submits form?\",\n defaultValueHint: false,\n hidden: (props) => Boolean(props.resetsForm) || Boolean(props.href),\n description:\n \"Whether clicking this button should submit the enclosing form.\",\n advanced: true,\n },\n resetsForm: {\n type: \"boolean\",\n displayName: \"Resets form?\",\n defaultValueHint: false,\n hidden: (props) => Boolean(props.submitsForm) || Boolean(props.href),\n description:\n \"Whether clicking this button should reset the enclosing form.\",\n advanced: true,\n },\n onPress: {\n type: \"eventHandler\",\n argTypes: [{ name: \"event\", type: \"object\" }],\n },\n onFocus: {\n type: \"eventHandler\",\n argTypes: [{ name: \"event\", type: \"object\" }],\n },\n },\n trapsFocus: true,\n },\n overrides\n );\n}\n"],"names":["pickAriaComponentVariants","React","mergeProps","COMMON_STYLES","Button","usePlasmicLink","useLink","useHover","useFocusRing","makeComponentName","registerComponentHelper","createIdProp","createAutoFocusProp","createDisabledProp","createAriaLabelProp"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"registerButton.cjs.js","sources":["../src/registerButton.tsx"],"sourcesContent":["import { usePlasmicLink } from \"@plasmicapp/host\";\nimport React from \"react\";\nimport { mergeProps, useFocusRing, useHover, useLink } from \"react-aria\";\nimport type { ButtonProps, LinkProps } from \"react-aria-components\";\nimport { Button } from \"react-aria-components\";\nimport {\n COMMON_STYLES,\n createAriaLabelProp,\n createAutoFocusProp,\n createDisabledProp,\n createIdProp,\n} from \"./common\";\nimport {\n CodeComponentMetaOverrides,\n Registerable,\n makeComponentName,\n registerComponentHelper,\n} from \"./utils\";\nimport {\n VariantUpdater,\n WithVariants,\n pickAriaComponentVariants,\n} from \"./variant-utils\";\n\nconst BUTTON_VARIANTS = [\n \"hovered\" as const,\n \"pressed\" as const,\n \"focused\" as const,\n \"focusVisible\" as const,\n \"disabled\" as const,\n];\n\nconst { variants } = pickAriaComponentVariants(BUTTON_VARIANTS);\n\ntype ButtonCommonProps = { children: React.ReactNode } & Omit<\n ButtonProps,\n \"className\" | \"children\"\n> &\n Omit<LinkProps, \"className\" | \"children\">;\ntype LinkSpecificProps = Pick<LinkProps, \"href\" | \"target\">;\ntype ButtonSpecificProps = {\n resetsForm?: boolean;\n submitsForm?: boolean;\n};\n\nexport interface BaseButtonProps\n extends ButtonCommonProps,\n LinkSpecificProps,\n ButtonSpecificProps,\n WithVariants<typeof BUTTON_VARIANTS> {\n children: React.ReactNode;\n className?: string;\n}\n\nexport const BaseButton = React.forwardRef(function BaseButtonInner(\n props: BaseButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>\n) {\n const { href } = props;\n\n if (href) {\n return (\n <LinkButton\n props={props}\n ref={ref as React.RefObject<HTMLAnchorElement>}\n />\n );\n } else {\n const { submitsForm, resetsForm, children, plasmicUpdateVariant, ...rest } =\n props;\n const type = submitsForm ? \"submit\" : resetsForm ? \"reset\" : \"button\";\n\n const buttonProps = mergeProps(rest, {\n type,\n style: COMMON_STYLES,\n ref: ref as React.Ref<HTMLButtonElement>,\n });\n\n return (\n <Button {...buttonProps}>\n {({ isHovered, isPressed, isFocused, isFocusVisible, isDisabled }) => (\n <>\n <VariantUpdater\n changes={{\n hovered: isHovered,\n pressed: isPressed,\n focused: isFocused,\n focusVisible: isFocusVisible,\n disabled: isDisabled,\n }}\n updateVariant={plasmicUpdateVariant}\n />\n {children}\n </>\n )}\n </Button>\n );\n }\n});\n\nfunction LinkButton({\n props,\n ref,\n}: {\n props: BaseButtonProps;\n ref: React.RefObject<HTMLAnchorElement>;\n}) {\n const { href, children, plasmicUpdateVariant, ...rest } = props;\n const PlasmicLink = usePlasmicLink();\n const { linkProps, isPressed } = useLink(props, ref);\n const { hoverProps, isHovered } = useHover(props);\n const { focusProps, isFocused, isFocusVisible } = useFocusRing();\n\n const combinedLinkProps = mergeProps(linkProps, hoverProps, focusProps, {\n href,\n className: props.className,\n style: COMMON_STYLES,\n id: props.id,\n \"aria-label\": props[\"aria-label\"],\n ref,\n });\n\n return (\n <PlasmicLink\n {...combinedLinkProps}\n data-focused={isFocused || undefined}\n data-hovered={isHovered || undefined}\n data-pressed={isPressed || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-disabled={props.isDisabled || undefined}\n >\n <VariantUpdater\n changes={{\n hovered: isHovered,\n pressed: isPressed,\n focused: isFocused,\n focusVisible: isFocusVisible,\n disabled: !!rest.isDisabled,\n }}\n updateVariant={plasmicUpdateVariant}\n />\n {children}\n </PlasmicLink>\n );\n}\n\nexport const BUTTON_COMPONENT_NAME = makeComponentName(\"button\");\n\nexport function registerButton(\n loader?: Registerable,\n overrides?: CodeComponentMetaOverrides<typeof BaseButton>\n) {\n registerComponentHelper(\n loader,\n BaseButton,\n {\n name: BUTTON_COMPONENT_NAME,\n displayName: \"Aria Button\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerButton\",\n importName: \"BaseButton\",\n variants,\n defaultStyles: {\n // Ensure consistent design across rendered elements (button, anchor tag).\n backgroundColor: \"#EFEFEF\",\n borderColor: \"black\",\n borderStyle: \"solid\",\n borderWidth: \"1px\",\n color: \"#000000\",\n cursor: \"pointer\",\n fontFamily: \"Arial\",\n fontSize: \"1rem\",\n lineHeight: \"1.2\",\n padding: \"2px 10px\",\n textDecorationLine: \"none\",\n },\n props: {\n id: createIdProp(\"Button\"),\n autoFocus: createAutoFocusProp(\"Button\"),\n isDisabled: createDisabledProp(\"Button\"),\n \"aria-label\": createAriaLabelProp(\"Button\"),\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: {\n type: \"text\",\n value: \"Button\",\n },\n },\n href: {\n type: \"href\",\n description:\n \"The URL this button navigates to. If present, this button is an <a> element.\",\n },\n target: {\n type: \"choice\",\n options: [\"_blank\", \"_self\", \"_parent\", \"_top\"],\n description:\n \"Same as target attribute of <a> element. Only applies when the href prop is present.\",\n hidden: (props) => !props.href,\n defaultValueHint: \"_self\",\n },\n submitsForm: {\n type: \"boolean\",\n displayName: \"Submits form?\",\n defaultValueHint: false,\n hidden: (props) => Boolean(props.resetsForm) || Boolean(props.href),\n description:\n \"Whether clicking this button should submit the enclosing form.\",\n advanced: true,\n },\n resetsForm: {\n type: \"boolean\",\n displayName: \"Resets form?\",\n defaultValueHint: false,\n hidden: (props) => Boolean(props.submitsForm) || Boolean(props.href),\n description:\n \"Whether clicking this button should reset the enclosing form.\",\n advanced: true,\n },\n onPress: {\n type: \"eventHandler\",\n argTypes: [{ name: \"event\", type: \"object\" }],\n },\n onFocus: {\n type: \"eventHandler\",\n argTypes: [{ name: \"event\", type: \"object\" }],\n },\n },\n trapsFocus: true,\n },\n overrides\n );\n}\n"],"names":["pickAriaComponentVariants","React","mergeProps","COMMON_STYLES","Button","VariantUpdater","usePlasmicLink","useLink","useHover","useFocusRing","makeComponentName","registerComponentHelper","createIdProp","createAutoFocusProp","createDisabledProp","createAriaLabelProp"],"mappings":"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"}
|
|
@@ -3,7 +3,7 @@ import React from 'react';
|
|
|
3
3
|
import { mergeProps, useLink, useHover, useFocusRing } from 'react-aria';
|
|
4
4
|
import { Button } from 'react-aria-components';
|
|
5
5
|
import { C as COMMON_STYLES, m as makeComponentName, r as registerComponentHelper, c as createIdProp, g as createAutoFocusProp, b as createDisabledProp, f as createAriaLabelProp } from './common-81f08e86.esm.js';
|
|
6
|
-
import { p as pickAriaComponentVariants } from './variant-utils-
|
|
6
|
+
import { p as pickAriaComponentVariants, V as VariantUpdater } from './variant-utils-5f356d53.esm.js';
|
|
7
7
|
import '@plasmicapp/host/registerComponent';
|
|
8
8
|
|
|
9
9
|
var __defProp = Object.defineProperty;
|
|
@@ -44,7 +44,7 @@ const BUTTON_VARIANTS = [
|
|
|
44
44
|
"focusVisible",
|
|
45
45
|
"disabled"
|
|
46
46
|
];
|
|
47
|
-
const { variants
|
|
47
|
+
const { variants } = pickAriaComponentVariants(BUTTON_VARIANTS);
|
|
48
48
|
const BaseButton = React.forwardRef(function BaseButtonInner(props, ref) {
|
|
49
49
|
const { href } = props;
|
|
50
50
|
if (href) {
|
|
@@ -63,17 +63,19 @@ const BaseButton = React.forwardRef(function BaseButtonInner(props, ref) {
|
|
|
63
63
|
style: COMMON_STYLES,
|
|
64
64
|
ref
|
|
65
65
|
});
|
|
66
|
-
return /* @__PURE__ */ React.createElement(Button, __spreadValues({}, buttonProps), ({ isHovered, isPressed, isFocused, isFocusVisible, isDisabled }) =>
|
|
67
|
-
|
|
66
|
+
return /* @__PURE__ */ React.createElement(Button, __spreadValues({}, buttonProps), ({ isHovered, isPressed, isFocused, isFocusVisible, isDisabled }) => /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
|
|
67
|
+
VariantUpdater,
|
|
68
68
|
{
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
69
|
+
changes: {
|
|
70
|
+
hovered: isHovered,
|
|
71
|
+
pressed: isPressed,
|
|
72
|
+
focused: isFocused,
|
|
73
|
+
focusVisible: isFocusVisible,
|
|
74
|
+
disabled: isDisabled
|
|
75
|
+
},
|
|
76
|
+
updateVariant: plasmicUpdateVariant
|
|
77
|
+
}
|
|
78
|
+
), children));
|
|
77
79
|
}
|
|
78
80
|
});
|
|
79
81
|
function LinkButton({
|
|
@@ -102,17 +104,20 @@ function LinkButton({
|
|
|
102
104
|
"data-focus-visible": isFocusVisible || void 0,
|
|
103
105
|
"data-disabled": props.isDisabled || void 0
|
|
104
106
|
}),
|
|
105
|
-
|
|
106
|
-
|
|
107
|
+
/* @__PURE__ */ React.createElement(
|
|
108
|
+
VariantUpdater,
|
|
107
109
|
{
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
110
|
+
changes: {
|
|
111
|
+
hovered: isHovered,
|
|
112
|
+
pressed: isPressed,
|
|
113
|
+
focused: isFocused,
|
|
114
|
+
focusVisible: isFocusVisible,
|
|
115
|
+
disabled: !!rest.isDisabled
|
|
116
|
+
},
|
|
117
|
+
updateVariant: plasmicUpdateVariant
|
|
118
|
+
}
|
|
119
|
+
),
|
|
120
|
+
children
|
|
116
121
|
);
|
|
117
122
|
}
|
|
118
123
|
const BUTTON_COMPONENT_NAME = makeComponentName("button");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"registerButton.esm.js","sources":["../src/registerButton.tsx"],"sourcesContent":["import { usePlasmicLink } from \"@plasmicapp/host\";\nimport React from \"react\";\nimport { mergeProps, useFocusRing, useHover, useLink } from \"react-aria\";\nimport type { ButtonProps, LinkProps } from \"react-aria-components\";\nimport { Button } from \"react-aria-components\";\nimport {\n COMMON_STYLES,\n createAriaLabelProp,\n createAutoFocusProp,\n createDisabledProp,\n createIdProp,\n} from \"./common\";\nimport {\n CodeComponentMetaOverrides,\n makeComponentName,\n Registerable,\n registerComponentHelper,\n} from \"./utils\";\nimport { pickAriaComponentVariants, WithVariants } from \"./variant-utils\";\n\nconst BUTTON_VARIANTS = [\n \"hovered\" as const,\n \"pressed\" as const,\n \"focused\" as const,\n \"focusVisible\" as const,\n \"disabled\" as const,\n];\n\nconst { variants, withObservedValues } =\n pickAriaComponentVariants(BUTTON_VARIANTS);\n\ntype ButtonCommonProps = { children: React.ReactNode } & Omit<\n ButtonProps,\n \"className\" | \"children\"\n> &\n Omit<LinkProps, \"className\" | \"children\">;\ntype LinkSpecificProps = Pick<LinkProps, \"href\" | \"target\">;\ntype ButtonSpecificProps = {\n resetsForm?: boolean;\n submitsForm?: boolean;\n};\n\nexport interface BaseButtonProps\n extends ButtonCommonProps,\n LinkSpecificProps,\n ButtonSpecificProps,\n WithVariants<typeof BUTTON_VARIANTS> {\n children: React.ReactNode;\n className?: string;\n}\n\nexport const BaseButton = React.forwardRef(function BaseButtonInner(\n props: BaseButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>\n) {\n const { href } = props;\n\n if (href) {\n return (\n <LinkButton\n props={props}\n ref={ref as React.RefObject<HTMLAnchorElement>}\n />\n );\n } else {\n const { submitsForm, resetsForm, children, plasmicUpdateVariant, ...rest } =\n props;\n const type = submitsForm ? \"submit\" : resetsForm ? \"reset\" : \"button\";\n\n const buttonProps = mergeProps(rest, {\n type,\n style: COMMON_STYLES,\n ref: ref as React.Ref<HTMLButtonElement>,\n });\n\n return (\n <Button {...buttonProps}>\n {({ isHovered, isPressed, isFocused, isFocusVisible, isDisabled }) =>\n withObservedValues(\n children,\n {\n hovered: isHovered,\n pressed: isPressed,\n focused: isFocused,\n focusVisible: isFocusVisible,\n disabled: isDisabled,\n },\n plasmicUpdateVariant\n )\n }\n </Button>\n );\n }\n});\n\nfunction LinkButton({\n props,\n ref,\n}: {\n props: BaseButtonProps;\n ref: React.RefObject<HTMLAnchorElement>;\n}) {\n const { href, children, plasmicUpdateVariant, ...rest } = props;\n const PlasmicLink = usePlasmicLink();\n const { linkProps, isPressed } = useLink(props, ref);\n const { hoverProps, isHovered } = useHover(props);\n const { focusProps, isFocused, isFocusVisible } = useFocusRing();\n\n const combinedLinkProps = mergeProps(linkProps, hoverProps, focusProps, {\n href,\n className: props.className,\n style: COMMON_STYLES,\n id: props.id,\n \"aria-label\": props[\"aria-label\"],\n ref,\n });\n\n return (\n <PlasmicLink\n {...combinedLinkProps}\n data-focused={isFocused || undefined}\n data-hovered={isHovered || undefined}\n data-pressed={isPressed || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-disabled={props.isDisabled || undefined}\n >\n {withObservedValues(\n children,\n {\n hovered: isHovered,\n pressed: isPressed,\n focused: isFocused,\n focusVisible: isFocusVisible,\n disabled: !!rest.isDisabled,\n },\n plasmicUpdateVariant\n )}\n </PlasmicLink>\n );\n}\n\nexport const BUTTON_COMPONENT_NAME = makeComponentName(\"button\");\n\nexport function registerButton(\n loader?: Registerable,\n overrides?: CodeComponentMetaOverrides<typeof BaseButton>\n) {\n registerComponentHelper(\n loader,\n BaseButton,\n {\n name: BUTTON_COMPONENT_NAME,\n displayName: \"Aria Button\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerButton\",\n importName: \"BaseButton\",\n variants,\n defaultStyles: {\n // Ensure consistent design across rendered elements (button, anchor tag).\n backgroundColor: \"#EFEFEF\",\n borderColor: \"black\",\n borderStyle: \"solid\",\n borderWidth: \"1px\",\n color: \"#000000\",\n cursor: \"pointer\",\n fontFamily: \"Arial\",\n fontSize: \"1rem\",\n lineHeight: \"1.2\",\n padding: \"2px 10px\",\n textDecorationLine: \"none\",\n },\n props: {\n id: createIdProp(\"Button\"),\n autoFocus: createAutoFocusProp(\"Button\"),\n isDisabled: createDisabledProp(\"Button\"),\n \"aria-label\": createAriaLabelProp(\"Button\"),\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: {\n type: \"text\",\n value: \"Button\",\n },\n },\n href: {\n type: \"href\",\n description:\n \"The URL this button navigates to. If present, this button is an <a> element.\",\n },\n target: {\n type: \"choice\",\n options: [\"_blank\", \"_self\", \"_parent\", \"_top\"],\n description:\n \"Same as target attribute of <a> element. Only applies when the href prop is present.\",\n hidden: (props) => !props.href,\n defaultValueHint: \"_self\",\n },\n submitsForm: {\n type: \"boolean\",\n displayName: \"Submits form?\",\n defaultValueHint: false,\n hidden: (props) => Boolean(props.resetsForm) || Boolean(props.href),\n description:\n \"Whether clicking this button should submit the enclosing form.\",\n advanced: true,\n },\n resetsForm: {\n type: \"boolean\",\n displayName: \"Resets form?\",\n defaultValueHint: false,\n hidden: (props) => Boolean(props.submitsForm) || Boolean(props.href),\n description:\n \"Whether clicking this button should reset the enclosing form.\",\n advanced: true,\n },\n onPress: {\n type: \"eventHandler\",\n argTypes: [{ name: \"event\", type: \"object\" }],\n },\n onFocus: {\n type: \"eventHandler\",\n argTypes: [{ name: \"event\", type: \"object\" }],\n },\n },\n trapsFocus: true,\n },\n overrides\n );\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"registerButton.esm.js","sources":["../src/registerButton.tsx"],"sourcesContent":["import { usePlasmicLink } from \"@plasmicapp/host\";\nimport React from \"react\";\nimport { mergeProps, useFocusRing, useHover, useLink } from \"react-aria\";\nimport type { ButtonProps, LinkProps } from \"react-aria-components\";\nimport { Button } from \"react-aria-components\";\nimport {\n COMMON_STYLES,\n createAriaLabelProp,\n createAutoFocusProp,\n createDisabledProp,\n createIdProp,\n} from \"./common\";\nimport {\n CodeComponentMetaOverrides,\n Registerable,\n makeComponentName,\n registerComponentHelper,\n} from \"./utils\";\nimport {\n VariantUpdater,\n WithVariants,\n pickAriaComponentVariants,\n} from \"./variant-utils\";\n\nconst BUTTON_VARIANTS = [\n \"hovered\" as const,\n \"pressed\" as const,\n \"focused\" as const,\n \"focusVisible\" as const,\n \"disabled\" as const,\n];\n\nconst { variants } = pickAriaComponentVariants(BUTTON_VARIANTS);\n\ntype ButtonCommonProps = { children: React.ReactNode } & Omit<\n ButtonProps,\n \"className\" | \"children\"\n> &\n Omit<LinkProps, \"className\" | \"children\">;\ntype LinkSpecificProps = Pick<LinkProps, \"href\" | \"target\">;\ntype ButtonSpecificProps = {\n resetsForm?: boolean;\n submitsForm?: boolean;\n};\n\nexport interface BaseButtonProps\n extends ButtonCommonProps,\n LinkSpecificProps,\n ButtonSpecificProps,\n WithVariants<typeof BUTTON_VARIANTS> {\n children: React.ReactNode;\n className?: string;\n}\n\nexport const BaseButton = React.forwardRef(function BaseButtonInner(\n props: BaseButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>\n) {\n const { href } = props;\n\n if (href) {\n return (\n <LinkButton\n props={props}\n ref={ref as React.RefObject<HTMLAnchorElement>}\n />\n );\n } else {\n const { submitsForm, resetsForm, children, plasmicUpdateVariant, ...rest } =\n props;\n const type = submitsForm ? \"submit\" : resetsForm ? \"reset\" : \"button\";\n\n const buttonProps = mergeProps(rest, {\n type,\n style: COMMON_STYLES,\n ref: ref as React.Ref<HTMLButtonElement>,\n });\n\n return (\n <Button {...buttonProps}>\n {({ isHovered, isPressed, isFocused, isFocusVisible, isDisabled }) => (\n <>\n <VariantUpdater\n changes={{\n hovered: isHovered,\n pressed: isPressed,\n focused: isFocused,\n focusVisible: isFocusVisible,\n disabled: isDisabled,\n }}\n updateVariant={plasmicUpdateVariant}\n />\n {children}\n </>\n )}\n </Button>\n );\n }\n});\n\nfunction LinkButton({\n props,\n ref,\n}: {\n props: BaseButtonProps;\n ref: React.RefObject<HTMLAnchorElement>;\n}) {\n const { href, children, plasmicUpdateVariant, ...rest } = props;\n const PlasmicLink = usePlasmicLink();\n const { linkProps, isPressed } = useLink(props, ref);\n const { hoverProps, isHovered } = useHover(props);\n const { focusProps, isFocused, isFocusVisible } = useFocusRing();\n\n const combinedLinkProps = mergeProps(linkProps, hoverProps, focusProps, {\n href,\n className: props.className,\n style: COMMON_STYLES,\n id: props.id,\n \"aria-label\": props[\"aria-label\"],\n ref,\n });\n\n return (\n <PlasmicLink\n {...combinedLinkProps}\n data-focused={isFocused || undefined}\n data-hovered={isHovered || undefined}\n data-pressed={isPressed || undefined}\n data-focus-visible={isFocusVisible || undefined}\n data-disabled={props.isDisabled || undefined}\n >\n <VariantUpdater\n changes={{\n hovered: isHovered,\n pressed: isPressed,\n focused: isFocused,\n focusVisible: isFocusVisible,\n disabled: !!rest.isDisabled,\n }}\n updateVariant={plasmicUpdateVariant}\n />\n {children}\n </PlasmicLink>\n );\n}\n\nexport const BUTTON_COMPONENT_NAME = makeComponentName(\"button\");\n\nexport function registerButton(\n loader?: Registerable,\n overrides?: CodeComponentMetaOverrides<typeof BaseButton>\n) {\n registerComponentHelper(\n loader,\n BaseButton,\n {\n name: BUTTON_COMPONENT_NAME,\n displayName: \"Aria Button\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerButton\",\n importName: \"BaseButton\",\n variants,\n defaultStyles: {\n // Ensure consistent design across rendered elements (button, anchor tag).\n backgroundColor: \"#EFEFEF\",\n borderColor: \"black\",\n borderStyle: \"solid\",\n borderWidth: \"1px\",\n color: \"#000000\",\n cursor: \"pointer\",\n fontFamily: \"Arial\",\n fontSize: \"1rem\",\n lineHeight: \"1.2\",\n padding: \"2px 10px\",\n textDecorationLine: \"none\",\n },\n props: {\n id: createIdProp(\"Button\"),\n autoFocus: createAutoFocusProp(\"Button\"),\n isDisabled: createDisabledProp(\"Button\"),\n \"aria-label\": createAriaLabelProp(\"Button\"),\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: {\n type: \"text\",\n value: \"Button\",\n },\n },\n href: {\n type: \"href\",\n description:\n \"The URL this button navigates to. If present, this button is an <a> element.\",\n },\n target: {\n type: \"choice\",\n options: [\"_blank\", \"_self\", \"_parent\", \"_top\"],\n description:\n \"Same as target attribute of <a> element. Only applies when the href prop is present.\",\n hidden: (props) => !props.href,\n defaultValueHint: \"_self\",\n },\n submitsForm: {\n type: \"boolean\",\n displayName: \"Submits form?\",\n defaultValueHint: false,\n hidden: (props) => Boolean(props.resetsForm) || Boolean(props.href),\n description:\n \"Whether clicking this button should submit the enclosing form.\",\n advanced: true,\n },\n resetsForm: {\n type: \"boolean\",\n displayName: \"Resets form?\",\n defaultValueHint: false,\n hidden: (props) => Boolean(props.submitsForm) || Boolean(props.href),\n description:\n \"Whether clicking this button should reset the enclosing form.\",\n advanced: true,\n },\n onPress: {\n type: \"eventHandler\",\n argTypes: [{ name: \"event\", type: \"object\" }],\n },\n onFocus: {\n type: \"eventHandler\",\n argTypes: [{ name: \"event\", type: \"object\" }],\n },\n },\n trapsFocus: true,\n },\n overrides\n );\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -2,10 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
var React = require('react');
|
|
4
4
|
var reactAriaComponents = require('react-aria-components');
|
|
5
|
+
var OptionsItemIdManager = require('./OptionsItemIdManager-cb3a2c53.cjs.js');
|
|
5
6
|
var common = require('./common-7f948fa5.cjs.js');
|
|
6
7
|
var contexts = require('./contexts-6d0cb2b1.cjs.js');
|
|
7
|
-
var
|
|
8
|
-
var variantUtils = require('./variant-utils-0ad70db8.cjs.js');
|
|
8
|
+
var variantUtils = require('./variant-utils-1c84aebb.cjs.js');
|
|
9
9
|
require('@plasmicapp/host');
|
|
10
10
|
require('@plasmicapp/host/registerComponent');
|
|
11
11
|
|
|
@@ -54,7 +54,7 @@ const CHECKBOX_VARIANTS = [
|
|
|
54
54
|
"selected",
|
|
55
55
|
"readonly"
|
|
56
56
|
];
|
|
57
|
-
const { variants
|
|
57
|
+
const { variants } = variantUtils.pickAriaComponentVariants(CHECKBOX_VARIANTS);
|
|
58
58
|
function BaseCheckbox(props) {
|
|
59
59
|
const _a = props, {
|
|
60
60
|
children,
|
|
@@ -92,20 +92,22 @@ function BaseCheckbox(props) {
|
|
|
92
92
|
isIndeterminate,
|
|
93
93
|
isSelected,
|
|
94
94
|
isReadOnly
|
|
95
|
-
}) =>
|
|
96
|
-
|
|
95
|
+
}) => /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, /* @__PURE__ */ React__default.default.createElement(
|
|
96
|
+
variantUtils.VariantUpdater,
|
|
97
97
|
{
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
98
|
+
changes: {
|
|
99
|
+
hovered: isHovered,
|
|
100
|
+
pressed: isPressed,
|
|
101
|
+
focused: isFocused,
|
|
102
|
+
focusVisible: isFocusVisible,
|
|
103
|
+
disabled: isDisabled,
|
|
104
|
+
indeterminate: isIndeterminate,
|
|
105
|
+
selected: isSelected,
|
|
106
|
+
readonly: isReadOnly
|
|
107
|
+
},
|
|
108
|
+
updateVariant: plasmicUpdateVariant
|
|
109
|
+
}
|
|
110
|
+
), children)
|
|
109
111
|
));
|
|
110
112
|
}
|
|
111
113
|
const makeDefaultCheckboxChildren = ({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"registerCheckbox.cjs.js","sources":["../src/registerCheckbox.tsx"],"sourcesContent":["import { PlasmicElement } from \"@plasmicapp/host\";\nimport React from \"react\";\nimport type { CheckboxProps } from \"react-aria-components\";\nimport { Checkbox } from \"react-aria-components\";\nimport {\n COMMON_STYLES,\n createAriaLabelProp,\n createAutoFocusProp,\n createDisabledProp,\n createIdProp,\n createNameProp,\n createReadOnlyProp,\n createRequiredProp,\n hasParent,\n} from \"./common\";\nimport { PlasmicCheckboxGroupContext } from \"./contexts\";\nimport { useOptionsItemId } from \"./OptionsItemIdManager\";\nimport {\n BaseControlContextData,\n CodeComponentMetaOverrides,\n HasControlContextData,\n Registerable,\n makeComponentName,\n registerComponentHelper,\n} from \"./utils\";\nimport { WithVariants, pickAriaComponentVariants } from \"./variant-utils\";\n\nconst CHECKBOX_VARIANTS = [\n \"hovered\" as const,\n \"pressed\" as const,\n \"focused\" as const,\n \"focusVisible\" as const,\n \"indeterminate\" as const,\n \"disabled\" as const,\n \"selected\" as const,\n \"readonly\" as const,\n];\n\nexport interface BaseCheckboxControlContextData extends BaseControlContextData {\n idError?: string;\n}\n\ninterface BaseCheckboxProps\n extends CheckboxProps,\n HasControlContextData<BaseCheckboxControlContextData>,\n WithVariants<typeof CHECKBOX_VARIANTS> {\n children: React.ReactNode;\n}\n\nconst { variants, withObservedValues } =\n pickAriaComponentVariants(CHECKBOX_VARIANTS);\n\nexport function BaseCheckbox(props: BaseCheckboxProps) {\n const {\n children,\n plasmicUpdateVariant,\n setControlContextData,\n value,\n ...rest\n } = props;\n const contextProps = React.useContext(PlasmicCheckboxGroupContext);\n\n const { registeredId, idError } = useOptionsItemId(\n value,\n contextProps?.idManager\n );\n\n setControlContextData?.({\n parent: contextProps,\n idError,\n });\n\n return (\n <>\n <Checkbox\n {...rest}\n value={registeredId}\n key={registeredId}\n style={COMMON_STYLES}\n >\n {({\n isHovered,\n isPressed,\n isFocused,\n isFocusVisible,\n isDisabled,\n isIndeterminate,\n isSelected,\n isReadOnly,\n }) =>\n withObservedValues(\n children,\n {\n hovered: isHovered,\n pressed: isPressed,\n focused: isFocused,\n focusVisible: isFocusVisible,\n disabled: isDisabled,\n indeterminate: isIndeterminate,\n selected: isSelected,\n readonly: isReadOnly,\n },\n plasmicUpdateVariant\n )\n }\n </Checkbox>\n </>\n );\n}\n\nexport const makeDefaultCheckboxChildren = ({\n label,\n showDocs,\n}: {\n label: string;\n showDocs?: boolean;\n}): PlasmicElement => ({\n type: \"vbox\",\n styles: {\n display: \"flex\",\n alignItems: \"center\",\n gap: \"2px\",\n padding: 0,\n },\n children: [\n {\n type: \"hbox\",\n styles: {\n display: \"flex\",\n alignItems: \"center\",\n gap: \"10px\",\n padding: 0,\n },\n children: [\n {\n type: \"box\",\n styles: {\n width: \"7px\",\n height: \"7px\",\n borderRadius: \"3px\",\n borderWidth: \"1px\",\n borderStyle: \"solid\",\n borderColor: \"black\",\n },\n },\n {\n type: \"text\",\n value: label,\n },\n ],\n },\n ...(showDocs\n ? [\n {\n type: \"text\",\n value: \"Use the registered variants to see it in action...\",\n } as PlasmicElement,\n ]\n : []),\n ],\n});\n\nexport const CHECKBOX_COMPONENT_NAME = makeComponentName(\"checkbox\");\n\nexport function registerCheckbox(\n loader?: Registerable,\n overrides?: CodeComponentMetaOverrides<typeof BaseCheckbox>\n) {\n return registerComponentHelper(\n loader,\n BaseCheckbox,\n {\n name: CHECKBOX_COMPONENT_NAME,\n displayName: \"Aria Checkbox\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerCheckbox\",\n importName: \"BaseCheckbox\",\n variants,\n props: {\n id: createIdProp(\"Checkbox\"),\n name: createNameProp(),\n isDisabled: createDisabledProp(\"Checkbox\"),\n isReadOnly: createReadOnlyProp(\"Checkbox\"),\n isRequired: createRequiredProp(\"Checkbox\"),\n autoFocus: createAutoFocusProp(\"Checkbox\"),\n \"aria-label\": createAriaLabelProp(\"Checkbox\"),\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: makeDefaultCheckboxChildren({\n label: \"Label\",\n showDocs: true,\n }),\n },\n value: {\n type: \"string\",\n description:\n 'The value of the checkbox in \"selected\" state, used when submitting an HTML form.',\n defaultValueHint: 'Checked value (default: \"on\")',\n validator: (_value, _props, ctx) => {\n if (ctx?.idError) {\n return ctx.idError;\n }\n return true;\n },\n },\n isSelected: {\n type: \"boolean\",\n displayName: \"Default Selected\",\n editOnly: true,\n uncontrolledProp: \"defaultSelected\",\n description: \"Whether the checkbox should be selected by default\",\n defaultValueHint: false,\n defaultValue: false,\n hidden: hasParent,\n },\n isIndeterminate: {\n displayName: \"Indeterminate\",\n type: \"boolean\",\n description:\n \"This state indicates that the checkbox is neither fully checked nor unchecked. It typically represents a partial selection when dealing with groups of options. Some but not all items in the group are selected, resulting in an indeterminate state for the checkbox.\",\n defaultValueHint: false,\n },\n isInvalid: {\n displayName: \"Invalid\",\n type: \"boolean\",\n description: \"Whether the input value is invalid\",\n defaultValueHint: false,\n },\n validationBehavior: {\n type: \"choice\",\n options: [\"native\", \"aria\"],\n description:\n \"Whether to use native HTML form validation to prevent form submission when the value is missing or invalid, or mark the field as required or invalid via ARIA.\",\n defaultValueHint: \"native\",\n },\n onChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"isSelected\", type: \"boolean\" }],\n },\n },\n states: {\n isSelected: {\n type: \"writable\",\n valueProp: \"isSelected\",\n onChangeProp: \"onChange\",\n variableType: \"boolean\",\n hidden: hasParent,\n },\n },\n trapsFocus: true,\n },\n overrides\n );\n}\n"],"names":["pickAriaComponentVariants","React","PlasmicCheckboxGroupContext","useOptionsItemId","Checkbox","COMMON_STYLES","makeComponentName","registerComponentHelper","createIdProp","createNameProp","createDisabledProp","createReadOnlyProp","createRequiredProp","createAutoFocusProp","createAriaLabelProp","hasParent"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"registerCheckbox.cjs.js","sources":["../src/registerCheckbox.tsx"],"sourcesContent":["import { PlasmicElement } from \"@plasmicapp/host\";\nimport React from \"react\";\nimport type { CheckboxProps } from \"react-aria-components\";\nimport { Checkbox } from \"react-aria-components\";\nimport { useOptionsItemId } from \"./OptionsItemIdManager\";\nimport {\n COMMON_STYLES,\n createAriaLabelProp,\n createAutoFocusProp,\n createDisabledProp,\n createIdProp,\n createNameProp,\n createReadOnlyProp,\n createRequiredProp,\n hasParent,\n} from \"./common\";\nimport { PlasmicCheckboxGroupContext } from \"./contexts\";\nimport {\n BaseControlContextData,\n CodeComponentMetaOverrides,\n HasControlContextData,\n Registerable,\n makeComponentName,\n registerComponentHelper,\n} from \"./utils\";\nimport {\n VariantUpdater,\n WithVariants,\n pickAriaComponentVariants,\n} from \"./variant-utils\";\n\nconst CHECKBOX_VARIANTS = [\n \"hovered\" as const,\n \"pressed\" as const,\n \"focused\" as const,\n \"focusVisible\" as const,\n \"indeterminate\" as const,\n \"disabled\" as const,\n \"selected\" as const,\n \"readonly\" as const,\n];\n\nexport interface BaseCheckboxControlContextData extends BaseControlContextData {\n idError?: string;\n}\n\ninterface BaseCheckboxProps\n extends CheckboxProps,\n HasControlContextData<BaseCheckboxControlContextData>,\n WithVariants<typeof CHECKBOX_VARIANTS> {\n children: React.ReactNode;\n}\n\nconst { variants } = pickAriaComponentVariants(CHECKBOX_VARIANTS);\n\nexport function BaseCheckbox(props: BaseCheckboxProps) {\n const {\n children,\n plasmicUpdateVariant,\n setControlContextData,\n value,\n ...rest\n } = props;\n const contextProps = React.useContext(PlasmicCheckboxGroupContext);\n\n const { registeredId, idError } = useOptionsItemId(\n value,\n contextProps?.idManager\n );\n\n setControlContextData?.({\n parent: contextProps,\n idError,\n });\n\n return (\n <>\n <Checkbox\n {...rest}\n value={registeredId}\n key={registeredId}\n style={COMMON_STYLES}\n >\n {({\n isHovered,\n isPressed,\n isFocused,\n isFocusVisible,\n isDisabled,\n isIndeterminate,\n isSelected,\n isReadOnly,\n }) => (\n <>\n <VariantUpdater\n changes={{\n hovered: isHovered,\n pressed: isPressed,\n focused: isFocused,\n focusVisible: isFocusVisible,\n disabled: isDisabled,\n indeterminate: isIndeterminate,\n selected: isSelected,\n readonly: isReadOnly,\n }}\n updateVariant={plasmicUpdateVariant}\n />\n {children}\n </>\n )}\n </Checkbox>\n </>\n );\n}\n\nexport const makeDefaultCheckboxChildren = ({\n label,\n showDocs,\n}: {\n label: string;\n showDocs?: boolean;\n}): PlasmicElement => ({\n type: \"vbox\",\n styles: {\n display: \"flex\",\n alignItems: \"center\",\n gap: \"2px\",\n padding: 0,\n },\n children: [\n {\n type: \"hbox\",\n styles: {\n display: \"flex\",\n alignItems: \"center\",\n gap: \"10px\",\n padding: 0,\n },\n children: [\n {\n type: \"box\",\n styles: {\n width: \"7px\",\n height: \"7px\",\n borderRadius: \"3px\",\n borderWidth: \"1px\",\n borderStyle: \"solid\",\n borderColor: \"black\",\n },\n },\n {\n type: \"text\",\n value: label,\n },\n ],\n },\n ...(showDocs\n ? [\n {\n type: \"text\",\n value: \"Use the registered variants to see it in action...\",\n } as PlasmicElement,\n ]\n : []),\n ],\n});\n\nexport const CHECKBOX_COMPONENT_NAME = makeComponentName(\"checkbox\");\n\nexport function registerCheckbox(\n loader?: Registerable,\n overrides?: CodeComponentMetaOverrides<typeof BaseCheckbox>\n) {\n return registerComponentHelper(\n loader,\n BaseCheckbox,\n {\n name: CHECKBOX_COMPONENT_NAME,\n displayName: \"Aria Checkbox\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerCheckbox\",\n importName: \"BaseCheckbox\",\n variants,\n props: {\n id: createIdProp(\"Checkbox\"),\n name: createNameProp(),\n isDisabled: createDisabledProp(\"Checkbox\"),\n isReadOnly: createReadOnlyProp(\"Checkbox\"),\n isRequired: createRequiredProp(\"Checkbox\"),\n autoFocus: createAutoFocusProp(\"Checkbox\"),\n \"aria-label\": createAriaLabelProp(\"Checkbox\"),\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: makeDefaultCheckboxChildren({\n label: \"Label\",\n showDocs: true,\n }),\n },\n value: {\n type: \"string\",\n description:\n 'The value of the checkbox in \"selected\" state, used when submitting an HTML form.',\n defaultValueHint: 'Checked value (default: \"on\")',\n validator: (_value, _props, ctx) => {\n if (ctx?.idError) {\n return ctx.idError;\n }\n return true;\n },\n },\n isSelected: {\n type: \"boolean\",\n displayName: \"Default Selected\",\n editOnly: true,\n uncontrolledProp: \"defaultSelected\",\n description: \"Whether the checkbox should be selected by default\",\n defaultValueHint: false,\n defaultValue: false,\n hidden: hasParent,\n },\n isIndeterminate: {\n displayName: \"Indeterminate\",\n type: \"boolean\",\n description:\n \"This state indicates that the checkbox is neither fully checked nor unchecked. It typically represents a partial selection when dealing with groups of options. Some but not all items in the group are selected, resulting in an indeterminate state for the checkbox.\",\n defaultValueHint: false,\n },\n isInvalid: {\n displayName: \"Invalid\",\n type: \"boolean\",\n description: \"Whether the input value is invalid\",\n defaultValueHint: false,\n },\n validationBehavior: {\n type: \"choice\",\n options: [\"native\", \"aria\"],\n description:\n \"Whether to use native HTML form validation to prevent form submission when the value is missing or invalid, or mark the field as required or invalid via ARIA.\",\n defaultValueHint: \"native\",\n },\n onChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"isSelected\", type: \"boolean\" }],\n },\n },\n states: {\n isSelected: {\n type: \"writable\",\n valueProp: \"isSelected\",\n onChangeProp: \"onChange\",\n variableType: \"boolean\",\n hidden: hasParent,\n },\n },\n trapsFocus: true,\n },\n overrides\n );\n}\n"],"names":["pickAriaComponentVariants","React","PlasmicCheckboxGroupContext","useOptionsItemId","Checkbox","COMMON_STYLES","VariantUpdater","makeComponentName","registerComponentHelper","createIdProp","createNameProp","createDisabledProp","createReadOnlyProp","createRequiredProp","createAutoFocusProp","createAriaLabelProp","hasParent"],"mappings":"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"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { Checkbox } from 'react-aria-components';
|
|
3
|
+
import { a as useOptionsItemId } from './OptionsItemIdManager-0ce90944.esm.js';
|
|
3
4
|
import { m as makeComponentName, r as registerComponentHelper, C as COMMON_STYLES, c as createIdProp, a as createNameProp, b as createDisabledProp, d as createReadOnlyProp, e as createRequiredProp, g as createAutoFocusProp, f as createAriaLabelProp, h as hasParent } from './common-81f08e86.esm.js';
|
|
4
5
|
import { P as PlasmicCheckboxGroupContext } from './contexts-5cb81c2f.esm.js';
|
|
5
|
-
import {
|
|
6
|
-
import { p as pickAriaComponentVariants } from './variant-utils-4405ebb0.esm.js';
|
|
6
|
+
import { p as pickAriaComponentVariants, V as VariantUpdater } from './variant-utils-5f356d53.esm.js';
|
|
7
7
|
import '@plasmicapp/host';
|
|
8
8
|
import '@plasmicapp/host/registerComponent';
|
|
9
9
|
|
|
@@ -48,7 +48,7 @@ const CHECKBOX_VARIANTS = [
|
|
|
48
48
|
"selected",
|
|
49
49
|
"readonly"
|
|
50
50
|
];
|
|
51
|
-
const { variants
|
|
51
|
+
const { variants } = pickAriaComponentVariants(CHECKBOX_VARIANTS);
|
|
52
52
|
function BaseCheckbox(props) {
|
|
53
53
|
const _a = props, {
|
|
54
54
|
children,
|
|
@@ -86,20 +86,22 @@ function BaseCheckbox(props) {
|
|
|
86
86
|
isIndeterminate,
|
|
87
87
|
isSelected,
|
|
88
88
|
isReadOnly
|
|
89
|
-
}) =>
|
|
90
|
-
|
|
89
|
+
}) => /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
|
|
90
|
+
VariantUpdater,
|
|
91
91
|
{
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
92
|
+
changes: {
|
|
93
|
+
hovered: isHovered,
|
|
94
|
+
pressed: isPressed,
|
|
95
|
+
focused: isFocused,
|
|
96
|
+
focusVisible: isFocusVisible,
|
|
97
|
+
disabled: isDisabled,
|
|
98
|
+
indeterminate: isIndeterminate,
|
|
99
|
+
selected: isSelected,
|
|
100
|
+
readonly: isReadOnly
|
|
101
|
+
},
|
|
102
|
+
updateVariant: plasmicUpdateVariant
|
|
103
|
+
}
|
|
104
|
+
), children)
|
|
103
105
|
));
|
|
104
106
|
}
|
|
105
107
|
const makeDefaultCheckboxChildren = ({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"registerCheckbox.esm.js","sources":["../src/registerCheckbox.tsx"],"sourcesContent":["import { PlasmicElement } from \"@plasmicapp/host\";\nimport React from \"react\";\nimport type { CheckboxProps } from \"react-aria-components\";\nimport { Checkbox } from \"react-aria-components\";\nimport {\n COMMON_STYLES,\n createAriaLabelProp,\n createAutoFocusProp,\n createDisabledProp,\n createIdProp,\n createNameProp,\n createReadOnlyProp,\n createRequiredProp,\n hasParent,\n} from \"./common\";\nimport { PlasmicCheckboxGroupContext } from \"./contexts\";\nimport { useOptionsItemId } from \"./OptionsItemIdManager\";\nimport {\n BaseControlContextData,\n CodeComponentMetaOverrides,\n HasControlContextData,\n Registerable,\n makeComponentName,\n registerComponentHelper,\n} from \"./utils\";\nimport { WithVariants, pickAriaComponentVariants } from \"./variant-utils\";\n\nconst CHECKBOX_VARIANTS = [\n \"hovered\" as const,\n \"pressed\" as const,\n \"focused\" as const,\n \"focusVisible\" as const,\n \"indeterminate\" as const,\n \"disabled\" as const,\n \"selected\" as const,\n \"readonly\" as const,\n];\n\nexport interface BaseCheckboxControlContextData extends BaseControlContextData {\n idError?: string;\n}\n\ninterface BaseCheckboxProps\n extends CheckboxProps,\n HasControlContextData<BaseCheckboxControlContextData>,\n WithVariants<typeof CHECKBOX_VARIANTS> {\n children: React.ReactNode;\n}\n\nconst { variants, withObservedValues } =\n pickAriaComponentVariants(CHECKBOX_VARIANTS);\n\nexport function BaseCheckbox(props: BaseCheckboxProps) {\n const {\n children,\n plasmicUpdateVariant,\n setControlContextData,\n value,\n ...rest\n } = props;\n const contextProps = React.useContext(PlasmicCheckboxGroupContext);\n\n const { registeredId, idError } = useOptionsItemId(\n value,\n contextProps?.idManager\n );\n\n setControlContextData?.({\n parent: contextProps,\n idError,\n });\n\n return (\n <>\n <Checkbox\n {...rest}\n value={registeredId}\n key={registeredId}\n style={COMMON_STYLES}\n >\n {({\n isHovered,\n isPressed,\n isFocused,\n isFocusVisible,\n isDisabled,\n isIndeterminate,\n isSelected,\n isReadOnly,\n }) =>\n withObservedValues(\n children,\n {\n hovered: isHovered,\n pressed: isPressed,\n focused: isFocused,\n focusVisible: isFocusVisible,\n disabled: isDisabled,\n indeterminate: isIndeterminate,\n selected: isSelected,\n readonly: isReadOnly,\n },\n plasmicUpdateVariant\n )\n }\n </Checkbox>\n </>\n );\n}\n\nexport const makeDefaultCheckboxChildren = ({\n label,\n showDocs,\n}: {\n label: string;\n showDocs?: boolean;\n}): PlasmicElement => ({\n type: \"vbox\",\n styles: {\n display: \"flex\",\n alignItems: \"center\",\n gap: \"2px\",\n padding: 0,\n },\n children: [\n {\n type: \"hbox\",\n styles: {\n display: \"flex\",\n alignItems: \"center\",\n gap: \"10px\",\n padding: 0,\n },\n children: [\n {\n type: \"box\",\n styles: {\n width: \"7px\",\n height: \"7px\",\n borderRadius: \"3px\",\n borderWidth: \"1px\",\n borderStyle: \"solid\",\n borderColor: \"black\",\n },\n },\n {\n type: \"text\",\n value: label,\n },\n ],\n },\n ...(showDocs\n ? [\n {\n type: \"text\",\n value: \"Use the registered variants to see it in action...\",\n } as PlasmicElement,\n ]\n : []),\n ],\n});\n\nexport const CHECKBOX_COMPONENT_NAME = makeComponentName(\"checkbox\");\n\nexport function registerCheckbox(\n loader?: Registerable,\n overrides?: CodeComponentMetaOverrides<typeof BaseCheckbox>\n) {\n return registerComponentHelper(\n loader,\n BaseCheckbox,\n {\n name: CHECKBOX_COMPONENT_NAME,\n displayName: \"Aria Checkbox\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerCheckbox\",\n importName: \"BaseCheckbox\",\n variants,\n props: {\n id: createIdProp(\"Checkbox\"),\n name: createNameProp(),\n isDisabled: createDisabledProp(\"Checkbox\"),\n isReadOnly: createReadOnlyProp(\"Checkbox\"),\n isRequired: createRequiredProp(\"Checkbox\"),\n autoFocus: createAutoFocusProp(\"Checkbox\"),\n \"aria-label\": createAriaLabelProp(\"Checkbox\"),\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: makeDefaultCheckboxChildren({\n label: \"Label\",\n showDocs: true,\n }),\n },\n value: {\n type: \"string\",\n description:\n 'The value of the checkbox in \"selected\" state, used when submitting an HTML form.',\n defaultValueHint: 'Checked value (default: \"on\")',\n validator: (_value, _props, ctx) => {\n if (ctx?.idError) {\n return ctx.idError;\n }\n return true;\n },\n },\n isSelected: {\n type: \"boolean\",\n displayName: \"Default Selected\",\n editOnly: true,\n uncontrolledProp: \"defaultSelected\",\n description: \"Whether the checkbox should be selected by default\",\n defaultValueHint: false,\n defaultValue: false,\n hidden: hasParent,\n },\n isIndeterminate: {\n displayName: \"Indeterminate\",\n type: \"boolean\",\n description:\n \"This state indicates that the checkbox is neither fully checked nor unchecked. It typically represents a partial selection when dealing with groups of options. Some but not all items in the group are selected, resulting in an indeterminate state for the checkbox.\",\n defaultValueHint: false,\n },\n isInvalid: {\n displayName: \"Invalid\",\n type: \"boolean\",\n description: \"Whether the input value is invalid\",\n defaultValueHint: false,\n },\n validationBehavior: {\n type: \"choice\",\n options: [\"native\", \"aria\"],\n description:\n \"Whether to use native HTML form validation to prevent form submission when the value is missing or invalid, or mark the field as required or invalid via ARIA.\",\n defaultValueHint: \"native\",\n },\n onChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"isSelected\", type: \"boolean\" }],\n },\n },\n states: {\n isSelected: {\n type: \"writable\",\n valueProp: \"isSelected\",\n onChangeProp: \"onChange\",\n variableType: \"boolean\",\n hidden: hasParent,\n },\n },\n trapsFocus: true,\n },\n overrides\n );\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"registerCheckbox.esm.js","sources":["../src/registerCheckbox.tsx"],"sourcesContent":["import { PlasmicElement } from \"@plasmicapp/host\";\nimport React from \"react\";\nimport type { CheckboxProps } from \"react-aria-components\";\nimport { Checkbox } from \"react-aria-components\";\nimport { useOptionsItemId } from \"./OptionsItemIdManager\";\nimport {\n COMMON_STYLES,\n createAriaLabelProp,\n createAutoFocusProp,\n createDisabledProp,\n createIdProp,\n createNameProp,\n createReadOnlyProp,\n createRequiredProp,\n hasParent,\n} from \"./common\";\nimport { PlasmicCheckboxGroupContext } from \"./contexts\";\nimport {\n BaseControlContextData,\n CodeComponentMetaOverrides,\n HasControlContextData,\n Registerable,\n makeComponentName,\n registerComponentHelper,\n} from \"./utils\";\nimport {\n VariantUpdater,\n WithVariants,\n pickAriaComponentVariants,\n} from \"./variant-utils\";\n\nconst CHECKBOX_VARIANTS = [\n \"hovered\" as const,\n \"pressed\" as const,\n \"focused\" as const,\n \"focusVisible\" as const,\n \"indeterminate\" as const,\n \"disabled\" as const,\n \"selected\" as const,\n \"readonly\" as const,\n];\n\nexport interface BaseCheckboxControlContextData extends BaseControlContextData {\n idError?: string;\n}\n\ninterface BaseCheckboxProps\n extends CheckboxProps,\n HasControlContextData<BaseCheckboxControlContextData>,\n WithVariants<typeof CHECKBOX_VARIANTS> {\n children: React.ReactNode;\n}\n\nconst { variants } = pickAriaComponentVariants(CHECKBOX_VARIANTS);\n\nexport function BaseCheckbox(props: BaseCheckboxProps) {\n const {\n children,\n plasmicUpdateVariant,\n setControlContextData,\n value,\n ...rest\n } = props;\n const contextProps = React.useContext(PlasmicCheckboxGroupContext);\n\n const { registeredId, idError } = useOptionsItemId(\n value,\n contextProps?.idManager\n );\n\n setControlContextData?.({\n parent: contextProps,\n idError,\n });\n\n return (\n <>\n <Checkbox\n {...rest}\n value={registeredId}\n key={registeredId}\n style={COMMON_STYLES}\n >\n {({\n isHovered,\n isPressed,\n isFocused,\n isFocusVisible,\n isDisabled,\n isIndeterminate,\n isSelected,\n isReadOnly,\n }) => (\n <>\n <VariantUpdater\n changes={{\n hovered: isHovered,\n pressed: isPressed,\n focused: isFocused,\n focusVisible: isFocusVisible,\n disabled: isDisabled,\n indeterminate: isIndeterminate,\n selected: isSelected,\n readonly: isReadOnly,\n }}\n updateVariant={plasmicUpdateVariant}\n />\n {children}\n </>\n )}\n </Checkbox>\n </>\n );\n}\n\nexport const makeDefaultCheckboxChildren = ({\n label,\n showDocs,\n}: {\n label: string;\n showDocs?: boolean;\n}): PlasmicElement => ({\n type: \"vbox\",\n styles: {\n display: \"flex\",\n alignItems: \"center\",\n gap: \"2px\",\n padding: 0,\n },\n children: [\n {\n type: \"hbox\",\n styles: {\n display: \"flex\",\n alignItems: \"center\",\n gap: \"10px\",\n padding: 0,\n },\n children: [\n {\n type: \"box\",\n styles: {\n width: \"7px\",\n height: \"7px\",\n borderRadius: \"3px\",\n borderWidth: \"1px\",\n borderStyle: \"solid\",\n borderColor: \"black\",\n },\n },\n {\n type: \"text\",\n value: label,\n },\n ],\n },\n ...(showDocs\n ? [\n {\n type: \"text\",\n value: \"Use the registered variants to see it in action...\",\n } as PlasmicElement,\n ]\n : []),\n ],\n});\n\nexport const CHECKBOX_COMPONENT_NAME = makeComponentName(\"checkbox\");\n\nexport function registerCheckbox(\n loader?: Registerable,\n overrides?: CodeComponentMetaOverrides<typeof BaseCheckbox>\n) {\n return registerComponentHelper(\n loader,\n BaseCheckbox,\n {\n name: CHECKBOX_COMPONENT_NAME,\n displayName: \"Aria Checkbox\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerCheckbox\",\n importName: \"BaseCheckbox\",\n variants,\n props: {\n id: createIdProp(\"Checkbox\"),\n name: createNameProp(),\n isDisabled: createDisabledProp(\"Checkbox\"),\n isReadOnly: createReadOnlyProp(\"Checkbox\"),\n isRequired: createRequiredProp(\"Checkbox\"),\n autoFocus: createAutoFocusProp(\"Checkbox\"),\n \"aria-label\": createAriaLabelProp(\"Checkbox\"),\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: makeDefaultCheckboxChildren({\n label: \"Label\",\n showDocs: true,\n }),\n },\n value: {\n type: \"string\",\n description:\n 'The value of the checkbox in \"selected\" state, used when submitting an HTML form.',\n defaultValueHint: 'Checked value (default: \"on\")',\n validator: (_value, _props, ctx) => {\n if (ctx?.idError) {\n return ctx.idError;\n }\n return true;\n },\n },\n isSelected: {\n type: \"boolean\",\n displayName: \"Default Selected\",\n editOnly: true,\n uncontrolledProp: \"defaultSelected\",\n description: \"Whether the checkbox should be selected by default\",\n defaultValueHint: false,\n defaultValue: false,\n hidden: hasParent,\n },\n isIndeterminate: {\n displayName: \"Indeterminate\",\n type: \"boolean\",\n description:\n \"This state indicates that the checkbox is neither fully checked nor unchecked. It typically represents a partial selection when dealing with groups of options. Some but not all items in the group are selected, resulting in an indeterminate state for the checkbox.\",\n defaultValueHint: false,\n },\n isInvalid: {\n displayName: \"Invalid\",\n type: \"boolean\",\n description: \"Whether the input value is invalid\",\n defaultValueHint: false,\n },\n validationBehavior: {\n type: \"choice\",\n options: [\"native\", \"aria\"],\n description:\n \"Whether to use native HTML form validation to prevent form submission when the value is missing or invalid, or mark the field as required or invalid via ARIA.\",\n defaultValueHint: \"native\",\n },\n onChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"isSelected\", type: \"boolean\" }],\n },\n },\n states: {\n isSelected: {\n type: \"writable\",\n valueProp: \"isSelected\",\n onChangeProp: \"onChange\",\n variableType: \"boolean\",\n hidden: hasParent,\n },\n },\n trapsFocus: true,\n },\n overrides\n );\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -2,13 +2,13 @@
|
|
|
2
2
|
|
|
3
3
|
var React = require('react');
|
|
4
4
|
var reactAriaComponents = require('react-aria-components');
|
|
5
|
+
var OptionsItemIdManager = require('./OptionsItemIdManager-cb3a2c53.cjs.js');
|
|
5
6
|
var common = require('./common-7f948fa5.cjs.js');
|
|
6
7
|
var contexts = require('./contexts-6d0cb2b1.cjs.js');
|
|
7
|
-
var OptionsItemIdManager = require('./OptionsItemIdManager-cb3a2c53.cjs.js');
|
|
8
8
|
var registerCheckbox = require('./registerCheckbox.cjs.js');
|
|
9
9
|
var registerDescription = require('./registerDescription.cjs.js');
|
|
10
10
|
var registerLabel = require('./registerLabel.cjs.js');
|
|
11
|
-
var variantUtils = require('./variant-utils-
|
|
11
|
+
var variantUtils = require('./variant-utils-1c84aebb.cjs.js');
|
|
12
12
|
require('@plasmicapp/host');
|
|
13
13
|
require('@plasmicapp/host/registerComponent');
|
|
14
14
|
require('./registerText.cjs.js');
|
|
@@ -49,9 +49,7 @@ var __objRest = (source, exclude) => {
|
|
|
49
49
|
return target;
|
|
50
50
|
};
|
|
51
51
|
const CHECKBOX_GROUP_VARIANTS = ["disabled", "readonly"];
|
|
52
|
-
const { variants
|
|
53
|
-
CHECKBOX_GROUP_VARIANTS
|
|
54
|
-
);
|
|
52
|
+
const { variants } = variantUtils.pickAriaComponentVariants(CHECKBOX_GROUP_VARIANTS);
|
|
55
53
|
function BaseCheckboxGroup(props) {
|
|
56
54
|
const _a = props, { children, plasmicUpdateVariant, setControlContextData } = _a, rest = __objRest(_a, ["children", "plasmicUpdateVariant", "setControlContextData"]);
|
|
57
55
|
const updateIds = React.useCallback(
|
|
@@ -65,14 +63,16 @@ function BaseCheckboxGroup(props) {
|
|
|
65
63
|
const idManager = OptionsItemIdManager.useIdManager(updateIds);
|
|
66
64
|
return (
|
|
67
65
|
// PlasmicCheckboxGroupContext is used by BaseCheckbox
|
|
68
|
-
/* @__PURE__ */ React__default.default.createElement(contexts.PlasmicCheckboxGroupContext.Provider, { value: __spreadProps(__spreadValues({}, rest), { idManager }) }, /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.CheckboxGroup, __spreadProps(__spreadValues({}, rest), { style: common.COMMON_STYLES }), ({ isDisabled, isReadOnly }) =>
|
|
69
|
-
|
|
66
|
+
/* @__PURE__ */ React__default.default.createElement(contexts.PlasmicCheckboxGroupContext.Provider, { value: __spreadProps(__spreadValues({}, rest), { idManager }) }, /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.CheckboxGroup, __spreadProps(__spreadValues({}, rest), { style: common.COMMON_STYLES }), ({ isDisabled, isReadOnly }) => /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, /* @__PURE__ */ React__default.default.createElement(
|
|
67
|
+
variantUtils.VariantUpdater,
|
|
70
68
|
{
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
69
|
+
changes: {
|
|
70
|
+
disabled: isDisabled,
|
|
71
|
+
readonly: isReadOnly
|
|
72
|
+
},
|
|
73
|
+
updateVariant: plasmicUpdateVariant
|
|
74
|
+
}
|
|
75
|
+
), children)))
|
|
76
76
|
);
|
|
77
77
|
}
|
|
78
78
|
const componentName = common.makeComponentName("checkboxGroup");
|