@plasmicpkgs/react-aria 0.0.50 → 0.0.52

package/dist/registerButton.d.ts

@@ -1,13 +1,12 @@
 import React from "react";
 import type { ButtonProps } from "react-aria-components";
-import { UpdateInteractionVariant } from "./interaction-variant-utils";
 import { CodeComponentMetaOverrides, Registerable } from "./utils";
-declare const BUTTON_INTERACTION_VARIANTS: ("disabled" | "hovered" | "pressed" | "focused" | "focusVisible")[];
-interface BaseButtonProps extends ButtonProps {
+import { WithVariants } from "./variant-utils";
+declare const BUTTON_VARIANTS: ("disabled" | "hovered" | "pressed" | "focused" | "focusVisible")[];
+interface BaseButtonProps extends ButtonProps, WithVariants<typeof BUTTON_VARIANTS> {
     children: React.ReactNode;
     resetsForm?: boolean;
     submitsForm?: boolean;
-    updateInteractionVariant?: UpdateInteractionVariant<typeof BUTTON_INTERACTION_VARIANTS>;
 }
 export declare function BaseButton(props: BaseButtonProps): React.JSX.Element;
 export declare const BUTTON_COMPONENT_NAME: string;

package/dist/registerCheckbox.d.ts

@@ -1,12 +1,11 @@
 import { PlasmicElement } from "@plasmicapp/host";
 import React from "react";
 import type { CheckboxProps } from "react-aria-components";
-import { UpdateInteractionVariant } from "./interaction-variant-utils";
 import { CodeComponentMetaOverrides, HasControlContextData, Registerable } from "./utils";
-declare const CHECKBOX_INTERACTION_VARIANTS: ("disabled" | "readonly" | "hovered" | "pressed" | "focused" | "focusVisible" | "selected" | "indeterminate")[];
-interface BaseCheckboxProps extends CheckboxProps, HasControlContextData {
+import { WithVariants } from "./variant-utils";
+declare const CHECKBOX_VARIANTS: ("disabled" | "readonly" | "hovered" | "pressed" | "focused" | "focusVisible" | "selected" | "indeterminate")[];
+interface BaseCheckboxProps extends CheckboxProps, HasControlContextData, WithVariants<typeof CHECKBOX_VARIANTS> {
     children: React.ReactNode;
-    updateInteractionVariant?: UpdateInteractionVariant<typeof CHECKBOX_INTERACTION_VARIANTS>;
 }
 export declare function BaseCheckbox(props: BaseCheckboxProps): React.JSX.Element;
 export declare const makeDefaultCheckboxChildren: ({ label, showDocs, }: {

package/dist/registerCheckboxGroup.d.ts

@@ -1,11 +1,10 @@
 import React from "react";
 import type { CheckboxGroupProps } from "react-aria-components";
-import { UpdateInteractionVariant } from "./interaction-variant-utils";
 import { CodeComponentMetaOverrides, Registerable } from "./utils";
-declare const CHECKBOX_GROUP_INTERACTION_VARIANTS: ("disabled" | "readonly")[];
-export interface BaseCheckboxGroupProps extends CheckboxGroupProps {
+import { WithVariants } from "./variant-utils";
+declare const CHECKBOX_GROUP_VARIANTS: ("disabled" | "readonly")[];
+export interface BaseCheckboxGroupProps extends CheckboxGroupProps, WithVariants<typeof CHECKBOX_GROUP_VARIANTS> {
     children?: React.ReactNode;
-    updateInteractionVariant?: UpdateInteractionVariant<typeof CHECKBOX_GROUP_INTERACTION_VARIANTS>;
 }
 export declare function BaseCheckboxGroup(props: BaseCheckboxGroupProps): React.JSX.Element;
 export declare function registerCheckboxGroup(loader?: Registerable, overrides?: CodeComponentMetaOverrides<typeof BaseCheckboxGroup>): void;

package/dist/registerInput.d.ts

@@ -1,10 +1,9 @@
 import React, { ChangeEvent } from "react";
 import type { InputProps } from "react-aria-components";
-import { UpdateInteractionVariant } from "./interaction-variant-utils";
 import { CodeComponentMetaOverrides, HasControlContextData, Registerable } from "./utils";
-declare const INPUT_INTERACTION_VARIANTS: ("disabled" | "hovered" | "focused")[];
-export interface BaseInputProps extends Omit<InputProps, "autoComplete">, HasControlContextData {
-    updateInteractionVariant?: UpdateInteractionVariant<typeof INPUT_INTERACTION_VARIANTS>;
+import { WithVariants } from "./variant-utils";
+declare const INPUT_VARIANTS: ("disabled" | "hovered" | "focused")[];
+export interface BaseInputProps extends Omit<InputProps, "autoComplete">, HasControlContextData, WithVariants<typeof INPUT_VARIANTS> {
     autoComplete?: string[];
 }
 export declare const inputHelpers: {

package/dist/registerListBoxItem.d.ts

@@ -1,15 +1,15 @@
 import { PlasmicElement } from "@plasmicapp/host";
 import React from "react";
 import { ListBoxItem } from "react-aria-components";
-import { UpdateInteractionVariant } from "./interaction-variant-utils";
 import { CodeComponentMetaOverrides, HasControlContextData, Registerable } from "./utils";
-declare const LIST_BOX_ITEM_INTERACTION_VARIANTS: ("disabled" | "hovered" | "pressed" | "focused" | "focusVisible" | "selected")[];
-export interface BaseListBoxItemProps extends React.ComponentProps<typeof ListBoxItem>, HasControlContextData<{
+import { WithVariants } from "./variant-utils";
+declare const LIST_BOX_ITEM_VARIANTS: ("disabled" | "hovered" | "pressed" | "focused" | "focusVisible" | "selected")[];
+export interface BaseListBoxControlContextData {
     hasDuplicateId: boolean;
-}> {
+}
+export interface BaseListBoxItemProps extends React.ComponentProps<typeof ListBoxItem>, HasControlContextData<BaseListBoxControlContextData>, WithVariants<typeof LIST_BOX_ITEM_VARIANTS> {
     id?: string;
     children?: React.ReactNode;
-    updateInteractionVariant?: UpdateInteractionVariant<typeof LIST_BOX_ITEM_INTERACTION_VARIANTS>;
 }
 export declare function BaseListBoxItem(props: BaseListBoxItemProps): React.JSX.Element;
 export declare const makeDefaultListBoxItemChildren: (label: string, description?: string) => PlasmicElement;

package/dist/registerRadio.d.ts

@@ -1,12 +1,11 @@
 import { PlasmicElement } from "@plasmicapp/host";
 import React from "react";
 import type { RadioProps } from "react-aria-components";
-import { UpdateInteractionVariant } from "./interaction-variant-utils";
 import { CodeComponentMetaOverrides, HasControlContextData, Registerable } from "./utils";
-declare const RADIO_INTERACTION_VARIANTS: ("disabled" | "readonly" | "hovered" | "pressed" | "focused" | "focusVisible" | "selected")[];
-export interface BaseRadioProps extends RadioProps, HasControlContextData {
+import { WithVariants } from "./variant-utils";
+declare const RADIO_VARIANTS: ("disabled" | "readonly" | "hovered" | "pressed" | "focused" | "focusVisible" | "selected")[];
+export interface BaseRadioProps extends RadioProps, HasControlContextData, WithVariants<typeof RADIO_VARIANTS> {
     children: React.ReactNode;
-    updateInteractionVariant?: UpdateInteractionVariant<typeof RADIO_INTERACTION_VARIANTS>;
 }
 export declare function BaseRadio(props: BaseRadioProps): React.JSX.Element;
 export declare const makeDefaultRadioChildren: (label: string) => PlasmicElement;

package/dist/registerRadioGroup.d.ts

@@ -1,11 +1,10 @@
 import React from "react";
 import type { RadioGroupProps } from "react-aria-components";
-import { UpdateInteractionVariant } from "./interaction-variant-utils";
 import { CodeComponentMetaOverrides, Registerable } from "./utils";
-declare const RADIO_GROUP_INTERACTION_VARIANTS: ("disabled" | "readonly")[];
-export interface BaseRadioGroupProps extends RadioGroupProps {
+import { WithVariants } from "./variant-utils";
+declare const RADIO_GROUP_VARIANTS: ("disabled" | "readonly")[];
+export interface BaseRadioGroupProps extends RadioGroupProps, WithVariants<typeof RADIO_GROUP_VARIANTS> {
     children: React.ReactNode;
-    updateInteractionVariant?: UpdateInteractionVariant<typeof RADIO_GROUP_INTERACTION_VARIANTS>;
 }
 export declare function BaseRadioGroup(props: BaseRadioGroupProps): React.JSX.Element;
 export declare function registerRadioGroup(loader?: Registerable, overrides?: CodeComponentMetaOverrides<typeof BaseRadioGroup>): void;

package/dist/registerSlider.d.ts

@@ -1,11 +1,10 @@
 import React from "react";
 import { type SliderProps } from "react-aria-components";
-import { UpdateInteractionVariant } from "./interaction-variant-utils";
 import { CodeComponentMetaOverrides, Registerable } from "./utils";
-declare const SLIDER_INTERACTION_VARIANTS: "disabled"[];
-export interface BaseSliderProps<T extends number | number[]> extends SliderProps<T> {
+import { WithVariants } from "./variant-utils";
+declare const SLIDER_VARIANTS: "disabled"[];
+export interface BaseSliderProps<T extends number | number[]> extends SliderProps<T>, WithVariants<typeof SLIDER_VARIANTS> {
     children?: React.ReactNode;
-    updateInteractionVariant?: UpdateInteractionVariant<typeof SLIDER_INTERACTION_VARIANTS>;
 }
 export declare function BaseSlider<T extends number | number[]>(props: BaseSliderProps<T>): React.JSX.Element;
 export declare function registerSlider(loader?: Registerable, overrides?: CodeComponentMetaOverrides<typeof BaseSlider<number>>): void;

package/dist/registerSliderOutput.d.ts

@@ -1,11 +1,10 @@
 import React from "react";
 import { SliderOutput } from "react-aria-components";
-import { UpdateInteractionVariant } from "./interaction-variant-utils";
 import { CodeComponentMetaOverrides, Registerable } from "./utils";
-declare const SLIDER_OUTPUT_INTERACTION_VARIANTS: "disabled"[];
-export interface BaseSliderOutputProps extends React.ComponentProps<typeof SliderOutput> {
+import { WithVariants } from "./variant-utils";
+declare const SLIDER_OUTPUT_VARIANTS: "disabled"[];
+export interface BaseSliderOutputProps extends React.ComponentProps<typeof SliderOutput>, WithVariants<typeof SLIDER_OUTPUT_VARIANTS> {
     children?: React.ReactNode;
-    updateInteractionVariant?: UpdateInteractionVariant<typeof SLIDER_OUTPUT_INTERACTION_VARIANTS>;
 }
 export declare function BaseSliderOutput(props: BaseSliderOutputProps): React.JSX.Element;
 export declare const SLIDER_OUTPUT_COMPONENT_NAME: string;

package/dist/registerSliderThumb.d.ts

@@ -1,13 +1,12 @@
 import React from "react";
 import { SliderThumb } from "react-aria-components";
-import { UpdateInteractionVariant } from "./interaction-variant-utils";
 import { CodeComponentMetaOverrides, Registerable } from "./utils";
-declare const SLIDER_THUMB_INTERACTION_VARIANTS: ("disabled" | "hovered" | "focused" | "focusVisible" | "dragging")[];
-export interface BaseSliderThumbProps extends React.ComponentProps<typeof SliderThumb> {
+import { WithVariants } from "./variant-utils";
+declare const SLIDER_THUMB_VARIANTS: ("disabled" | "hovered" | "focused" | "focusVisible" | "dragging")[];
+export interface BaseSliderThumbProps extends React.ComponentProps<typeof SliderThumb>, WithVariants<typeof SLIDER_THUMB_VARIANTS> {
     advanced?: boolean;
-    updateInteractionVariant?: UpdateInteractionVariant<typeof SLIDER_THUMB_INTERACTION_VARIANTS>;
 }
-export declare function BaseSliderThumb({ children, advanced, updateInteractionVariant, ...rest }: BaseSliderThumbProps): React.JSX.Element;
+export declare function BaseSliderThumb({ children, advanced, updateVariant, ...rest }: BaseSliderThumbProps): React.JSX.Element;
 export declare const SLIDER_THUMB_COMPONENT_NAME: string;
 export declare function registerSliderThumb(loader?: Registerable, overrides?: CodeComponentMetaOverrides<typeof BaseSliderThumb>): import("@plasmicapp/host").CodeComponentMeta<BaseSliderThumbProps>;
 export {};

package/dist/registerSliderTrack.d.ts

@@ -1,13 +1,12 @@
 import { CodeComponentMeta } from "@plasmicapp/host";
 import React from "react";
 import { SliderTrack } from "react-aria-components";
-import { UpdateInteractionVariant } from "./interaction-variant-utils";
 import { BaseSliderThumbProps } from "./registerSliderThumb";
 import { CodeComponentMetaOverrides, Registerable } from "./utils";
-declare const SLIDER_TRACK_INTERACTION_VARIANTS: "hovered"[];
-export interface BaseSliderTrackProps extends React.ComponentProps<typeof SliderTrack> {
+import { WithVariants } from "./variant-utils";
+declare const SLIDER_TRACK_VARIANTS: "hovered"[];
+export interface BaseSliderTrackProps extends React.ComponentProps<typeof SliderTrack>, WithVariants<typeof SLIDER_TRACK_VARIANTS> {
     progressBar?: React.ReactNode;
-    updateInteractionVariant?: UpdateInteractionVariant<typeof SLIDER_TRACK_INTERACTION_VARIANTS>;
     children?: React.ReactElement<HTMLElement>;
 }
 export declare function BaseSliderTrack(props: BaseSliderTrackProps): React.JSX.Element;

package/dist/registerSwitch.d.ts

@@ -1,11 +1,10 @@
 import React from "react";
 import type { SwitchProps } from "react-aria-components";
-import { UpdateInteractionVariant } from "./interaction-variant-utils";
 import { CodeComponentMetaOverrides, Registerable } from "./utils";
-declare const SWITCH_INTERACTION_VARIANTS: ("disabled" | "readonly" | "hovered" | "pressed" | "focused" | "focusVisible" | "selected")[];
-interface BaseSwitchProps extends SwitchProps {
+import { WithVariants } from "./variant-utils";
+declare const SWITCH_VARIANTS: ("disabled" | "readonly" | "hovered" | "pressed" | "focused" | "focusVisible" | "selected")[];
+interface BaseSwitchProps extends SwitchProps, WithVariants<typeof SWITCH_VARIANTS> {
     children: React.ReactNode;
-    updateInteractionVariant?: UpdateInteractionVariant<typeof SWITCH_INTERACTION_VARIANTS>;
 }
 export declare function BaseSwitch(props: BaseSwitchProps): React.JSX.Element;
 export declare function registerSwitch(loader?: Registerable, overrides?: CodeComponentMetaOverrides<typeof BaseSwitch>): void;

package/dist/registerTextArea.d.ts

@@ -1,10 +1,9 @@
 import React, { ChangeEvent } from "react";
 import type { TextAreaProps } from "react-aria-components";
-import { UpdateInteractionVariant } from "./interaction-variant-utils";
 import { CodeComponentMetaOverrides, HasControlContextData, Registerable } from "./utils";
-declare const TEXTAREA_INTERACTION_VARIANTS: ("disabled" | "hovered" | "focused")[];
-export interface BaseTextAreaProps extends TextAreaProps, HasControlContextData {
-    updateInteractionVariant?: UpdateInteractionVariant<typeof TEXTAREA_INTERACTION_VARIANTS>;
+import { WithVariants } from "./variant-utils";
+declare const TEXTAREA_VARIANTS: ("disabled" | "hovered" | "focused")[];
+export interface BaseTextAreaProps extends TextAreaProps, HasControlContextData, WithVariants<typeof TEXTAREA_VARIANTS> {
 }
 export declare const inputHelpers: {
     states: {

package/dist/registerTextField.d.ts

@@ -1,16 +1,15 @@
 import React, { ReactNode } from "react";
 import type { InputProps, TextFieldProps } from "react-aria-components";
-import { UpdateInteractionVariant } from "./interaction-variant-utils";
 import { CodeComponentMetaOverrides, Registerable } from "./utils";
-declare const TEXT_FIELD_INTERACTION_VARIANTS: ("disabled" | "readonly")[];
-export interface BaseTextFieldProps extends Omit<TextFieldProps, "autoComplete"> {
+import { WithVariants } from "./variant-utils";
+declare const TEXT_FIELD_VARIANTS: ("disabled" | "readonly")[];
+export interface BaseTextFieldProps extends Omit<TextFieldProps, "autoComplete">, WithVariants<typeof TEXT_FIELD_VARIANTS> {
     label?: ReactNode;
     description?: ReactNode;
     multiline?: boolean;
     inputProps?: InputProps;
     autoComplete?: string[];
     children: ReactNode;
-    updateInteractionVariant?: UpdateInteractionVariant<typeof TEXT_FIELD_INTERACTION_VARIANTS>;
 }
 export declare function BaseTextField(props: BaseTextFieldProps): React.JSX.Element;
 export declare const TEXT_FIELD_COMPONENT_NAME: string;

package/dist/{interaction-variant-utils.d.ts → variant-utils.d.ts}

@@ -1,6 +1,6 @@
 import { CodeComponentMeta } from "@plasmicapp/host";
 import React from "react";
-declare const ARIA_COMPONENTS_INTERACTION_VARIANTS: {
+declare const ARIA_COMPONENTS_VARIANTS: {
     hovered: {
         cssSelector: string;
         displayName: string;
@@ -38,14 +38,17 @@ declare const ARIA_COMPONENTS_INTERACTION_VARIANTS: {
         displayName: string;
     };
 };
-type AriaInteractionVariant = keyof typeof ARIA_COMPONENTS_INTERACTION_VARIANTS;
-type CodeComponentInteractionVariantsMeta = NonNullable<CodeComponentMeta<unknown>["interactionVariants"]>;
-type InteractionVariantMeta = CodeComponentInteractionVariantsMeta[string];
+type AriaVariant = keyof typeof ARIA_COMPONENTS_VARIANTS;
+type CodeComponentVariantsMeta = NonNullable<CodeComponentMeta<unknown>["variants"]>;
+type VariantMeta = CodeComponentVariantsMeta[string];
 type ArrayElement<T> = T extends (infer U)[] ? U : never;
-export type UpdateInteractionVariant<T extends AriaInteractionVariant[]> = ((changes: Partial<Record<ArrayElement<T>, boolean>>) => void) | undefined;
-type WithObservedValues<T extends AriaInteractionVariant[]> = (children: React.ReactNode, state: Record<ArrayElement<T>, boolean>, updateInteractionVariant: UpdateInteractionVariant<T>) => React.ReactNode;
-export declare function pickAriaComponentVariants<T extends AriaInteractionVariant[]>(keys: T): {
-    interactionVariants: Record<ArrayElement<T>, InteractionVariantMeta>;
+export type UpdateVariant<T extends AriaVariant[]> = ((changes: Partial<Record<ArrayElement<T>, boolean>>) => void) | undefined;
+export interface WithVariants<T extends AriaVariant[]> {
+    updateVariant?: UpdateVariant<T>;
+}
+type WithObservedValues<T extends AriaVariant[]> = (children: React.ReactNode, state: Record<ArrayElement<T>, boolean>, updateVariant: UpdateVariant<T>) => React.ReactNode;
+export declare function pickAriaComponentVariants<T extends AriaVariant[]>(keys: T): {
+    variants: Record<ArrayElement<T>, VariantMeta>;
     withObservedValues: WithObservedValues<T>;
 };
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plasmicpkgs/react-aria",
-  "version": "0.0.50",
+  "version": "0.0.52",
   "description": "Plasmic registration calls for react-aria based components",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -54,7 +54,7 @@
     "react-stately": "^3.31.0"
   },
   "devDependencies": {
-    "@plasmicapp/host": "1.0.206",
+    "@plasmicapp/host": "1.0.207",
     "@rollup/plugin-commonjs": "^11.0.0",
     "@rollup/plugin-json": "^4.0.0",
     "@rollup/plugin-node-resolve": "^9.0.0",
@@ -74,5 +74,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "26596f6bc5c2122aa51d5328c672aae514a2f7da"
+  "gitHead": "9097835f7f37064c7aeefbdcdbf7d2ba0ca652c9"
 }

package/skinny/registerButton.cjs.js

@@ -3,8 +3,8 @@
 var React = require('react');
 var reactAriaComponents = require('react-aria-components');
 var common = require('./common-c892c339.cjs.js');
-var interactionVariantUtils = require('./interaction-variant-utils-9a869063.cjs.js');
 var utils = require('./utils-8dbb4d1f.cjs.js');
+var variantUtils = require('./variant-utils-db5b9590.cjs.js');
 require('@plasmicapp/host/registerComponent');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -42,28 +42,16 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-const BUTTON_INTERACTION_VARIANTS = [
+const BUTTON_VARIANTS = [
   "hovered",
   "pressed",
   "focused",
   "focusVisible",
   "disabled"
 ];
-const { interactionVariants, withObservedValues } = interactionVariantUtils.pickAriaComponentVariants(
-  BUTTON_INTERACTION_VARIANTS
-);
+const { variants, withObservedValues } = variantUtils.pickAriaComponentVariants(BUTTON_VARIANTS);
 function BaseButton(props) {
-  const _a = props, {
-    submitsForm,
-    resetsForm,
-    children,
-    updateInteractionVariant
-  } = _a, rest = __objRest(_a, [
-    "submitsForm",
-    "resetsForm",
-    "children",
-    "updateInteractionVariant"
-  ]);
+  const _a = props, { submitsForm, resetsForm, children, updateVariant } = _a, rest = __objRest(_a, ["submitsForm", "resetsForm", "children", "updateVariant"]);
   const type = submitsForm ? "submit" : resetsForm ? "reset" : "button";
   return /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.Button, __spreadValues({ type }, rest), ({ isHovered, isPressed, isFocused, isFocusVisible, isDisabled }) => withObservedValues(
     children,
@@ -74,7 +62,7 @@ function BaseButton(props) {
       focusVisible: isFocusVisible,
       disabled: isDisabled
     },
-    updateInteractionVariant
+    updateVariant
   ));
 }
 const BUTTON_COMPONENT_NAME = utils.makeComponentName("button");
@@ -87,7 +75,7 @@ function registerButton(loader, overrides) {
       displayName: "Aria Button",
       importPath: "@plasmicpkgs/react-aria/skinny/registerButton",
       importName: "BaseButton",
-      interactionVariants,
+      variants,
       defaultStyles: {
         borderWidth: "1px",
         borderStyle: "solid",
@@ -96,6 +84,7 @@ function registerButton(loader, overrides) {
         cursor: "pointer"
       },
       props: __spreadProps(__spreadValues({}, common.getCommonProps("button", [
+        "autoFocus",
         "isDisabled",
         "aria-label"
       ])), {

package/skinny/registerButton.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"registerButton.cjs.js","sources":["../src/registerButton.tsx"],"sourcesContent":["import React from \"react\";\nimport type { ButtonProps } from \"react-aria-components\";\nimport { Button } from \"react-aria-components\";\nimport { getCommonProps } 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  \"disabled\" 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, isDisabled }) =>\n        withObservedValues(\n          children,\n          {\n            hovered: isHovered,\n            pressed: isPressed,\n            focused: isFocused,\n            focusVisible: isFocusVisible,\n            disabled: isDisabled,\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        cursor: \"pointer\",\n      },\n      props: {\n        ...getCommonProps<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":["pickAriaComponentVariants","React","Button","makeComponentName","registerComponentHelper","getCommonProps"],"mappings":"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"}
+{"version":3,"file":"registerButton.cjs.js","sources":["../src/registerButton.tsx"],"sourcesContent":["import React from \"react\";\nimport type { ButtonProps } from \"react-aria-components\";\nimport { Button } from \"react-aria-components\";\nimport { getCommonProps } 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\ninterface BaseButtonProps\n  extends ButtonProps,\n    WithVariants<typeof BUTTON_VARIANTS> {\n  children: React.ReactNode;\n  resetsForm?: boolean;\n  submitsForm?: boolean;\n}\n\nexport function BaseButton(props: BaseButtonProps) {\n  const { submitsForm, resetsForm, children, updateVariant, ...rest } = props;\n\n  const type = submitsForm ? \"submit\" : resetsForm ? \"reset\" : \"button\";\n\n  return (\n    <Button type={type} {...rest}>\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          updateVariant\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      variants,\n      defaultStyles: {\n        borderWidth: \"1px\",\n        borderStyle: \"solid\",\n        borderColor: \"black\",\n        padding: \"2px 10px\",\n        cursor: \"pointer\",\n      },\n      props: {\n        ...getCommonProps<BaseButtonProps>(\"button\", [\n          \"autoFocus\",\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":["pickAriaComponentVariants","React","Button","makeComponentName","registerComponentHelper","getCommonProps"],"mappings":"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"}

package/skinny/registerButton.d.ts

@@ -1,13 +1,12 @@
 import React from "react";
 import type { ButtonProps } from "react-aria-components";
-import { UpdateInteractionVariant } from "./interaction-variant-utils";
 import { CodeComponentMetaOverrides, Registerable } from "./utils";
-declare const BUTTON_INTERACTION_VARIANTS: ("disabled" | "hovered" | "pressed" | "focused" | "focusVisible")[];
-interface BaseButtonProps extends ButtonProps {
+import { WithVariants } from "./variant-utils";
+declare const BUTTON_VARIANTS: ("disabled" | "hovered" | "pressed" | "focused" | "focusVisible")[];
+interface BaseButtonProps extends ButtonProps, WithVariants<typeof BUTTON_VARIANTS> {
     children: React.ReactNode;
     resetsForm?: boolean;
     submitsForm?: boolean;
-    updateInteractionVariant?: UpdateInteractionVariant<typeof BUTTON_INTERACTION_VARIANTS>;
 }
 export declare function BaseButton(props: BaseButtonProps): React.JSX.Element;
 export declare const BUTTON_COMPONENT_NAME: string;

package/skinny/registerButton.esm.js

@@ -1,8 +1,8 @@
 import React from 'react';
 import { Button } from 'react-aria-components';
 import { g as getCommonProps } from './common-8ca74873.esm.js';
-import { p as pickAriaComponentVariants } from './interaction-variant-utils-1d94d073.esm.js';
 import { a as makeComponentName, r as registerComponentHelper } from './utils-c7662a47.esm.js';
+import { p as pickAriaComponentVariants } from './variant-utils-23360776.esm.js';
 import '@plasmicapp/host/registerComponent';
 
 var __defProp = Object.defineProperty;
@@ -36,28 +36,16 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-const BUTTON_INTERACTION_VARIANTS = [
+const BUTTON_VARIANTS = [
   "hovered",
   "pressed",
   "focused",
   "focusVisible",
   "disabled"
 ];
-const { interactionVariants, withObservedValues } = pickAriaComponentVariants(
-  BUTTON_INTERACTION_VARIANTS
-);
+const { variants, withObservedValues } = pickAriaComponentVariants(BUTTON_VARIANTS);
 function BaseButton(props) {
-  const _a = props, {
-    submitsForm,
-    resetsForm,
-    children,
-    updateInteractionVariant
-  } = _a, rest = __objRest(_a, [
-    "submitsForm",
-    "resetsForm",
-    "children",
-    "updateInteractionVariant"
-  ]);
+  const _a = props, { submitsForm, resetsForm, children, updateVariant } = _a, rest = __objRest(_a, ["submitsForm", "resetsForm", "children", "updateVariant"]);
   const type = submitsForm ? "submit" : resetsForm ? "reset" : "button";
   return /* @__PURE__ */ React.createElement(Button, __spreadValues({ type }, rest), ({ isHovered, isPressed, isFocused, isFocusVisible, isDisabled }) => withObservedValues(
     children,
@@ -68,7 +56,7 @@ function BaseButton(props) {
       focusVisible: isFocusVisible,
       disabled: isDisabled
     },
-    updateInteractionVariant
+    updateVariant
   ));
 }
 const BUTTON_COMPONENT_NAME = makeComponentName("button");
@@ -81,7 +69,7 @@ function registerButton(loader, overrides) {
       displayName: "Aria Button",
       importPath: "@plasmicpkgs/react-aria/skinny/registerButton",
       importName: "BaseButton",
-      interactionVariants,
+      variants,
       defaultStyles: {
         borderWidth: "1px",
         borderStyle: "solid",
@@ -90,6 +78,7 @@ function registerButton(loader, overrides) {
         cursor: "pointer"
       },
       props: __spreadProps(__spreadValues({}, getCommonProps("button", [
+        "autoFocus",
         "isDisabled",
         "aria-label"
       ])), {

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 { getCommonProps } 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  \"disabled\" 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, isDisabled }) =>\n        withObservedValues(\n          children,\n          {\n            hovered: isHovered,\n            pressed: isPressed,\n            focused: isFocused,\n            focusVisible: isFocusVisible,\n            disabled: isDisabled,\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        cursor: \"pointer\",\n      },\n      props: {\n        ...getCommonProps<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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"}
+{"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 { getCommonProps } 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\ninterface BaseButtonProps\n  extends ButtonProps,\n    WithVariants<typeof BUTTON_VARIANTS> {\n  children: React.ReactNode;\n  resetsForm?: boolean;\n  submitsForm?: boolean;\n}\n\nexport function BaseButton(props: BaseButtonProps) {\n  const { submitsForm, resetsForm, children, updateVariant, ...rest } = props;\n\n  const type = submitsForm ? \"submit\" : resetsForm ? \"reset\" : \"button\";\n\n  return (\n    <Button type={type} {...rest}>\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          updateVariant\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      variants,\n      defaultStyles: {\n        borderWidth: \"1px\",\n        borderStyle: \"solid\",\n        borderColor: \"black\",\n        padding: \"2px 10px\",\n        cursor: \"pointer\",\n      },\n      props: {\n        ...getCommonProps<BaseButtonProps>(\"button\", [\n          \"autoFocus\",\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

@@ -4,8 +4,8 @@ var React = require('react');
 var reactAriaComponents = require('react-aria-components');
 var common = require('./common-c892c339.cjs.js');
 var contexts = require('./contexts-c26d68f8.cjs.js');
-var interactionVariantUtils = require('./interaction-variant-utils-9a869063.cjs.js');
 var utils = require('./utils-8dbb4d1f.cjs.js');
+var variantUtils = require('./variant-utils-db5b9590.cjs.js');
 require('@plasmicapp/host/registerComponent');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
@@ -43,7 +43,7 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-const CHECKBOX_INTERACTION_VARIANTS = [
+const CHECKBOX_VARIANTS = [
   "hovered",
   "pressed",
   "focused",
@@ -54,11 +54,9 @@ const CHECKBOX_INTERACTION_VARIANTS = [
   "readonly",
   "selected"
 ];
-const { interactionVariants, withObservedValues } = interactionVariantUtils.pickAriaComponentVariants(
-  CHECKBOX_INTERACTION_VARIANTS
-);
+const { variants, withObservedValues } = variantUtils.pickAriaComponentVariants(CHECKBOX_VARIANTS);
 function BaseCheckbox(props) {
-  const _a = props, { children, updateInteractionVariant, setControlContextData } = _a, rest = __objRest(_a, ["children", "updateInteractionVariant", "setControlContextData"]);
+  const _a = props, { children, updateVariant, setControlContextData } = _a, rest = __objRest(_a, ["children", "updateVariant", "setControlContextData"]);
   const contextProps = React__default.default.useContext(contexts.PlasmicCheckboxGroupContext);
   setControlContextData == null ? void 0 : setControlContextData({
     parent: contextProps
@@ -84,7 +82,7 @@ function BaseCheckbox(props) {
       selected: isSelected,
       readonly: isReadOnly
     },
-    updateInteractionVariant
+    updateVariant
   )));
 }
 const makeDefaultCheckboxChildren = ({
@@ -128,7 +126,7 @@ const makeDefaultCheckboxChildren = ({
     ...showDocs ? [
       {
         type: "text",
-        value: "Add interaction variants to see it in action..."
+        value: "Use the registered variants to see it in action..."
       }
     ] : []
   ]
@@ -142,7 +140,7 @@ function registerCheckbox(loader, overrides) {
       displayName: "Aria Checkbox",
       importPath: "@plasmicpkgs/react-aria/skinny/registerCheckbox",
       importName: "BaseCheckbox",
-      interactionVariants,
+      variants,
       props: __spreadProps(__spreadValues({}, common.getCommonProps("checkbox", [
         "name",
         "isDisabled",