@plasmicpkgs/react-aria 0.0.28 → 0.0.30

package/skinny/registerButton.d.ts

@@ -10,5 +10,6 @@ interface BaseButtonProps extends ButtonProps {
     updateInteractionVariant?: UpdateInteractionVariant<typeof BUTTON_INTERACTION_VARIANTS>;
 }
 export declare function BaseButton(props: BaseButtonProps): React.JSX.Element;
+export declare const BUTTON_COMPONENT_NAME: string;
 export declare function registerButton(loader?: Registerable, overrides?: CodeComponentMetaOverrides<typeof BaseButton>): void;
 export {};

package/skinny/registerButton.esm.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import { Button } from 'react-aria-components';
 import { g as getCommonInputProps } from './common-52c26d37.esm.js';
-import { p as pickAriaComponentVariants } from './interaction-variant-utils-909267e5.esm.js';
-import { r as registerComponentHelper, m as makeComponentName } from './utils-cf2632c9.esm.js';
+import { p as pickAriaComponentVariants } from './interaction-variant-utils-c44a9d56.esm.js';
+import { a as makeComponentName, r as registerComponentHelper } from './utils-5051df41.esm.js';
 import '@plasmicapp/host/registerComponent';
 
 var __defProp = Object.defineProperty;
@@ -69,21 +69,35 @@ function BaseButton(props) {
     updateInteractionVariant
   ));
 }
+const BUTTON_COMPONENT_NAME = makeComponentName("button");
 function registerButton(loader, overrides) {
   registerComponentHelper(
     loader,
     BaseButton,
     {
-      name: makeComponentName("button"),
+      name: BUTTON_COMPONENT_NAME,
       displayName: "Aria Button",
       importPath: "@plasmicpkgs/react-aria/skinny/registerButton",
       importName: "BaseButton",
       interactionVariants,
+      defaultStyles: {
+        borderWidth: "1px",
+        borderStyle: "solid",
+        borderColor: "black",
+        padding: "2px 10px"
+      },
       props: __spreadProps(__spreadValues({}, getCommonInputProps("button", [
         "isDisabled",
-        "aria-label",
-        "children"
+        "aria-label"
       ])), {
+        children: {
+          type: "slot",
+          mergeWithParent: true,
+          defaultValue: {
+            type: "text",
+            value: "Button"
+          }
+        },
         submitsForm: {
           type: "boolean",
           displayName: "Submits form?",
@@ -111,5 +125,5 @@ function registerButton(loader, overrides) {
   );
 }
 
-export { BaseButton, registerButton };
+export { BUTTON_COMPONENT_NAME, BaseButton, registerButton };
 //# sourceMappingURL=registerButton.esm.js.map

package/skinny/registerButton.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"registerButton.esm.js","sources":["../src/registerButton.tsx"],"sourcesContent":["import React from \"react\";\nimport type { ButtonProps } from \"react-aria-components\";\nimport { Button } from \"react-aria-components\";\nimport { getCommonInputProps } from \"./common\";\nimport {\n  UpdateInteractionVariant,\n  pickAriaComponentVariants,\n} from \"./interaction-variant-utils\";\nimport {\n  CodeComponentMetaOverrides,\n  Registerable,\n  makeComponentName,\n  registerComponentHelper,\n} from \"./utils\";\n\nconst BUTTON_INTERACTION_VARIANTS = [\n  \"hovered\" as const,\n  \"pressed\" as const,\n  \"focused\" as const,\n  \"focusVisible\" as const,\n];\n\nconst { interactionVariants, withObservedValues } = pickAriaComponentVariants(\n  BUTTON_INTERACTION_VARIANTS\n);\n\ninterface BaseButtonProps extends ButtonProps {\n  children: React.ReactNode;\n  resetsForm?: boolean;\n  submitsForm?: boolean;\n  // Optional callback to update the interaction variant state\n  // as it's only provided if the component is the root of a Studio component\n  updateInteractionVariant?: UpdateInteractionVariant<\n    typeof BUTTON_INTERACTION_VARIANTS\n  >;\n}\n\nexport function BaseButton(props: BaseButtonProps) {\n  const {\n    submitsForm,\n    resetsForm,\n    children,\n    updateInteractionVariant,\n    ...rest\n  } = props;\n\n  const type = submitsForm ? \"submit\" : resetsForm ? \"reset\" : \"button\";\n\n  return (\n    <Button type={type} {...rest}>\n      {({ isHovered, isPressed, isFocused, isFocusVisible }) =>\n        withObservedValues(\n          children,\n          {\n            hovered: isHovered,\n            pressed: isPressed,\n            focused: isFocused,\n            focusVisible: isFocusVisible,\n          },\n          updateInteractionVariant\n        )\n      }\n    </Button>\n  );\n}\n\nexport function registerButton(\n  loader?: Registerable,\n  overrides?: CodeComponentMetaOverrides<typeof BaseButton>\n) {\n  registerComponentHelper(\n    loader,\n    BaseButton,\n    {\n      name: makeComponentName(\"button\"),\n      displayName: \"Aria Button\",\n      importPath: \"@plasmicpkgs/react-aria/skinny/registerButton\",\n      importName: \"BaseButton\",\n      interactionVariants,\n      props: {\n        ...getCommonInputProps<BaseButtonProps>(\"button\", [\n          \"isDisabled\",\n          \"aria-label\",\n          \"children\",\n        ]),\n        submitsForm: {\n          type: \"boolean\",\n          displayName: \"Submits form?\",\n          defaultValueHint: false,\n          hidden: (ps: BaseButtonProps) => Boolean(ps.resetsForm),\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: (ps: BaseButtonProps) => Boolean(ps.submitsForm),\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      },\n      trapsFocus: true,\n    },\n    overrides\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAeA,MAAM,2BAA8B,GAAA;AAAA,EAClC,SAAA;AAAA,EACA,SAAA;AAAA,EACA,SAAA;AAAA,EACA,cAAA;AACF,CAAA,CAAA;AAEA,MAAM,EAAE,mBAAqB,EAAA,kBAAA,EAAuB,GAAA,yBAAA;AAAA,EAClD,2BAAA;AACF,CAAA,CAAA;AAaO,SAAS,WAAW,KAAwB,EAAA;AACjD,EAAA,MAMI,EALF,GAAA,KAAA,EAAA;AAAA,IAAA,WAAA;AAAA,IACA,UAAA;AAAA,IACA,QAAA;AAAA,IACA,wBAAA;AAAA,GA1CJ,GA4CM,EADC,EAAA,IAAA,GAAA,SAAA,CACD,EADC,EAAA;AAAA,IAJH,aAAA;AAAA,IACA,YAAA;AAAA,IACA,UAAA;AAAA,IACA,0BAAA;AAAA,GAAA,CAAA,CAAA;AAIF,EAAA,MAAM,IAAO,GAAA,WAAA,GAAc,QAAW,GAAA,UAAA,GAAa,OAAU,GAAA,QAAA,CAAA;AAE7D,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,MAAO,EAAA,cAAA,CAAA,EAAA,IAAA,EAAA,EAAgB,IACrB,CAAA,EAAA,CAAC,EAAE,SAAW,EAAA,SAAA,EAAW,SAAW,EAAA,cAAA,EACnC,KAAA,kBAAA;AAAA,IACE,QAAA;AAAA,IACA;AAAA,MACE,OAAS,EAAA,SAAA;AAAA,MACT,OAAS,EAAA,SAAA;AAAA,MACT,OAAS,EAAA,SAAA;AAAA,MACT,YAAc,EAAA,cAAA;AAAA,KAChB;AAAA,IACA,wBAAA;AAAA,GAGN,CAAA,CAAA;AAEJ,CAAA;AAEgB,SAAA,cAAA,CACd,QACA,SACA,EAAA;AACA,EAAA,uBAAA;AAAA,IACE,MAAA;AAAA,IACA,UAAA;AAAA,IACA;AAAA,MACE,IAAA,EAAM,kBAAkB,QAAQ,CAAA;AAAA,MAChC,WAAa,EAAA,aAAA;AAAA,MACb,UAAY,EAAA,+CAAA;AAAA,MACZ,UAAY,EAAA,YAAA;AAAA,MACZ,mBAAA;AAAA,MACA,KAAA,EAAO,aACF,CAAA,cAAA,CAAA,EAAA,EAAA,mBAAA,CAAqC,QAAU,EAAA;AAAA,QAChD,YAAA;AAAA,QACA,YAAA;AAAA,QACA,UAAA;AAAA,OACD,CALI,CAAA,EAAA;AAAA,QAML,WAAa,EAAA;AAAA,UACX,IAAM,EAAA,SAAA;AAAA,UACN,WAAa,EAAA,eAAA;AAAA,UACb,gBAAkB,EAAA,KAAA;AAAA,UAClB,MAAQ,EAAA,CAAC,EAAwB,KAAA,OAAA,CAAQ,GAAG,UAAU,CAAA;AAAA,UACtD,WACE,EAAA,gEAAA;AAAA,UACF,QAAU,EAAA,IAAA;AAAA,SACZ;AAAA,QACA,UAAY,EAAA;AAAA,UACV,IAAM,EAAA,SAAA;AAAA,UACN,WAAa,EAAA,cAAA;AAAA,UACb,gBAAkB,EAAA,KAAA;AAAA,UAClB,MAAQ,EAAA,CAAC,EAAwB,KAAA,OAAA,CAAQ,GAAG,WAAW,CAAA;AAAA,UACvD,WACE,EAAA,+DAAA;AAAA,UACF,QAAU,EAAA,IAAA;AAAA,SACZ;AAAA,QACA,OAAS,EAAA;AAAA,UACP,IAAM,EAAA,cAAA;AAAA,UACN,UAAU,CAAC,EAAE,MAAM,OAAS,EAAA,IAAA,EAAM,UAAU,CAAA;AAAA,SAC9C;AAAA,OACF,CAAA;AAAA,MACA,UAAY,EAAA,IAAA;AAAA,KACd;AAAA,IACA,SAAA;AAAA,GACF,CAAA;AACF;;;;"}
+{"version":3,"file":"registerButton.esm.js","sources":["../src/registerButton.tsx"],"sourcesContent":["import React from \"react\";\nimport type { ButtonProps } from \"react-aria-components\";\nimport { Button } from \"react-aria-components\";\nimport { getCommonInputProps } from \"./common\";\nimport {\n  UpdateInteractionVariant,\n  pickAriaComponentVariants,\n} from \"./interaction-variant-utils\";\nimport {\n  CodeComponentMetaOverrides,\n  Registerable,\n  makeComponentName,\n  registerComponentHelper,\n} from \"./utils\";\n\nconst BUTTON_INTERACTION_VARIANTS = [\n  \"hovered\" as const,\n  \"pressed\" as const,\n  \"focused\" as const,\n  \"focusVisible\" as const,\n];\n\nconst { interactionVariants, withObservedValues } = pickAriaComponentVariants(\n  BUTTON_INTERACTION_VARIANTS\n);\n\ninterface BaseButtonProps extends ButtonProps {\n  children: React.ReactNode;\n  resetsForm?: boolean;\n  submitsForm?: boolean;\n  // Optional callback to update the interaction variant state\n  // as it's only provided if the component is the root of a Studio component\n  updateInteractionVariant?: UpdateInteractionVariant<\n    typeof BUTTON_INTERACTION_VARIANTS\n  >;\n}\n\nexport function BaseButton(props: BaseButtonProps) {\n  const {\n    submitsForm,\n    resetsForm,\n    children,\n    updateInteractionVariant,\n    ...rest\n  } = props;\n\n  const type = submitsForm ? \"submit\" : resetsForm ? \"reset\" : \"button\";\n\n  return (\n    <Button type={type} {...rest}>\n      {({ isHovered, isPressed, isFocused, isFocusVisible }) =>\n        withObservedValues(\n          children,\n          {\n            hovered: isHovered,\n            pressed: isPressed,\n            focused: isFocused,\n            focusVisible: isFocusVisible,\n          },\n          updateInteractionVariant\n        )\n      }\n    </Button>\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      interactionVariants,\n      defaultStyles: {\n        borderWidth: \"1px\",\n        borderStyle: \"solid\",\n        borderColor: \"black\",\n        padding: \"2px 10px\",\n      },\n      props: {\n        ...getCommonInputProps<BaseButtonProps>(\"button\", [\n          \"isDisabled\",\n          \"aria-label\",\n        ]),\n        children: {\n          type: \"slot\",\n          mergeWithParent: true as any,\n          defaultValue: {\n            type: \"text\",\n            value: \"Button\",\n          },\n        },\n        submitsForm: {\n          type: \"boolean\",\n          displayName: \"Submits form?\",\n          defaultValueHint: false,\n          hidden: (ps: BaseButtonProps) => Boolean(ps.resetsForm),\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: (ps: BaseButtonProps) => Boolean(ps.submitsForm),\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      },\n      trapsFocus: true,\n    },\n    overrides\n  );\n}\n"],"names":[],"mappings":"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"}

package/skinny/registerCheckbox.cjs.js

@@ -3,8 +3,10 @@
 var React = require('react');
 var reactAriaComponents = require('react-aria-components');
 var common = require('./common-e74a9214.cjs.js');
-var interactionVariantUtils = require('./interaction-variant-utils-0f05190f.cjs.js');
-var utils = require('./utils-18b2465b.cjs.js');
+var contexts = require('./contexts-b21f6b12.cjs.js');
+var interactionVariantUtils = require('./interaction-variant-utils-244b74fb.cjs.js');
+var registerLabel = require('./registerLabel.cjs.js');
+var utils = require('./utils-745db876.cjs.js');
 require('@plasmicapp/host/registerComponent');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -52,7 +54,12 @@ const { interactionVariants, withObservedValues } = interactionVariantUtils.pick
   CHECKBOX_INTERACTION_VARIANTS
 );
 function BaseCheckbox(props) {
-  const _a = props, { children, updateInteractionVariant } = _a, rest = __objRest(_a, ["children", "updateInteractionVariant"]);
+  const _a = props, { children, updateInteractionVariant, setControlContextData } = _a, rest = __objRest(_a, ["children", "updateInteractionVariant", "setControlContextData"]);
+  const contextProps = React__default.default.useContext(contexts.PlasmicCheckboxGroupContext);
+  const isStandalone = !contextProps;
+  setControlContextData == null ? void 0 : setControlContextData({
+    isStandalone
+  });
   return /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Checkbox, __spreadValues({}, rest), ({ isHovered, isPressed, isFocused, isFocusVisible }) => withObservedValues(
     children,
     {
@@ -64,8 +71,60 @@ function BaseCheckbox(props) {
     updateInteractionVariant
   )));
 }
+const makeDefaultCheckboxChildren = ({
+  label,
+  showDocs
+}) => ({
+  type: "vbox",
+  styles: {
+    display: "flex",
+    alignItems: "center",
+    gap: "2px",
+    padding: 0
+  },
+  children: [
+    {
+      type: "hbox",
+      styles: {
+        display: "flex",
+        alignItems: "center",
+        gap: "10px",
+        padding: 0
+      },
+      children: [
+        {
+          type: "box",
+          styles: {
+            width: "7px",
+            height: "7px",
+            borderRadius: "3px",
+            borderWidth: "1px",
+            borderStyle: "solid",
+            borderColor: "black"
+          }
+        },
+        {
+          type: "component",
+          name: registerLabel.LABEL_COMPONENT_NAME,
+          props: {
+            children: {
+              type: "text",
+              value: label
+            }
+          }
+        }
+      ]
+    },
+    ...showDocs ? [
+      {
+        type: "text",
+        value: "Add interaction variants to see it in action..."
+      }
+    ] : []
+  ]
+});
 function registerCheckbox(loader, overrides) {
-  utils.registerComponentHelper(
+  return utils.registerComponentHelper(
     loader,
     BaseCheckbox,
     {
@@ -79,10 +138,17 @@ function registerCheckbox(loader, overrides) {
         "isDisabled",
         "isReadOnly",
         "aria-label",
-        "children",
         "isRequired",
         "autoFocus"
       ])), {
+        children: {
+          type: "slot",
+          mergeWithParent: true,
+          defaultValue: makeDefaultCheckboxChildren({
+            label: "Label",
+            showDocs: true
+          })
+        },
         value: {
           type: "string",
           description: "The value of the input element, used when submitting an HTML form."
@@ -92,7 +158,8 @@ function registerCheckbox(loader, overrides) {
           editOnly: true,
           uncontrolledProp: "defaultSelected",
           description: "Whether the checkbox is toggled on",
-          defaultValueHint: false
+          defaultValueHint: false,
+          defaultValue: false
         },
         isIndeterminate: {
           displayName: "Indeterminate",
@@ -122,7 +189,8 @@ function registerCheckbox(loader, overrides) {
           type: "writable",
           valueProp: "isSelected",
           onChangeProp: "onChange",
-          variableType: "boolean"
+          variableType: "boolean",
+          hidden: (_ps, ctx) => !(ctx == null ? void 0 : ctx.isStandalone)
         }
       },
       trapsFocus: true
@@ -132,5 +200,6 @@ function registerCheckbox(loader, overrides) {
 }
 
 exports.BaseCheckbox = BaseCheckbox;
+exports.makeDefaultCheckboxChildren = makeDefaultCheckboxChildren;
 exports.registerCheckbox = registerCheckbox;
 //# sourceMappingURL=registerCheckbox.cjs.js.map

package/skinny/registerCheckbox.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"registerCheckbox.cjs.js","sources":["../src/registerCheckbox.tsx"],"sourcesContent":["import React from \"react\";\nimport type { CheckboxProps } from \"react-aria-components\";\nimport { Checkbox } from \"react-aria-components\";\nimport { getCommonInputProps } from \"./common\";\nimport {\n  UpdateInteractionVariant,\n  pickAriaComponentVariants,\n} from \"./interaction-variant-utils\";\nimport {\n  CodeComponentMetaOverrides,\n  Registerable,\n  makeComponentName,\n  registerComponentHelper,\n} from \"./utils\";\n\nconst CHECKBOX_INTERACTION_VARIANTS = [\n  \"hovered\" as const,\n  \"pressed\" as const,\n  \"focused\" as const,\n  \"focusVisible\" as const,\n];\n\ninterface BaseCheckboxProps extends CheckboxProps {\n  children: React.ReactNode;\n  // Optional callback to update the interaction variant state\n  // as it's only provided if the component is the root of a Studio component\n  updateInteractionVariant?: UpdateInteractionVariant<\n    typeof CHECKBOX_INTERACTION_VARIANTS\n  >;\n}\n\nconst { interactionVariants, withObservedValues } = pickAriaComponentVariants(\n  CHECKBOX_INTERACTION_VARIANTS\n);\n\nexport function BaseCheckbox(props: BaseCheckboxProps) {\n  const { children, updateInteractionVariant, ...rest } = props;\n\n  return (\n    <>\n      <Checkbox {...rest}>\n        {({ isHovered, isPressed, isFocused, isFocusVisible }) =>\n          withObservedValues(\n            children,\n            {\n              hovered: isHovered,\n              pressed: isPressed,\n              focused: isFocused,\n              focusVisible: isFocusVisible,\n            },\n            updateInteractionVariant\n          )\n        }\n      </Checkbox>\n    </>\n  );\n}\n\nexport function registerCheckbox(\n  loader?: Registerable,\n  overrides?: CodeComponentMetaOverrides<typeof BaseCheckbox>\n) {\n  registerComponentHelper(\n    loader,\n    BaseCheckbox,\n    {\n      name: makeComponentName(\"checkbox\"),\n      displayName: \"Aria Checkbox\",\n      importPath: \"@plasmicpkgs/react-aria/skinny/registerCheckbox\",\n      importName: \"BaseCheckbox\",\n      interactionVariants,\n      props: {\n        ...getCommonInputProps<CheckboxProps>(\"checkbox\", [\n          \"name\",\n          \"isDisabled\",\n          \"isReadOnly\",\n          \"aria-label\",\n          \"children\",\n          \"isRequired\",\n          \"autoFocus\",\n        ]),\n        value: {\n          type: \"string\",\n          description:\n            \"The value of the input element, used when submitting an HTML form.\",\n        },\n        isSelected: {\n          type: \"boolean\",\n          editOnly: true,\n          uncontrolledProp: \"defaultSelected\",\n          description: \"Whether the checkbox is toggled on\",\n          defaultValueHint: false,\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        },\n      },\n      trapsFocus: true,\n    },\n    overrides\n  );\n}\n"],"names":["pickAriaComponentVariants","React","Checkbox","registerComponentHelper","makeComponentName","getCommonInputProps"],"mappings":"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"}
+{"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 { getCommonInputProps } from \"./common\";\nimport { PlasmicCheckboxGroupContext } from \"./contexts\";\nimport {\n  UpdateInteractionVariant,\n  pickAriaComponentVariants,\n} from \"./interaction-variant-utils\";\nimport { LABEL_COMPONENT_NAME } from \"./registerLabel\";\nimport {\n  BaseControlContextData,\n  CodeComponentMetaOverrides,\n  Registerable,\n  makeComponentName,\n  registerComponentHelper,\n} from \"./utils\";\n\nconst CHECKBOX_INTERACTION_VARIANTS = [\n  \"hovered\" as const,\n  \"pressed\" as const,\n  \"focused\" as const,\n  \"focusVisible\" as const,\n];\n\ninterface BaseCheckboxProps extends CheckboxProps {\n  children: React.ReactNode;\n  setControlContextData?: (ctxData: BaseControlContextData) => void;\n  // Optional callback to update the interaction variant state\n  // as it's only provided if the component is the root of a Studio component\n  updateInteractionVariant?: UpdateInteractionVariant<\n    typeof CHECKBOX_INTERACTION_VARIANTS\n  >;\n}\n\nconst { interactionVariants, withObservedValues } = pickAriaComponentVariants(\n  CHECKBOX_INTERACTION_VARIANTS\n);\n\nexport function BaseCheckbox(props: BaseCheckboxProps) {\n  const { children, updateInteractionVariant, setControlContextData, ...rest } =\n    props;\n  const contextProps = React.useContext(PlasmicCheckboxGroupContext);\n  const isStandalone = !contextProps;\n\n  setControlContextData?.({\n    isStandalone,\n  });\n\n  return (\n    <>\n      <Checkbox {...rest}>\n        {({ isHovered, isPressed, isFocused, isFocusVisible }) =>\n          withObservedValues(\n            children,\n            {\n              hovered: isHovered,\n              pressed: isPressed,\n              focused: isFocused,\n              focusVisible: isFocusVisible,\n            },\n            updateInteractionVariant\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: \"component\",\n          name: LABEL_COMPONENT_NAME,\n          props: {\n            children: {\n              type: \"text\",\n              value: label,\n            },\n          },\n        },\n      ],\n    },\n    ...(showDocs\n      ? [\n          {\n            type: \"text\",\n            value: \"Add interaction variants to see it in action...\",\n          } as PlasmicElement,\n        ]\n      : []),\n  ],\n});\n\nexport function registerCheckbox(\n  loader?: Registerable,\n  overrides?: CodeComponentMetaOverrides<typeof BaseCheckbox>\n) {\n  return registerComponentHelper(\n    loader,\n    BaseCheckbox,\n    {\n      name: makeComponentName(\"checkbox\"),\n      displayName: \"Aria Checkbox\",\n      importPath: \"@plasmicpkgs/react-aria/skinny/registerCheckbox\",\n      importName: \"BaseCheckbox\",\n      interactionVariants,\n      props: {\n        ...getCommonInputProps<CheckboxProps>(\"checkbox\", [\n          \"name\",\n          \"isDisabled\",\n          \"isReadOnly\",\n          \"aria-label\",\n          \"isRequired\",\n          \"autoFocus\",\n        ]),\n        children: {\n          type: \"slot\",\n          mergeWithParent: true as any,\n          defaultValue: makeDefaultCheckboxChildren({\n            label: \"Label\",\n            showDocs: true,\n          }),\n        },\n        value: {\n          type: \"string\",\n          description:\n            \"The value of the input element, used when submitting an HTML form.\",\n        },\n        isSelected: {\n          type: \"boolean\",\n          editOnly: true,\n          uncontrolledProp: \"defaultSelected\",\n          description: \"Whether the checkbox is toggled on\",\n          defaultValueHint: false,\n          defaultValue: false,\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: (\n            _ps: BaseCheckboxProps,\n            ctx: BaseControlContextData | null\n          ) => !ctx?.isStandalone,\n        },\n      },\n      trapsFocus: true,\n    },\n    overrides\n  );\n}\n"],"names":["pickAriaComponentVariants","React","PlasmicCheckboxGroupContext","Checkbox","LABEL_COMPONENT_NAME","registerComponentHelper","makeComponentName","getCommonInputProps"],"mappings":"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"}

package/skinny/registerCheckbox.d.ts

@@ -1,12 +1,18 @@
+import { PlasmicElement } from "@plasmicapp/host";
 import React from "react";
 import type { CheckboxProps } from "react-aria-components";
 import { UpdateInteractionVariant } from "./interaction-variant-utils";
-import { CodeComponentMetaOverrides, Registerable } from "./utils";
+import { BaseControlContextData, CodeComponentMetaOverrides, Registerable } from "./utils";
 declare const CHECKBOX_INTERACTION_VARIANTS: ("hovered" | "pressed" | "focused" | "focusVisible")[];
 interface BaseCheckboxProps extends CheckboxProps {
     children: React.ReactNode;
+    setControlContextData?: (ctxData: BaseControlContextData) => void;
     updateInteractionVariant?: UpdateInteractionVariant<typeof CHECKBOX_INTERACTION_VARIANTS>;
 }
 export declare function BaseCheckbox(props: BaseCheckboxProps): React.JSX.Element;
-export declare function registerCheckbox(loader?: Registerable, overrides?: CodeComponentMetaOverrides<typeof BaseCheckbox>): void;
+export declare const makeDefaultCheckboxChildren: ({ label, showDocs, }: {
+    label: string;
+    showDocs?: boolean | undefined;
+}) => PlasmicElement;
+export declare function registerCheckbox(loader?: Registerable, overrides?: CodeComponentMetaOverrides<typeof BaseCheckbox>): import("@plasmicapp/host").CodeComponentMeta<BaseCheckboxProps>;
 export {};

package/skinny/registerCheckbox.esm.js

@@ -1,8 +1,10 @@
 import React from 'react';
 import { Checkbox } from 'react-aria-components';
 import { g as getCommonInputProps } from './common-52c26d37.esm.js';
-import { p as pickAriaComponentVariants } from './interaction-variant-utils-909267e5.esm.js';
-import { r as registerComponentHelper, m as makeComponentName } from './utils-cf2632c9.esm.js';
+import { P as PlasmicCheckboxGroupContext } from './contexts-9475faad.esm.js';
+import { p as pickAriaComponentVariants } from './interaction-variant-utils-c44a9d56.esm.js';
+import { LABEL_COMPONENT_NAME } from './registerLabel.esm.js';
+import { r as registerComponentHelper, a as makeComponentName } from './utils-5051df41.esm.js';
 import '@plasmicapp/host/registerComponent';
 
 var __defProp = Object.defineProperty;
@@ -46,7 +48,12 @@ const { interactionVariants, withObservedValues } = pickAriaComponentVariants(
   CHECKBOX_INTERACTION_VARIANTS
 );
 function BaseCheckbox(props) {
-  const _a = props, { children, updateInteractionVariant } = _a, rest = __objRest(_a, ["children", "updateInteractionVariant"]);
+  const _a = props, { children, updateInteractionVariant, setControlContextData } = _a, rest = __objRest(_a, ["children", "updateInteractionVariant", "setControlContextData"]);
+  const contextProps = React.useContext(PlasmicCheckboxGroupContext);
+  const isStandalone = !contextProps;
+  setControlContextData == null ? void 0 : setControlContextData({
+    isStandalone
+  });
   return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Checkbox, __spreadValues({}, rest), ({ isHovered, isPressed, isFocused, isFocusVisible }) => withObservedValues(
     children,
     {
@@ -58,8 +65,60 @@ function BaseCheckbox(props) {
     updateInteractionVariant
   )));
 }
+const makeDefaultCheckboxChildren = ({
+  label,
+  showDocs
+}) => ({
+  type: "vbox",
+  styles: {
+    display: "flex",
+    alignItems: "center",
+    gap: "2px",
+    padding: 0
+  },
+  children: [
+    {
+      type: "hbox",
+      styles: {
+        display: "flex",
+        alignItems: "center",
+        gap: "10px",
+        padding: 0
+      },
+      children: [
+        {
+          type: "box",
+          styles: {
+            width: "7px",
+            height: "7px",
+            borderRadius: "3px",
+            borderWidth: "1px",
+            borderStyle: "solid",
+            borderColor: "black"
+          }
+        },
+        {
+          type: "component",
+          name: LABEL_COMPONENT_NAME,
+          props: {
+            children: {
+              type: "text",
+              value: label
+            }
+          }
+        }
+      ]
+    },
+    ...showDocs ? [
+      {
+        type: "text",
+        value: "Add interaction variants to see it in action..."
+      }
+    ] : []
+  ]
+});
 function registerCheckbox(loader, overrides) {
-  registerComponentHelper(
+  return registerComponentHelper(
     loader,
     BaseCheckbox,
     {
@@ -73,10 +132,17 @@ function registerCheckbox(loader, overrides) {
         "isDisabled",
         "isReadOnly",
         "aria-label",
-        "children",
         "isRequired",
         "autoFocus"
       ])), {
+        children: {
+          type: "slot",
+          mergeWithParent: true,
+          defaultValue: makeDefaultCheckboxChildren({
+            label: "Label",
+            showDocs: true
+          })
+        },
         value: {
           type: "string",
           description: "The value of the input element, used when submitting an HTML form."
@@ -86,7 +152,8 @@ function registerCheckbox(loader, overrides) {
           editOnly: true,
           uncontrolledProp: "defaultSelected",
           description: "Whether the checkbox is toggled on",
-          defaultValueHint: false
+          defaultValueHint: false,
+          defaultValue: false
         },
         isIndeterminate: {
           displayName: "Indeterminate",
@@ -116,7 +183,8 @@ function registerCheckbox(loader, overrides) {
           type: "writable",
           valueProp: "isSelected",
           onChangeProp: "onChange",
-          variableType: "boolean"
+          variableType: "boolean",
+          hidden: (_ps, ctx) => !(ctx == null ? void 0 : ctx.isStandalone)
         }
       },
       trapsFocus: true
@@ -125,5 +193,5 @@ function registerCheckbox(loader, overrides) {
   );
 }
 
-export { BaseCheckbox, registerCheckbox };
+export { BaseCheckbox, makeDefaultCheckboxChildren, registerCheckbox };
 //# sourceMappingURL=registerCheckbox.esm.js.map

package/skinny/registerCheckbox.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"registerCheckbox.esm.js","sources":["../src/registerCheckbox.tsx"],"sourcesContent":["import React from \"react\";\nimport type { CheckboxProps } from \"react-aria-components\";\nimport { Checkbox } from \"react-aria-components\";\nimport { getCommonInputProps } from \"./common\";\nimport {\n  UpdateInteractionVariant,\n  pickAriaComponentVariants,\n} from \"./interaction-variant-utils\";\nimport {\n  CodeComponentMetaOverrides,\n  Registerable,\n  makeComponentName,\n  registerComponentHelper,\n} from \"./utils\";\n\nconst CHECKBOX_INTERACTION_VARIANTS = [\n  \"hovered\" as const,\n  \"pressed\" as const,\n  \"focused\" as const,\n  \"focusVisible\" as const,\n];\n\ninterface BaseCheckboxProps extends CheckboxProps {\n  children: React.ReactNode;\n  // Optional callback to update the interaction variant state\n  // as it's only provided if the component is the root of a Studio component\n  updateInteractionVariant?: UpdateInteractionVariant<\n    typeof CHECKBOX_INTERACTION_VARIANTS\n  >;\n}\n\nconst { interactionVariants, withObservedValues } = pickAriaComponentVariants(\n  CHECKBOX_INTERACTION_VARIANTS\n);\n\nexport function BaseCheckbox(props: BaseCheckboxProps) {\n  const { children, updateInteractionVariant, ...rest } = props;\n\n  return (\n    <>\n      <Checkbox {...rest}>\n        {({ isHovered, isPressed, isFocused, isFocusVisible }) =>\n          withObservedValues(\n            children,\n            {\n              hovered: isHovered,\n              pressed: isPressed,\n              focused: isFocused,\n              focusVisible: isFocusVisible,\n            },\n            updateInteractionVariant\n          )\n        }\n      </Checkbox>\n    </>\n  );\n}\n\nexport function registerCheckbox(\n  loader?: Registerable,\n  overrides?: CodeComponentMetaOverrides<typeof BaseCheckbox>\n) {\n  registerComponentHelper(\n    loader,\n    BaseCheckbox,\n    {\n      name: makeComponentName(\"checkbox\"),\n      displayName: \"Aria Checkbox\",\n      importPath: \"@plasmicpkgs/react-aria/skinny/registerCheckbox\",\n      importName: \"BaseCheckbox\",\n      interactionVariants,\n      props: {\n        ...getCommonInputProps<CheckboxProps>(\"checkbox\", [\n          \"name\",\n          \"isDisabled\",\n          \"isReadOnly\",\n          \"aria-label\",\n          \"children\",\n          \"isRequired\",\n          \"autoFocus\",\n        ]),\n        value: {\n          type: \"string\",\n          description:\n            \"The value of the input element, used when submitting an HTML form.\",\n        },\n        isSelected: {\n          type: \"boolean\",\n          editOnly: true,\n          uncontrolledProp: \"defaultSelected\",\n          description: \"Whether the checkbox is toggled on\",\n          defaultValueHint: false,\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        },\n      },\n      trapsFocus: true,\n    },\n    overrides\n  );\n}\n"],"names":[],"mappings":"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"}
+{"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 { getCommonInputProps } from \"./common\";\nimport { PlasmicCheckboxGroupContext } from \"./contexts\";\nimport {\n  UpdateInteractionVariant,\n  pickAriaComponentVariants,\n} from \"./interaction-variant-utils\";\nimport { LABEL_COMPONENT_NAME } from \"./registerLabel\";\nimport {\n  BaseControlContextData,\n  CodeComponentMetaOverrides,\n  Registerable,\n  makeComponentName,\n  registerComponentHelper,\n} from \"./utils\";\n\nconst CHECKBOX_INTERACTION_VARIANTS = [\n  \"hovered\" as const,\n  \"pressed\" as const,\n  \"focused\" as const,\n  \"focusVisible\" as const,\n];\n\ninterface BaseCheckboxProps extends CheckboxProps {\n  children: React.ReactNode;\n  setControlContextData?: (ctxData: BaseControlContextData) => void;\n  // Optional callback to update the interaction variant state\n  // as it's only provided if the component is the root of a Studio component\n  updateInteractionVariant?: UpdateInteractionVariant<\n    typeof CHECKBOX_INTERACTION_VARIANTS\n  >;\n}\n\nconst { interactionVariants, withObservedValues } = pickAriaComponentVariants(\n  CHECKBOX_INTERACTION_VARIANTS\n);\n\nexport function BaseCheckbox(props: BaseCheckboxProps) {\n  const { children, updateInteractionVariant, setControlContextData, ...rest } =\n    props;\n  const contextProps = React.useContext(PlasmicCheckboxGroupContext);\n  const isStandalone = !contextProps;\n\n  setControlContextData?.({\n    isStandalone,\n  });\n\n  return (\n    <>\n      <Checkbox {...rest}>\n        {({ isHovered, isPressed, isFocused, isFocusVisible }) =>\n          withObservedValues(\n            children,\n            {\n              hovered: isHovered,\n              pressed: isPressed,\n              focused: isFocused,\n              focusVisible: isFocusVisible,\n            },\n            updateInteractionVariant\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: \"component\",\n          name: LABEL_COMPONENT_NAME,\n          props: {\n            children: {\n              type: \"text\",\n              value: label,\n            },\n          },\n        },\n      ],\n    },\n    ...(showDocs\n      ? [\n          {\n            type: \"text\",\n            value: \"Add interaction variants to see it in action...\",\n          } as PlasmicElement,\n        ]\n      : []),\n  ],\n});\n\nexport function registerCheckbox(\n  loader?: Registerable,\n  overrides?: CodeComponentMetaOverrides<typeof BaseCheckbox>\n) {\n  return registerComponentHelper(\n    loader,\n    BaseCheckbox,\n    {\n      name: makeComponentName(\"checkbox\"),\n      displayName: \"Aria Checkbox\",\n      importPath: \"@plasmicpkgs/react-aria/skinny/registerCheckbox\",\n      importName: \"BaseCheckbox\",\n      interactionVariants,\n      props: {\n        ...getCommonInputProps<CheckboxProps>(\"checkbox\", [\n          \"name\",\n          \"isDisabled\",\n          \"isReadOnly\",\n          \"aria-label\",\n          \"isRequired\",\n          \"autoFocus\",\n        ]),\n        children: {\n          type: \"slot\",\n          mergeWithParent: true as any,\n          defaultValue: makeDefaultCheckboxChildren({\n            label: \"Label\",\n            showDocs: true,\n          }),\n        },\n        value: {\n          type: \"string\",\n          description:\n            \"The value of the input element, used when submitting an HTML form.\",\n        },\n        isSelected: {\n          type: \"boolean\",\n          editOnly: true,\n          uncontrolledProp: \"defaultSelected\",\n          description: \"Whether the checkbox is toggled on\",\n          defaultValueHint: false,\n          defaultValue: false,\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: (\n            _ps: BaseCheckboxProps,\n            ctx: BaseControlContextData | null\n          ) => !ctx?.isStandalone,\n        },\n      },\n      trapsFocus: true,\n    },\n    overrides\n  );\n}\n"],"names":[],"mappings":"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"}

package/skinny/registerCheckboxGroup.cjs.js

@@ -1,17 +1,22 @@
 'use strict';
 
+var React = require('react');
 var reactAriaComponents = require('react-aria-components');
 var common = require('./common-e74a9214.cjs.js');
+var contexts = require('./contexts-b21f6b12.cjs.js');
 var registerCheckbox = require('./registerCheckbox.cjs.js');
 var registerDescription = require('./registerDescription.cjs.js');
 var registerFieldError = require('./registerFieldError.cjs.js');
 var registerLabel = require('./registerLabel.cjs.js');
-var utils = require('./utils-18b2465b.cjs.js');
-require('react');
-require('./interaction-variant-utils-0f05190f.cjs.js');
+var utils = require('./utils-745db876.cjs.js');
+require('./interaction-variant-utils-244b74fb.cjs.js');
 require('./registerText.cjs.js');
 require('@plasmicapp/host/registerComponent');
 
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
 var __defProp = Object.defineProperty;
 var __defProps = Object.defineProperties;
 var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
@@ -31,9 +36,20 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-const BaseCheckboxGroup = reactAriaComponents.CheckboxGroup;
+function BaseCheckboxGroup(props) {
+  return /* @__PURE__ */ React__default.default.createElement(contexts.PlasmicCheckboxGroupContext.Provider, { value: props }, /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.CheckboxGroup, __spreadValues({}, props)));
+}
 const componentName = utils.makeComponentName("checkboxGroup");
 function registerCheckboxGroup(loader, overrides) {
+  const thisName = utils.makeChildComponentName(
+    overrides == null ? void 0 : overrides.parentComponentName,
+    componentName
+  );
+  registerFieldError.registerFieldError(loader, { parentComponentName: thisName });
+  const checkboxMeta = registerCheckbox.registerCheckbox(loader, {
+    parentComponentName: thisName
+  });
+  registerLabel.registerLabel(loader, { parentComponentName: thisName });
   utils.registerComponentHelper(
     loader,
     BaseCheckboxGroup,
@@ -50,6 +66,76 @@ function registerCheckboxGroup(loader, overrides) {
         "children",
         "isRequired"
       ])), {
+        children: {
+          type: "slot",
+          mergeWithParent: true,
+          defaultValue: [
+            {
+              type: "vbox",
+              styles: {
+                display: "flex",
+                gap: "5px",
+                padding: 0,
+                alignItems: "flex-start"
+              },
+              children: [
+                {
+                  type: "component",
+                  name: registerLabel.LABEL_COMPONENT_NAME,
+                  props: {
+                    children: {
+                      type: "text",
+                      value: "Checkbox Group"
+                    }
+                  }
+                },
+                {
+                  type: "component",
+                  name: checkboxMeta.name,
+                  props: {
+                    children: registerCheckbox.makeDefaultCheckboxChildren({
+                      label: "Checkbox 1",
+                      showDocs: false
+                    }),
+                    value: "checkbox1"
+                  }
+                },
+                {
+                  type: "component",
+                  name: checkboxMeta.name,
+                  props: {
+                    children: registerCheckbox.makeDefaultCheckboxChildren({
+                      label: "Checkbox 2",
+                      showDocs: false
+                    }),
+                    value: "checkbox2"
+                  }
+                },
+                {
+                  type: "component",
+                  name: checkboxMeta.name,
+                  props: {
+                    children: registerCheckbox.makeDefaultCheckboxChildren({
+                      label: "Checkbox 3",
+                      showDocs: false
+                    }),
+                    value: "checkbox3"
+                  }
+                },
+                {
+                  type: "component",
+                  name: registerDescription.DESCRIPTION_COMPONENT_NAME,
+                  props: {
+                    children: {
+                      type: "text",
+                      value: "Add interaction variants to see it in action..."
+                    }
+                  }
+                }
+              ]
+            }
+          ]
+        },
         value: {
           type: "array",
           editOnly: true,
@@ -85,16 +171,6 @@ function registerCheckboxGroup(loader, overrides) {
     },
     overrides
   );
-  const thisName = utils.makeChildComponentName(
-    overrides == null ? void 0 : overrides.parentComponentName,
-    componentName
-  );
-  registerFieldError.registerFieldError(loader, { parentComponentName: thisName });
-  registerCheckbox.registerCheckbox(loader, { parentComponentName: thisName });
-  registerLabel.registerLabel(loader, { parentComponentName: thisName });
-  registerDescription.registerDescription(loader, {
-    parentComponentName: thisName
-  });
 }
 
 exports.BaseCheckboxGroup = BaseCheckboxGroup;