@plasmicpkgs/react-aria 0.0.109 → 0.0.110

package/skinny/registerSlider.stories.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"registerSlider.stories.esm.js","sources":["../src/registerSlider.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport { expect, fn, userEvent, within } from \"@storybook/test\";\nimport React, { useState } from \"react\";\nimport { BaseLabel } from \"./registerLabel\";\nimport { BaseSlider } from \"./registerSlider\";\nimport { BaseSliderOutput } from \"./registerSliderOutput\";\nimport { BaseSliderThumb } from \"./registerSliderThumb\";\nimport { BaseSliderTrack } from \"./registerSliderTrack\";\n\n// Single value slider meta\nconst meta: Meta<typeof BaseSlider<number>> = {\n  title: \"Components/BaseSlider\",\n  component: BaseSlider,\n  args: {\n    onChange: fn(),\n    onChangeEnd: fn(),\n    minValue: 0,\n    maxValue: 100,\n    step: 1,\n    orientation: \"horizontal\" as const,\n  },\n  // TODO: Currently, the BaseSlider's defaultValue prop is not handled correctly inside BaseSliderTrack, i.e. it can't be uncontrolled\n  // The render function below assigns the defaultValue prop to the value prop - its needed to keep the BaseSlider controlled\n  // This render function needs to be removed in the PR that fixes the handling of defaultValue in BaseSliderTrack.\n  render: (args) => {\n    const [value, setValue] = useState(args.defaultValue);\n    return (\n      <BaseSlider\n        {...args}\n        value={value}\n        onChange={(newValue) => {\n          setValue(newValue);\n          args.onChange?.(newValue);\n        }}\n      />\n    );\n  },\n};\n\nexport default meta;\ntype Story = StoryObj<typeof BaseSlider<number>>;\n\n// TODO: Currently, BaseSliderTrack does not render any thumbs if there is no value/default value prop\n// The test below needs to be uncommented in the PR that fixes the issue\n// Basic slider with no initial value\n// export const Basic: Story = {\n//     args: {\n//         step: 5,\n//         children: (\n//             <>\n//                 <BaseLabel>Slider label</BaseLabel>\n//                 <BaseSliderOutput>Output</BaseSliderOutput>\n//                 <BaseSliderTrack>\n//                     <BaseSliderThumb autoFocus className={\"thumb-1\"} />\n//                 </BaseSliderTrack>\n//             </>\n//         ),\n//     },\n//     play: async ({ canvasElement, args }) => {\n//         const canvas = within(canvasElement);\n//         const slider = canvas.getByRole(\"group\");\n//         const label = within(slider).getByText(\"Slider label\");\n//         const thumbs = slider.getElementsByTagName(\"input\");\n//         expect(thumbs).toHaveLength(1);\n\n//         await userEvent.click(label); // Focus on the slider thumb\n//         await userEvent.keyboard(\"{ArrowRight}\"); // Move to the right\n\n//         expect(args.onChange).toHaveBeenCalledWith([5]); // defaults to range slider if no value/defaultValue is provided (that's the default react-aria slider component behaviour)\n//         expect(args.onChangeEnd).toHaveBeenCalledOnce();\n//     },\n// };\n\n// Basic slider with no initial value\nexport const WithDefaultValue: Story = {\n  args: {\n    step: 5,\n    defaultValue: 22,\n    children: (\n      <>\n        <BaseLabel>Slider label</BaseLabel>\n        <BaseSliderOutput>Output</BaseSliderOutput>\n        <BaseSliderTrack>\n          <BaseSliderThumb className={\"thumb-1\"} />\n        </BaseSliderTrack>\n      </>\n    ),\n  },\n  play: async ({ canvasElement, args }) => {\n    const canvas = within(canvasElement);\n    const slider = canvas.getByRole(\"group\");\n    const label = within(slider).getByText(\"Slider label\");\n    const thumbs = slider.getElementsByTagName(\"input\");\n    expect(thumbs).toHaveLength(1);\n\n    await userEvent.click(label); // Focus on the slider thumb\n    await userEvent.keyboard(\"{ArrowRight}\"); // Move to the right\n\n    expect(args.onChange).toHaveBeenCalledWith(25);\n    expect(args.onChangeEnd).toHaveBeenCalledOnce();\n  },\n};\n\n// // Disabled slider\nexport const Disabled: Story = {\n  args: {\n    step: 5,\n    defaultValue: 22,\n    isDisabled: true,\n    children: (\n      <>\n        <BaseLabel>Slider label</BaseLabel>\n        <BaseSliderOutput>Output</BaseSliderOutput>\n        <BaseSliderTrack>\n          <BaseSliderThumb className={\"thumb-1\"} />\n        </BaseSliderTrack>\n      </>\n    ),\n  },\n  play: async ({ canvasElement, args }) => {\n    const canvas = within(canvasElement);\n    const slider = canvas.getByRole(\"group\");\n    const label = within(slider).getByText(\"Slider label\");\n    const thumbs = slider.getElementsByTagName(\"input\");\n    expect(thumbs).toHaveLength(1);\n\n    await userEvent.click(label); // Focus on the slider thumb\n    await userEvent.keyboard(\"{ArrowRight}\"); // Move to the right\n\n    expect(args.onChange).not.toHaveBeenCalled();\n    expect(args.onChangeEnd).not.toHaveBeenCalled();\n  },\n};\n\n// Range slider specific stories\ntype RangeStory = StoryObj<typeof BaseSlider<number[]>>;\n\nexport const RangeSlider: RangeStory = {\n  args: {\n    defaultValue: [20, 80],\n    step: 10,\n    children: (\n      <>\n        <BaseLabel>Slider label</BaseLabel>\n        <BaseSliderOutput>Output</BaseSliderOutput>\n        <BaseSliderTrack>\n          <BaseSliderThumb className={\"thumb-1\"} />\n          <BaseSliderThumb className={\"thumb-2\"} />\n        </BaseSliderTrack>\n      </>\n    ),\n  },\n  play: async ({ canvasElement, args }) => {\n    const canvas = within(canvasElement);\n    const slider = canvas.getByRole(\"group\");\n    const label = within(slider).getByText(\"Slider label\");\n    const thumbs = slider.getElementsByTagName(\"input\");\n\n    expect(thumbs).toHaveLength(2);\n\n    expect(slider.querySelector(\".thumb-1\")).toBeInTheDocument();\n    expect(slider.querySelector(\".thumb-2\")).toBeInTheDocument();\n\n    await userEvent.click(label);\n    await userEvent.keyboard(\"{ArrowLeft}\");\n    expect(args.onChange).toHaveBeenCalledWith([10, 80]);\n    await userEvent.tab();\n    await userEvent.keyboard(\"{ArrowRight}\");\n\n    expect(args.onChange).toHaveBeenCalledWith([10, 90]);\n  },\n};\n\nexport const TooFewThumbs: RangeStory = {\n  args: {\n    defaultValue: [20, 47, 80],\n    step: 10,\n    children: (\n      <>\n        <BaseLabel>Slider label</BaseLabel>\n        <BaseSliderOutput>Output</BaseSliderOutput>\n        <BaseSliderTrack>\n          <BaseSliderThumb className={\"thumb-1\"} />\n          <BaseSliderThumb className={\"thumb-2\"} />\n        </BaseSliderTrack>\n      </>\n    ),\n  },\n  play: async ({ canvasElement, args }) => {\n    const canvas = within(canvasElement);\n    const slider = canvas.getByRole(\"group\");\n    const label = within(slider).getByText(\"Slider label\");\n    const thumbs = slider.getElementsByTagName(\"input\");\n\n    expect(thumbs).toHaveLength(3);\n\n    expect(slider.querySelectorAll(\".thumb-1\")).toHaveLength(1);\n    expect(slider.querySelectorAll(\".thumb-2\")).toHaveLength(2);\n\n    await userEvent.click(label);\n    await userEvent.keyboard(\"{ArrowLeft}\");\n    expect(args.onChange).toHaveBeenCalledWith([10, 50, 80]); // all values adjusted to the step (47 -> 50)\n\n    await userEvent.tab();\n    await userEvent.keyboard(\"{ArrowRight}\");\n\n    expect(args.onChange).toHaveBeenCalledWith([10, 60, 80]);\n  },\n};\n\nexport const TooManyThumbs: RangeStory = {\n  args: {\n    defaultValue: [20, 80],\n    step: 10,\n    children: (\n      <>\n        <BaseLabel>Slider label</BaseLabel>\n        <BaseSliderOutput>Range: 20-80</BaseSliderOutput>\n        <BaseSliderTrack>\n          <BaseSliderThumb className={\"thumb-1\"} />\n          <BaseSliderThumb className={\"thumb-2\"} />\n          <BaseSliderThumb className={\"thumb-3\"} />\n        </BaseSliderTrack>\n      </>\n    ),\n  },\n  play: async ({ canvasElement, args }) => {\n    const canvas = within(canvasElement);\n    const slider = canvas.getByRole(\"group\");\n    const label = within(slider).getByText(\"Slider label\");\n    const thumbs = slider.getElementsByTagName(\"input\");\n\n    expect(thumbs).toHaveLength(2);\n\n    expect(slider.querySelectorAll(\".thumb-1\")).toHaveLength(1);\n    expect(slider.querySelectorAll(\".thumb-2\")).toHaveLength(1);\n    expect(slider.querySelectorAll(\".thumb-3\")).toHaveLength(0); // unused, because there are 3 thumbs but only 2 values\n\n    await userEvent.click(label);\n    await userEvent.keyboard(\"{ArrowLeft}\");\n    expect(args.onChange).toHaveBeenCalledWith([10, 80]);\n\n    await userEvent.tab();\n    await userEvent.keyboard(\"{ArrowRight}\");\n\n    expect(args.onChange).toHaveBeenCalledWith([10, 90]);\n  },\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"registerSlider.stories.esm.js","sources":["../src/registerSlider.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport { expect, fn, userEvent, within } from \"@storybook/test\";\nimport React from \"react\";\nimport { BaseLabel } from \"./registerLabel\";\nimport { BaseSlider } from \"./registerSlider\";\nimport { BaseSliderOutput } from \"./registerSliderOutput\";\nimport { BaseSliderThumb } from \"./registerSliderThumb\";\nimport { BaseSliderTrack } from \"./registerSliderTrack\";\n\n// Single value slider meta\nconst meta: Meta<typeof BaseSlider<number>> = {\n  title: \"Components/BaseSlider\",\n  component: BaseSlider,\n  args: {\n    onChange: fn(),\n    onChangeEnd: fn(),\n    minValue: 0,\n    maxValue: 100,\n    step: 1,\n    orientation: \"horizontal\" as const,\n  },\n};\n\nexport default meta;\ntype Story = StoryObj<typeof BaseSlider<number>>;\n\n// Basic slider with no initial value\nexport const Basic: Story = {\n  args: {\n    children: (\n      <>\n        <BaseLabel>Slider label</BaseLabel>\n        <BaseSliderOutput>Output</BaseSliderOutput>\n        <BaseSliderTrack>\n          <BaseSliderThumb autoFocus className={\"thumb-1\"} />\n        </BaseSliderTrack>\n      </>\n    ),\n  },\n  play: async ({ canvasElement, args }) => {\n    const canvas = within(canvasElement);\n    const slider = canvas.getByRole(\"group\");\n    const label = within(slider).getByText(\"Slider label\");\n    const thumbs = slider.getElementsByTagName(\"input\");\n    expect(thumbs).toHaveLength(1);\n\n    await userEvent.click(label); // Focus on the slider thumb\n    await userEvent.keyboard(\"{ArrowRight}\"); // Move to the right\n\n    expect(args.onChange).toHaveBeenCalledWith([1]); // defaults to range slider if no value/defaultValue is provided (that's the default react-aria slider component behaviour)\n    expect(args.onChangeEnd).toHaveBeenCalledOnce();\n  },\n};\n\n// Basic slider with no initial value\nexport const WithDefaultValue: Story = {\n  args: {\n    step: 5,\n    defaultValue: 22,\n    children: (\n      <>\n        <BaseLabel>Slider label</BaseLabel>\n        <BaseSliderOutput>Output</BaseSliderOutput>\n        <BaseSliderTrack>\n          <BaseSliderThumb className={\"thumb-1\"} />\n        </BaseSliderTrack>\n      </>\n    ),\n  },\n  play: async ({ canvasElement, args }) => {\n    const canvas = within(canvasElement);\n    const slider = canvas.getByRole(\"group\");\n    const label = within(slider).getByText(\"Slider label\");\n    const thumbs = slider.getElementsByTagName(\"input\");\n    expect(thumbs).toHaveLength(1);\n\n    await userEvent.click(label); // Focus on the slider thumb\n    await userEvent.keyboard(\"{ArrowRight}\"); // Move to the right\n\n    expect(args.onChange).toHaveBeenCalledWith(25);\n    expect(args.onChangeEnd).toHaveBeenCalledOnce();\n  },\n};\n\n// // Disabled slider\nexport const Disabled: Story = {\n  args: {\n    step: 5,\n    defaultValue: 22,\n    isDisabled: true,\n    children: (\n      <>\n        <BaseLabel>Slider label</BaseLabel>\n        <BaseSliderOutput>Output</BaseSliderOutput>\n        <BaseSliderTrack>\n          <BaseSliderThumb className={\"thumb-1\"} />\n        </BaseSliderTrack>\n      </>\n    ),\n  },\n  play: async ({ canvasElement, args }) => {\n    const canvas = within(canvasElement);\n    const slider = canvas.getByRole(\"group\");\n    const label = within(slider).getByText(\"Slider label\");\n    const thumbs = slider.getElementsByTagName(\"input\");\n    expect(thumbs).toHaveLength(1);\n\n    await userEvent.click(label); // Focus on the slider thumb\n    await userEvent.keyboard(\"{ArrowRight}\"); // Move to the right\n\n    expect(args.onChange).not.toHaveBeenCalled();\n    expect(args.onChangeEnd).not.toHaveBeenCalled();\n  },\n};\n\n// Range slider specific stories\ntype RangeStory = StoryObj<typeof BaseSlider<number[]>>;\n\nexport const RangeSlider: RangeStory = {\n  args: {\n    defaultValue: [20, 80],\n    step: 10,\n    children: (\n      <>\n        <BaseLabel>Slider label</BaseLabel>\n        <BaseSliderOutput>Output</BaseSliderOutput>\n        <BaseSliderTrack>\n          <BaseSliderThumb className={\"thumb-1\"} />\n          <BaseSliderThumb className={\"thumb-2\"} />\n        </BaseSliderTrack>\n      </>\n    ),\n  },\n  play: async ({ canvasElement, args }) => {\n    const canvas = within(canvasElement);\n    const slider = canvas.getByRole(\"group\");\n    const label = within(slider).getByText(\"Slider label\");\n    const thumbs = slider.getElementsByTagName(\"input\");\n\n    expect(thumbs).toHaveLength(2);\n\n    expect(slider.querySelector(\".thumb-1\")).toBeInTheDocument();\n    expect(slider.querySelector(\".thumb-2\")).toBeInTheDocument();\n\n    await userEvent.click(label);\n    await userEvent.keyboard(\"{ArrowLeft}\");\n    expect(args.onChange).toHaveBeenCalledWith([10, 80]);\n    await userEvent.tab();\n    await userEvent.keyboard(\"{ArrowRight}\");\n\n    expect(args.onChange).toHaveBeenCalledWith([10, 90]);\n  },\n};\n\nexport const TooFewThumbs: RangeStory = {\n  args: {\n    defaultValue: [20, 47, 80],\n    step: 10,\n    children: (\n      <>\n        <BaseLabel>Slider label</BaseLabel>\n        <BaseSliderOutput>Output</BaseSliderOutput>\n        <BaseSliderTrack>\n          <BaseSliderThumb className={\"thumb-1\"} />\n          <BaseSliderThumb className={\"thumb-2\"} />\n        </BaseSliderTrack>\n      </>\n    ),\n  },\n  play: async ({ canvasElement, args }) => {\n    const canvas = within(canvasElement);\n    const slider = canvas.getByRole(\"group\");\n    const label = within(slider).getByText(\"Slider label\");\n    const thumbs = slider.getElementsByTagName(\"input\");\n\n    expect(thumbs).toHaveLength(3);\n\n    expect(slider.querySelectorAll(\".thumb-1\")).toHaveLength(1);\n    expect(slider.querySelectorAll(\".thumb-2\")).toHaveLength(2);\n\n    await userEvent.click(label);\n    await userEvent.keyboard(\"{ArrowLeft}\");\n    expect(args.onChange).toHaveBeenCalledWith([10, 50, 80]); // all values adjusted to the step (47 -> 50)\n\n    await userEvent.tab();\n    await userEvent.keyboard(\"{ArrowRight}\");\n\n    expect(args.onChange).toHaveBeenCalledWith([10, 60, 80]);\n  },\n};\n\nexport const TooManyThumbs: RangeStory = {\n  args: {\n    defaultValue: [20, 80],\n    step: 10,\n    children: (\n      <>\n        <BaseLabel>Slider label</BaseLabel>\n        <BaseSliderOutput>Range: 20-80</BaseSliderOutput>\n        <BaseSliderTrack>\n          <BaseSliderThumb className={\"thumb-1\"} />\n          <BaseSliderThumb className={\"thumb-2\"} />\n          <BaseSliderThumb className={\"thumb-3\"} />\n        </BaseSliderTrack>\n      </>\n    ),\n  },\n  play: async ({ canvasElement, args }) => {\n    const canvas = within(canvasElement);\n    const slider = canvas.getByRole(\"group\");\n    const label = within(slider).getByText(\"Slider label\");\n    const thumbs = slider.getElementsByTagName(\"input\");\n\n    expect(thumbs).toHaveLength(2);\n\n    expect(slider.querySelectorAll(\".thumb-1\")).toHaveLength(1);\n    expect(slider.querySelectorAll(\".thumb-2\")).toHaveLength(1);\n    expect(slider.querySelectorAll(\".thumb-3\")).toHaveLength(0); // unused, because there are 3 thumbs but only 2 values\n\n    await userEvent.click(label);\n    await userEvent.keyboard(\"{ArrowLeft}\");\n    expect(args.onChange).toHaveBeenCalledWith([10, 80]);\n\n    await userEvent.tab();\n    await userEvent.keyboard(\"{ArrowRight}\");\n\n    expect(args.onChange).toHaveBeenCalledWith([10, 90]);\n  },\n};\n"],"names":[],"mappings":"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"}

package/skinny/registerSliderTrack.cjs.js

@@ -51,10 +51,12 @@ function isMultiValueGuard(value) {
   return Array.isArray(value) && value.length > 1;
 }
 function BaseSliderTrack(props) {
+  var _b;
   const context = React__default.default.useContext(contexts.PlasmicSliderContext);
   const isStandalone = !context;
   const _a = props, { children, progressBar, plasmicUpdateVariant } = _a, rest = __objRest(_a, ["children", "progressBar", "plasmicUpdateVariant"]);
-  const thumbsLength = context && isMultiValueGuard(context.value) ? context.value.length : 1;
+  const value = (_b = context == null ? void 0 : context.value) != null ? _b : context == null ? void 0 : context.defaultValue;
+  const thumbsLength = isMultiValueGuard(value) ? value.length : 1;
   const isMultiValue = thumbsLength > 1;
   const { minIndex, maxIndex } = React.useMemo(() => {
     if (thumbsLength <= 1) {
@@ -64,10 +66,10 @@ function BaseSliderTrack(props) {
   }, [thumbsLength]);
   const thumbs = React.useMemo(() => {
     const thumbNodes = flattenChildren__default.default(children);
-    if (!thumbNodes || thumbNodes.length === 0 || !utils.isDefined(context == null ? void 0 : context.value)) {
+    if (!thumbNodes || thumbNodes.length === 0) {
       return [];
     }
-    const values = utils.isDefined(context) ? Array.isArray(context.value) ? context.value : [context.value] : [];
+    const values = utils.isDefined(context) ? Array.isArray(value) ? value : [value] : [];
     const lastThumb = thumbNodes[thumbNodes.length - 1];
     return values.map((v, i) => {
       const currentThumb = thumbNodes[i];
@@ -85,7 +87,7 @@ function BaseSliderTrack(props) {
         index: i
       });
     });
-  }, [children, context == null ? void 0 : context.value]);
+  }, [children, value]);
   const track = /* @__PURE__ */ React__default.default.createElement(reactAriaComponents.SliderTrack, __spreadValues({ style: { position: "relative" } }, rest), ({ state, isHovered }) => /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, withObservedValues(
     /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, /* @__PURE__ */ React__default.default.createElement(
       "div",

package/skinny/registerSliderTrack.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"registerSliderTrack.cjs.js","sources":["../src/registerSliderTrack.tsx"],"sourcesContent":["import { CodeComponentMeta } from \"@plasmicapp/host\";\nimport React, { useMemo } from \"react\";\nimport { Slider, SliderThumbProps, SliderTrack } from \"react-aria-components\";\nimport flattenChildren from \"react-keyed-flatten-children\";\nimport { COMMON_STYLES } from \"./common\";\nimport { PlasmicSliderContext } from \"./contexts\";\nimport { BaseSliderThumbProps } from \"./registerSliderThumb\";\nimport {\n  CodeComponentMetaOverrides,\n  Registerable,\n  isDefined,\n  makeComponentName,\n  registerComponentHelper,\n} from \"./utils\";\nimport { WithVariants, pickAriaComponentVariants } from \"./variant-utils\";\n\nconst SLIDER_TRACK_VARIANTS = [\"hovered\" as const];\n\nconst { variants, withObservedValues } = pickAriaComponentVariants(\n  SLIDER_TRACK_VARIANTS\n);\n\nexport interface BaseSliderTrackProps\n  extends React.ComponentProps<typeof SliderTrack>,\n    WithVariants<typeof SLIDER_TRACK_VARIANTS> {\n  progressBar?: React.ReactNode;\n  children?: React.ReactNode;\n}\n\nfunction isMultiValueGuard(value?: number | number[]): value is number[] {\n  return Array.isArray(value) && value.length > 1;\n}\n\nexport function BaseSliderTrack(props: BaseSliderTrackProps) {\n  const context = React.useContext(PlasmicSliderContext);\n  const isStandalone = !context;\n  const { children, progressBar, plasmicUpdateVariant, ...rest } = props;\n\n  const thumbsLength =\n    context && isMultiValueGuard(context.value) ? context.value.length : 1;\n  const isMultiValue = thumbsLength > 1;\n\n  const { minIndex, maxIndex } = useMemo(() => {\n    if (thumbsLength <= 1) {\n      return { minIndex: 0, maxIndex: 0 };\n    }\n    return { minIndex: 0, maxIndex: thumbsLength - 1 };\n  }, [thumbsLength]);\n\n  /**\n   * Generates the thumb components based on the number of thumbs\n   * and the number of values in the slider\n   *\n   * If the number of thumbs is less than the number of values, then\n   * the last thumb is repeated for the remaining values\n   *\n   * If the number of thumbs is greater than the number of values, then\n   * the additional thumbs are omitted\n   */\n  const thumbs = useMemo(() => {\n    const thumbNodes = flattenChildren(children);\n    if (!thumbNodes || thumbNodes.length === 0 || !isDefined(context?.value)) {\n      return [];\n    }\n\n    const values = isDefined(context)\n      ? Array.isArray(context.value)\n        ? context.value\n        : [context.value]\n      : [];\n\n    // Last thumb be re-used if the number of thumbs is less than the number of values\n    const lastThumb = thumbNodes[thumbNodes.length - 1];\n\n    return values.map((v, i) => {\n      const currentThumb = thumbNodes[i];\n      // Re-use the last thumb if there are no more thumbs left ( this is for ease of use - the user can just add one more value to the initial-values array and see another thumb right away, without having to explicitly add a new thumb component )\n      if (i >= thumbNodes.length) {\n        if (React.isValidElement(lastThumb)) {\n          return React.cloneElement(lastThumb, {\n            index: i,\n          } as SliderThumbProps);\n        }\n      }\n      if (!React.isValidElement(currentThumb)) {\n        return null;\n      }\n      return React.cloneElement(currentThumb, {\n        index: i,\n      } as SliderThumbProps);\n    });\n  }, [children, context?.value]);\n\n  const track = (\n    <SliderTrack style={{ position: \"relative\" }} {...rest}>\n      {({ state, isHovered }) => (\n        <>\n          {withObservedValues(\n            <>\n              <div\n                style={{\n                  width: `${\n                    (!isMultiValue\n                      ? state.getThumbPercent(minIndex)\n                      : state.getThumbPercent(maxIndex) -\n                        state.getThumbPercent(minIndex)) * 100\n                  }%`,\n                  height: \"100%\",\n                  position: \"absolute\",\n                  top: 0,\n                  left: !isMultiValue\n                    ? 0\n                    : state.getThumbPercent(minIndex) * 100 + \"%\",\n                }}\n              >\n                {progressBar}\n              </div>\n              {thumbs}\n            </>,\n            {\n              hovered: isHovered,\n            },\n            plasmicUpdateVariant\n          )}\n        </>\n      )}\n    </SliderTrack>\n  );\n\n  if (isStandalone) {\n    return (\n      <Slider style={{ height: \"100%\", width: \"100%\", ...COMMON_STYLES }}>\n        {track}\n      </Slider>\n    );\n  }\n\n  return track;\n}\n\nexport const SLIDER_TRACK_COMPONENT_NAME = makeComponentName(\"sliderTrack\");\n\nexport function registerSliderTrack(\n  sliderThumbMeta: CodeComponentMeta<BaseSliderThumbProps>,\n  loader?: Registerable,\n  overrides?: CodeComponentMetaOverrides<typeof BaseSliderTrack>\n) {\n  return registerComponentHelper(\n    loader,\n    BaseSliderTrack,\n    {\n      name: SLIDER_TRACK_COMPONENT_NAME,\n      displayName: \"Aria Slider Track\",\n      importPath: \"@plasmicpkgs/react-aria/skinny/registerSliderTrack\",\n      importName: \"BaseSliderTrack\",\n      variants,\n      defaultStyles: {\n        width: \"stretch\",\n        backgroundColor: \"#aaa\",\n        position: \"relative\",\n        height: \"10px\",\n        padding: 0,\n      },\n      props: {\n        children: {\n          type: \"slot\",\n          /**\n           * NOTE: We don't merge with parent here, because we want to allow the user to select the thumbs without having to first select the slider track.\n           * Also, there can be more than one thumbs (e.g. in a range slider), but `mergeWithParent` only shows prop controls of the slot content if there is only one direct descendant of the slot.\n           * */\n          // mergeWithParent: true,\n          displayName: \"Thumbs\",\n          description:\n            \"The thumbs of the slider. For range slider, you can add more than one thumb.\",\n          allowedComponents: [sliderThumbMeta.name],\n          allowRootWrapper: true,\n          defaultValue: [\n            {\n              type: \"component\",\n              name: sliderThumbMeta.name,\n            },\n          ],\n        },\n        progressBar: {\n          type: \"slot\",\n          mergeWithParent: true,\n          displayName: \"Progress Bar\",\n          defaultValue: [\n            {\n              type: \"box\",\n              styles: {\n                height: \"100%\",\n                width: \"100%\",\n                backgroundColor: \"#ffa6a6\",\n                padding: 0,\n              },\n            },\n          ],\n        },\n        onHoverStart: {\n          type: \"eventHandler\",\n          argTypes: [{ name: \"event\", type: \"object\" }],\n        },\n        onHoverEnd: {\n          type: \"eventHandler\",\n          argTypes: [{ name: \"event\", type: \"object\" }],\n        },\n        onHoverChange: {\n          type: \"eventHandler\",\n          argTypes: [{ name: \"isHovering\", type: \"boolean\" }],\n        },\n      },\n    },\n    overrides\n  );\n}\n"],"names":["pickAriaComponentVariants","React","PlasmicSliderContext","useMemo","flattenChildren","isDefined","SliderTrack","Slider","COMMON_STYLES","makeComponentName","registerComponentHelper"],"mappings":"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"}
+{"version":3,"file":"registerSliderTrack.cjs.js","sources":["../src/registerSliderTrack.tsx"],"sourcesContent":["import { CodeComponentMeta } from \"@plasmicapp/host\";\nimport React, { useMemo } from \"react\";\nimport { Slider, SliderThumbProps, SliderTrack } from \"react-aria-components\";\nimport flattenChildren from \"react-keyed-flatten-children\";\nimport { COMMON_STYLES } from \"./common\";\nimport { PlasmicSliderContext } from \"./contexts\";\nimport { BaseSliderThumbProps } from \"./registerSliderThumb\";\nimport {\n  CodeComponentMetaOverrides,\n  Registerable,\n  isDefined,\n  makeComponentName,\n  registerComponentHelper,\n} from \"./utils\";\nimport { WithVariants, pickAriaComponentVariants } from \"./variant-utils\";\n\nconst SLIDER_TRACK_VARIANTS = [\"hovered\" as const];\n\nconst { variants, withObservedValues } = pickAriaComponentVariants(\n  SLIDER_TRACK_VARIANTS\n);\n\nexport interface BaseSliderTrackProps\n  extends React.ComponentProps<typeof SliderTrack>,\n    WithVariants<typeof SLIDER_TRACK_VARIANTS> {\n  progressBar?: React.ReactNode;\n  children?: React.ReactNode;\n}\n\nfunction isMultiValueGuard(value?: number | number[]): value is number[] {\n  return Array.isArray(value) && value.length > 1;\n}\n\nexport function BaseSliderTrack(props: BaseSliderTrackProps) {\n  const context = React.useContext(PlasmicSliderContext);\n  const isStandalone = !context;\n  const { children, progressBar, plasmicUpdateVariant, ...rest } = props;\n  const value = context?.value ?? context?.defaultValue;\n  const thumbsLength = isMultiValueGuard(value) ? value.length : 1;\n\n  const isMultiValue = thumbsLength > 1;\n\n  const { minIndex, maxIndex } = useMemo(() => {\n    if (thumbsLength <= 1) {\n      return { minIndex: 0, maxIndex: 0 };\n    }\n    return { minIndex: 0, maxIndex: thumbsLength - 1 };\n  }, [thumbsLength]);\n\n  /**\n   * Generates the thumb components based on the number of thumbs\n   * and the number of values in the slider\n   *\n   * If the number of thumbs is less than the number of values, then\n   * the last thumb is repeated for the remaining values\n   *\n   * If the number of thumbs is greater than the number of values, then\n   * the additional thumbs are omitted\n   */\n  const thumbs = useMemo(() => {\n    const thumbNodes = flattenChildren(children);\n    if (!thumbNodes || thumbNodes.length === 0) {\n      return [];\n    }\n\n    const values = isDefined(context)\n      ? Array.isArray(value)\n        ? value\n        : [value]\n      : [];\n\n    // Last thumb be re-used if the number of thumbs is less than the number of values\n    const lastThumb = thumbNodes[thumbNodes.length - 1];\n\n    return values.map((v, i) => {\n      const currentThumb = thumbNodes[i];\n      // Re-use the last thumb if there are no more thumbs left ( this is for ease of use - the user can just add one more value to the initial-values array and see another thumb right away, without having to explicitly add a new thumb component )\n      if (i >= thumbNodes.length) {\n        if (React.isValidElement(lastThumb)) {\n          return React.cloneElement(lastThumb, {\n            index: i,\n          } as SliderThumbProps);\n        }\n      }\n      if (!React.isValidElement(currentThumb)) {\n        return null;\n      }\n      return React.cloneElement(currentThumb, {\n        index: i,\n      } as SliderThumbProps);\n    });\n  }, [children, value]);\n\n  const track = (\n    <SliderTrack style={{ position: \"relative\" }} {...rest}>\n      {({ state, isHovered }) => (\n        <>\n          {withObservedValues(\n            <>\n              <div\n                style={{\n                  width: `${\n                    (!isMultiValue\n                      ? state.getThumbPercent(minIndex)\n                      : state.getThumbPercent(maxIndex) -\n                        state.getThumbPercent(minIndex)) * 100\n                  }%`,\n                  height: \"100%\",\n                  position: \"absolute\",\n                  top: 0,\n                  left: !isMultiValue\n                    ? 0\n                    : state.getThumbPercent(minIndex) * 100 + \"%\",\n                }}\n              >\n                {progressBar}\n              </div>\n              {thumbs}\n            </>,\n            {\n              hovered: isHovered,\n            },\n            plasmicUpdateVariant\n          )}\n        </>\n      )}\n    </SliderTrack>\n  );\n\n  if (isStandalone) {\n    return (\n      <Slider style={{ height: \"100%\", width: \"100%\", ...COMMON_STYLES }}>\n        {track}\n      </Slider>\n    );\n  }\n\n  return track;\n}\n\nexport const SLIDER_TRACK_COMPONENT_NAME = makeComponentName(\"sliderTrack\");\n\nexport function registerSliderTrack(\n  sliderThumbMeta: CodeComponentMeta<BaseSliderThumbProps>,\n  loader?: Registerable,\n  overrides?: CodeComponentMetaOverrides<typeof BaseSliderTrack>\n) {\n  return registerComponentHelper(\n    loader,\n    BaseSliderTrack,\n    {\n      name: SLIDER_TRACK_COMPONENT_NAME,\n      displayName: \"Aria Slider Track\",\n      importPath: \"@plasmicpkgs/react-aria/skinny/registerSliderTrack\",\n      importName: \"BaseSliderTrack\",\n      variants,\n      defaultStyles: {\n        width: \"stretch\",\n        backgroundColor: \"#aaa\",\n        position: \"relative\",\n        height: \"10px\",\n        padding: 0,\n      },\n      props: {\n        children: {\n          type: \"slot\",\n          /**\n           * NOTE: We don't merge with parent here, because we want to allow the user to select the thumbs without having to first select the slider track.\n           * Also, there can be more than one thumbs (e.g. in a range slider), but `mergeWithParent` only shows prop controls of the slot content if there is only one direct descendant of the slot.\n           * */\n          // mergeWithParent: true,\n          displayName: \"Thumbs\",\n          description:\n            \"The thumbs of the slider. For range slider, you can add more than one thumb.\",\n          allowedComponents: [sliderThumbMeta.name],\n          allowRootWrapper: true,\n          defaultValue: [\n            {\n              type: \"component\",\n              name: sliderThumbMeta.name,\n            },\n          ],\n        },\n        progressBar: {\n          type: \"slot\",\n          mergeWithParent: true,\n          displayName: \"Progress Bar\",\n          defaultValue: [\n            {\n              type: \"box\",\n              styles: {\n                height: \"100%\",\n                width: \"100%\",\n                backgroundColor: \"#ffa6a6\",\n                padding: 0,\n              },\n            },\n          ],\n        },\n        onHoverStart: {\n          type: \"eventHandler\",\n          argTypes: [{ name: \"event\", type: \"object\" }],\n        },\n        onHoverEnd: {\n          type: \"eventHandler\",\n          argTypes: [{ name: \"event\", type: \"object\" }],\n        },\n        onHoverChange: {\n          type: \"eventHandler\",\n          argTypes: [{ name: \"isHovering\", type: \"boolean\" }],\n        },\n      },\n    },\n    overrides\n  );\n}\n"],"names":["pickAriaComponentVariants","React","PlasmicSliderContext","useMemo","flattenChildren","isDefined","SliderTrack","Slider","COMMON_STYLES","makeComponentName","registerComponentHelper"],"mappings":"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"}

package/skinny/registerSliderTrack.esm.js

@@ -3,7 +3,7 @@ import { SliderTrack, Slider } from 'react-aria-components';
 import flattenChildren from 'react-keyed-flatten-children';
 import { C as COMMON_STYLES } from './common-ceebbaea.esm.js';
 import { f as PlasmicSliderContext } from './contexts-5cb81c2f.esm.js';
-import { i as isDefined, m as makeComponentName, r as registerComponentHelper } from './utils-5d1b4c6b.esm.js';
+import { m as makeComponentName, r as registerComponentHelper, i as isDefined } from './utils-5d1b4c6b.esm.js';
 import { p as pickAriaComponentVariants } from './variant-utils-4405ebb0.esm.js';
 import '@plasmicapp/host';
 import '@plasmicapp/host/registerComponent';
@@ -44,10 +44,12 @@ function isMultiValueGuard(value) {
   return Array.isArray(value) && value.length > 1;
 }
 function BaseSliderTrack(props) {
+  var _b;
   const context = React.useContext(PlasmicSliderContext);
   const isStandalone = !context;
   const _a = props, { children, progressBar, plasmicUpdateVariant } = _a, rest = __objRest(_a, ["children", "progressBar", "plasmicUpdateVariant"]);
-  const thumbsLength = context && isMultiValueGuard(context.value) ? context.value.length : 1;
+  const value = (_b = context == null ? void 0 : context.value) != null ? _b : context == null ? void 0 : context.defaultValue;
+  const thumbsLength = isMultiValueGuard(value) ? value.length : 1;
   const isMultiValue = thumbsLength > 1;
   const { minIndex, maxIndex } = useMemo(() => {
     if (thumbsLength <= 1) {
@@ -57,10 +59,10 @@ function BaseSliderTrack(props) {
   }, [thumbsLength]);
   const thumbs = useMemo(() => {
     const thumbNodes = flattenChildren(children);
-    if (!thumbNodes || thumbNodes.length === 0 || !isDefined(context == null ? void 0 : context.value)) {
+    if (!thumbNodes || thumbNodes.length === 0) {
       return [];
     }
-    const values = isDefined(context) ? Array.isArray(context.value) ? context.value : [context.value] : [];
+    const values = isDefined(context) ? Array.isArray(value) ? value : [value] : [];
     const lastThumb = thumbNodes[thumbNodes.length - 1];
     return values.map((v, i) => {
       const currentThumb = thumbNodes[i];
@@ -78,7 +80,7 @@ function BaseSliderTrack(props) {
         index: i
       });
     });
-  }, [children, context == null ? void 0 : context.value]);
+  }, [children, value]);
   const track = /* @__PURE__ */ React.createElement(SliderTrack, __spreadValues({ style: { position: "relative" } }, rest), ({ state, isHovered }) => /* @__PURE__ */ React.createElement(React.Fragment, null, withObservedValues(
     /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
       "div",

package/skinny/registerSliderTrack.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"registerSliderTrack.esm.js","sources":["../src/registerSliderTrack.tsx"],"sourcesContent":["import { CodeComponentMeta } from \"@plasmicapp/host\";\nimport React, { useMemo } from \"react\";\nimport { Slider, SliderThumbProps, SliderTrack } from \"react-aria-components\";\nimport flattenChildren from \"react-keyed-flatten-children\";\nimport { COMMON_STYLES } from \"./common\";\nimport { PlasmicSliderContext } from \"./contexts\";\nimport { BaseSliderThumbProps } from \"./registerSliderThumb\";\nimport {\n  CodeComponentMetaOverrides,\n  Registerable,\n  isDefined,\n  makeComponentName,\n  registerComponentHelper,\n} from \"./utils\";\nimport { WithVariants, pickAriaComponentVariants } from \"./variant-utils\";\n\nconst SLIDER_TRACK_VARIANTS = [\"hovered\" as const];\n\nconst { variants, withObservedValues } = pickAriaComponentVariants(\n  SLIDER_TRACK_VARIANTS\n);\n\nexport interface BaseSliderTrackProps\n  extends React.ComponentProps<typeof SliderTrack>,\n    WithVariants<typeof SLIDER_TRACK_VARIANTS> {\n  progressBar?: React.ReactNode;\n  children?: React.ReactNode;\n}\n\nfunction isMultiValueGuard(value?: number | number[]): value is number[] {\n  return Array.isArray(value) && value.length > 1;\n}\n\nexport function BaseSliderTrack(props: BaseSliderTrackProps) {\n  const context = React.useContext(PlasmicSliderContext);\n  const isStandalone = !context;\n  const { children, progressBar, plasmicUpdateVariant, ...rest } = props;\n\n  const thumbsLength =\n    context && isMultiValueGuard(context.value) ? context.value.length : 1;\n  const isMultiValue = thumbsLength > 1;\n\n  const { minIndex, maxIndex } = useMemo(() => {\n    if (thumbsLength <= 1) {\n      return { minIndex: 0, maxIndex: 0 };\n    }\n    return { minIndex: 0, maxIndex: thumbsLength - 1 };\n  }, [thumbsLength]);\n\n  /**\n   * Generates the thumb components based on the number of thumbs\n   * and the number of values in the slider\n   *\n   * If the number of thumbs is less than the number of values, then\n   * the last thumb is repeated for the remaining values\n   *\n   * If the number of thumbs is greater than the number of values, then\n   * the additional thumbs are omitted\n   */\n  const thumbs = useMemo(() => {\n    const thumbNodes = flattenChildren(children);\n    if (!thumbNodes || thumbNodes.length === 0 || !isDefined(context?.value)) {\n      return [];\n    }\n\n    const values = isDefined(context)\n      ? Array.isArray(context.value)\n        ? context.value\n        : [context.value]\n      : [];\n\n    // Last thumb be re-used if the number of thumbs is less than the number of values\n    const lastThumb = thumbNodes[thumbNodes.length - 1];\n\n    return values.map((v, i) => {\n      const currentThumb = thumbNodes[i];\n      // Re-use the last thumb if there are no more thumbs left ( this is for ease of use - the user can just add one more value to the initial-values array and see another thumb right away, without having to explicitly add a new thumb component )\n      if (i >= thumbNodes.length) {\n        if (React.isValidElement(lastThumb)) {\n          return React.cloneElement(lastThumb, {\n            index: i,\n          } as SliderThumbProps);\n        }\n      }\n      if (!React.isValidElement(currentThumb)) {\n        return null;\n      }\n      return React.cloneElement(currentThumb, {\n        index: i,\n      } as SliderThumbProps);\n    });\n  }, [children, context?.value]);\n\n  const track = (\n    <SliderTrack style={{ position: \"relative\" }} {...rest}>\n      {({ state, isHovered }) => (\n        <>\n          {withObservedValues(\n            <>\n              <div\n                style={{\n                  width: `${\n                    (!isMultiValue\n                      ? state.getThumbPercent(minIndex)\n                      : state.getThumbPercent(maxIndex) -\n                        state.getThumbPercent(minIndex)) * 100\n                  }%`,\n                  height: \"100%\",\n                  position: \"absolute\",\n                  top: 0,\n                  left: !isMultiValue\n                    ? 0\n                    : state.getThumbPercent(minIndex) * 100 + \"%\",\n                }}\n              >\n                {progressBar}\n              </div>\n              {thumbs}\n            </>,\n            {\n              hovered: isHovered,\n            },\n            plasmicUpdateVariant\n          )}\n        </>\n      )}\n    </SliderTrack>\n  );\n\n  if (isStandalone) {\n    return (\n      <Slider style={{ height: \"100%\", width: \"100%\", ...COMMON_STYLES }}>\n        {track}\n      </Slider>\n    );\n  }\n\n  return track;\n}\n\nexport const SLIDER_TRACK_COMPONENT_NAME = makeComponentName(\"sliderTrack\");\n\nexport function registerSliderTrack(\n  sliderThumbMeta: CodeComponentMeta<BaseSliderThumbProps>,\n  loader?: Registerable,\n  overrides?: CodeComponentMetaOverrides<typeof BaseSliderTrack>\n) {\n  return registerComponentHelper(\n    loader,\n    BaseSliderTrack,\n    {\n      name: SLIDER_TRACK_COMPONENT_NAME,\n      displayName: \"Aria Slider Track\",\n      importPath: \"@plasmicpkgs/react-aria/skinny/registerSliderTrack\",\n      importName: \"BaseSliderTrack\",\n      variants,\n      defaultStyles: {\n        width: \"stretch\",\n        backgroundColor: \"#aaa\",\n        position: \"relative\",\n        height: \"10px\",\n        padding: 0,\n      },\n      props: {\n        children: {\n          type: \"slot\",\n          /**\n           * NOTE: We don't merge with parent here, because we want to allow the user to select the thumbs without having to first select the slider track.\n           * Also, there can be more than one thumbs (e.g. in a range slider), but `mergeWithParent` only shows prop controls of the slot content if there is only one direct descendant of the slot.\n           * */\n          // mergeWithParent: true,\n          displayName: \"Thumbs\",\n          description:\n            \"The thumbs of the slider. For range slider, you can add more than one thumb.\",\n          allowedComponents: [sliderThumbMeta.name],\n          allowRootWrapper: true,\n          defaultValue: [\n            {\n              type: \"component\",\n              name: sliderThumbMeta.name,\n            },\n          ],\n        },\n        progressBar: {\n          type: \"slot\",\n          mergeWithParent: true,\n          displayName: \"Progress Bar\",\n          defaultValue: [\n            {\n              type: \"box\",\n              styles: {\n                height: \"100%\",\n                width: \"100%\",\n                backgroundColor: \"#ffa6a6\",\n                padding: 0,\n              },\n            },\n          ],\n        },\n        onHoverStart: {\n          type: \"eventHandler\",\n          argTypes: [{ name: \"event\", type: \"object\" }],\n        },\n        onHoverEnd: {\n          type: \"eventHandler\",\n          argTypes: [{ name: \"event\", type: \"object\" }],\n        },\n        onHoverChange: {\n          type: \"eventHandler\",\n          argTypes: [{ name: \"isHovering\", type: \"boolean\" }],\n        },\n      },\n    },\n    overrides\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"registerSliderTrack.esm.js","sources":["../src/registerSliderTrack.tsx"],"sourcesContent":["import { CodeComponentMeta } from \"@plasmicapp/host\";\nimport React, { useMemo } from \"react\";\nimport { Slider, SliderThumbProps, SliderTrack } from \"react-aria-components\";\nimport flattenChildren from \"react-keyed-flatten-children\";\nimport { COMMON_STYLES } from \"./common\";\nimport { PlasmicSliderContext } from \"./contexts\";\nimport { BaseSliderThumbProps } from \"./registerSliderThumb\";\nimport {\n  CodeComponentMetaOverrides,\n  Registerable,\n  isDefined,\n  makeComponentName,\n  registerComponentHelper,\n} from \"./utils\";\nimport { WithVariants, pickAriaComponentVariants } from \"./variant-utils\";\n\nconst SLIDER_TRACK_VARIANTS = [\"hovered\" as const];\n\nconst { variants, withObservedValues } = pickAriaComponentVariants(\n  SLIDER_TRACK_VARIANTS\n);\n\nexport interface BaseSliderTrackProps\n  extends React.ComponentProps<typeof SliderTrack>,\n    WithVariants<typeof SLIDER_TRACK_VARIANTS> {\n  progressBar?: React.ReactNode;\n  children?: React.ReactNode;\n}\n\nfunction isMultiValueGuard(value?: number | number[]): value is number[] {\n  return Array.isArray(value) && value.length > 1;\n}\n\nexport function BaseSliderTrack(props: BaseSliderTrackProps) {\n  const context = React.useContext(PlasmicSliderContext);\n  const isStandalone = !context;\n  const { children, progressBar, plasmicUpdateVariant, ...rest } = props;\n  const value = context?.value ?? context?.defaultValue;\n  const thumbsLength = isMultiValueGuard(value) ? value.length : 1;\n\n  const isMultiValue = thumbsLength > 1;\n\n  const { minIndex, maxIndex } = useMemo(() => {\n    if (thumbsLength <= 1) {\n      return { minIndex: 0, maxIndex: 0 };\n    }\n    return { minIndex: 0, maxIndex: thumbsLength - 1 };\n  }, [thumbsLength]);\n\n  /**\n   * Generates the thumb components based on the number of thumbs\n   * and the number of values in the slider\n   *\n   * If the number of thumbs is less than the number of values, then\n   * the last thumb is repeated for the remaining values\n   *\n   * If the number of thumbs is greater than the number of values, then\n   * the additional thumbs are omitted\n   */\n  const thumbs = useMemo(() => {\n    const thumbNodes = flattenChildren(children);\n    if (!thumbNodes || thumbNodes.length === 0) {\n      return [];\n    }\n\n    const values = isDefined(context)\n      ? Array.isArray(value)\n        ? value\n        : [value]\n      : [];\n\n    // Last thumb be re-used if the number of thumbs is less than the number of values\n    const lastThumb = thumbNodes[thumbNodes.length - 1];\n\n    return values.map((v, i) => {\n      const currentThumb = thumbNodes[i];\n      // Re-use the last thumb if there are no more thumbs left ( this is for ease of use - the user can just add one more value to the initial-values array and see another thumb right away, without having to explicitly add a new thumb component )\n      if (i >= thumbNodes.length) {\n        if (React.isValidElement(lastThumb)) {\n          return React.cloneElement(lastThumb, {\n            index: i,\n          } as SliderThumbProps);\n        }\n      }\n      if (!React.isValidElement(currentThumb)) {\n        return null;\n      }\n      return React.cloneElement(currentThumb, {\n        index: i,\n      } as SliderThumbProps);\n    });\n  }, [children, value]);\n\n  const track = (\n    <SliderTrack style={{ position: \"relative\" }} {...rest}>\n      {({ state, isHovered }) => (\n        <>\n          {withObservedValues(\n            <>\n              <div\n                style={{\n                  width: `${\n                    (!isMultiValue\n                      ? state.getThumbPercent(minIndex)\n                      : state.getThumbPercent(maxIndex) -\n                        state.getThumbPercent(minIndex)) * 100\n                  }%`,\n                  height: \"100%\",\n                  position: \"absolute\",\n                  top: 0,\n                  left: !isMultiValue\n                    ? 0\n                    : state.getThumbPercent(minIndex) * 100 + \"%\",\n                }}\n              >\n                {progressBar}\n              </div>\n              {thumbs}\n            </>,\n            {\n              hovered: isHovered,\n            },\n            plasmicUpdateVariant\n          )}\n        </>\n      )}\n    </SliderTrack>\n  );\n\n  if (isStandalone) {\n    return (\n      <Slider style={{ height: \"100%\", width: \"100%\", ...COMMON_STYLES }}>\n        {track}\n      </Slider>\n    );\n  }\n\n  return track;\n}\n\nexport const SLIDER_TRACK_COMPONENT_NAME = makeComponentName(\"sliderTrack\");\n\nexport function registerSliderTrack(\n  sliderThumbMeta: CodeComponentMeta<BaseSliderThumbProps>,\n  loader?: Registerable,\n  overrides?: CodeComponentMetaOverrides<typeof BaseSliderTrack>\n) {\n  return registerComponentHelper(\n    loader,\n    BaseSliderTrack,\n    {\n      name: SLIDER_TRACK_COMPONENT_NAME,\n      displayName: \"Aria Slider Track\",\n      importPath: \"@plasmicpkgs/react-aria/skinny/registerSliderTrack\",\n      importName: \"BaseSliderTrack\",\n      variants,\n      defaultStyles: {\n        width: \"stretch\",\n        backgroundColor: \"#aaa\",\n        position: \"relative\",\n        height: \"10px\",\n        padding: 0,\n      },\n      props: {\n        children: {\n          type: \"slot\",\n          /**\n           * NOTE: We don't merge with parent here, because we want to allow the user to select the thumbs without having to first select the slider track.\n           * Also, there can be more than one thumbs (e.g. in a range slider), but `mergeWithParent` only shows prop controls of the slot content if there is only one direct descendant of the slot.\n           * */\n          // mergeWithParent: true,\n          displayName: \"Thumbs\",\n          description:\n            \"The thumbs of the slider. For range slider, you can add more than one thumb.\",\n          allowedComponents: [sliderThumbMeta.name],\n          allowRootWrapper: true,\n          defaultValue: [\n            {\n              type: \"component\",\n              name: sliderThumbMeta.name,\n            },\n          ],\n        },\n        progressBar: {\n          type: \"slot\",\n          mergeWithParent: true,\n          displayName: \"Progress Bar\",\n          defaultValue: [\n            {\n              type: \"box\",\n              styles: {\n                height: \"100%\",\n                width: \"100%\",\n                backgroundColor: \"#ffa6a6\",\n                padding: 0,\n              },\n            },\n          ],\n        },\n        onHoverStart: {\n          type: \"eventHandler\",\n          argTypes: [{ name: \"event\", type: \"object\" }],\n        },\n        onHoverEnd: {\n          type: \"eventHandler\",\n          argTypes: [{ name: \"event\", type: \"object\" }],\n        },\n        onHoverChange: {\n          type: \"eventHandler\",\n          argTypes: [{ name: \"isHovering\", type: \"boolean\" }],\n        },\n      },\n    },\n    overrides\n  );\n}\n"],"names":[],"mappings":"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"}

package/skinny/registerTooltip.cjs.js

@@ -54,7 +54,7 @@ function TriggerWrapper({ children, className }) {
   );
 }
 function BaseTooltip(props) {
-  var _a, _b, _c;
+  var _a, _b;
   const {
     children,
     isDisabled,
@@ -74,7 +74,7 @@ function BaseTooltip(props) {
   } = props;
   const { isSelected, selectedSlotName } = (_b = (_a = host.usePlasmicCanvasComponentInfo) == null ? void 0 : _a(props)) != null ? _b : {};
   const isAutoOpen = selectedSlotName !== "children" && isSelected;
-  const _isOpen = (_c = isAutoOpen || isOpen) != null ? _c : false;
+  const _isOpen = isAutoOpen || isOpen;
   return /* @__PURE__ */ React__default.default.createElement(
     reactAriaComponents.TooltipTrigger,
     {

package/skinny/registerTooltip.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"registerTooltip.cjs.js","sources":["../src/registerTooltip.tsx"],"sourcesContent":["import { usePlasmicCanvasComponentInfo } from \"@plasmicapp/host\";\nimport React from \"react\";\nimport { useFocusable } from \"react-aria\";\nimport { Tooltip, TooltipProps, TooltipTrigger } from \"react-aria-components\";\nimport { TooltipTriggerProps } from \"react-stately\";\nimport { COMMON_STYLES, getCommonOverlayProps } from \"./common\";\nimport {\n  CodeComponentMetaOverrides,\n  Registerable,\n  registerComponentHelper,\n  WithPlasmicCanvasComponentInfo,\n} from \"./utils\";\nimport { pickAriaComponentVariants, WithVariants } from \"./variant-utils\";\n\n/*\n  NOTE: Placement should be managed as variants, not just props.\n  When `shouldFlip` is true, the placement prop may not represent the final position\n  (e.g., if placement is set to \"bottom\" but lacks space, the tooltip may flip to \"top\").\n  However, data-selectors will consistently indicate the actual placement of the tooltip.\n*/\nconst TOOLTIP_VARIANTS = [\n  \"placementTop\" as const,\n  \"placementBottom\" as const,\n  \"placementLeft\" as const,\n  \"placementRight\" as const,\n];\n\nexport interface BaseTooltipProps\n  extends TooltipTriggerProps,\n    TooltipProps,\n    WithPlasmicCanvasComponentInfo,\n    WithVariants<typeof TOOLTIP_VARIANTS> {\n  children: React.ReactElement<HTMLElement>;\n  tooltipContent?: React.ReactElement;\n  resetClassName?: string;\n}\n\ninterface TriggerWrapperProps {\n  children: React.ReactElement;\n  className?: string;\n}\n\nconst { variants, withObservedValues } =\n  pickAriaComponentVariants(TOOLTIP_VARIANTS);\n\n/*\n\n  React Aria's TooltipTrigger TooltipTrigger requires a focusable element with ref.\n  To make sure that this requirement is fulfilled, wrap everything in a focusable div.\n  https://react-spectrum.adobe.com/react-aria/Tooltip.html#example\n  (In the example, Aria Button works as a trigger because it uses useFocusable behind the scenes)\n\n  Discussion (React-aria-components TooltipTrigger with custom button):\n  https://github.com/adobe/react-spectrum/discussions/5119#discussioncomment-7084661\n\n  */\nfunction TriggerWrapper({ children, className }: TriggerWrapperProps) {\n  const ref = React.useRef<HTMLDivElement | null>(null);\n  const { focusableProps } = useFocusable({}, ref);\n  return (\n    <div\n      ref={ref}\n      className={className}\n      {...focusableProps}\n      style={COMMON_STYLES}\n    >\n      {children}\n    </div>\n  );\n}\n\nexport function BaseTooltip(props: BaseTooltipProps) {\n  const {\n    children,\n    isDisabled,\n    delay,\n    closeDelay,\n    trigger,\n    isOpen,\n    defaultOpen,\n    tooltipContent,\n    resetClassName,\n    placement,\n    offset,\n    crossOffset,\n    shouldFlip,\n    onOpenChange,\n    plasmicUpdateVariant,\n  } = props;\n\n  const { isSelected, selectedSlotName } =\n    usePlasmicCanvasComponentInfo?.(props) ?? {};\n  const isAutoOpen = selectedSlotName !== \"children\" && isSelected;\n  const _isOpen = (isAutoOpen || isOpen) ?? false;\n\n  return (\n    <TooltipTrigger\n      isDisabled={isDisabled}\n      delay={delay}\n      closeDelay={closeDelay}\n      trigger={trigger}\n      isOpen={_isOpen}\n      defaultOpen={defaultOpen}\n      onOpenChange={onOpenChange}\n    >\n      <TriggerWrapper className={resetClassName}>{children}</TriggerWrapper>\n      <Tooltip\n        isOpen={_isOpen}\n        offset={offset}\n        crossOffset={crossOffset}\n        shouldFlip={shouldFlip}\n        defaultOpen={defaultOpen}\n        className={resetClassName}\n        onOpenChange={onOpenChange}\n        placement={placement}\n      >\n        {({ placement: _placement }) =>\n          withObservedValues(\n            <>{tooltipContent}</>,\n            {\n              placementTop: _placement === \"top\",\n              placementBottom: _placement === \"bottom\",\n              placementLeft: _placement === \"left\",\n              placementRight: _placement === \"right\",\n            },\n            plasmicUpdateVariant\n          )\n        }\n      </Tooltip>\n    </TooltipTrigger>\n  );\n}\n\nexport function registerTooltip(\n  loader?: Registerable,\n  overrides?: CodeComponentMetaOverrides<typeof BaseTooltip>\n) {\n  registerComponentHelper(\n    loader,\n    BaseTooltip,\n    {\n      name: \"plasmic-react-aria-tooltip\",\n      displayName: \"Aria Tooltip\",\n      importPath: \"@plasmicpkgs/react-aria/skinny/registerTooltip\",\n      importName: \"BaseTooltip\",\n      isAttachment: true,\n      styleSections: false,\n      variants,\n      props: {\n        children: {\n          type: \"slot\",\n          mergeWithParent: true,\n          displayName: \"Trigger\",\n          defaultValue: {\n            type: \"text\",\n            value: \"Hover me!\",\n            styles: {\n              width: \"hug\",\n            },\n          },\n        },\n        tooltipContent: {\n          type: \"slot\",\n          mergeWithParent: true,\n          displayName: \"Tooltip Content\",\n          // NOTE: This is not applied in attachment\n          defaultValue: {\n            type: \"text\",\n            value: \"Hello from Tooltip!\",\n            styles: {\n              background: \"black\",\n              color: \"white\",\n              padding: \"7px\",\n              borderRadius: \"7px\",\n            },\n          },\n        },\n        resetClassName: {\n          type: \"themeResetClass\",\n        },\n        isDisabled: {\n          type: \"boolean\",\n        },\n        delay: {\n          type: \"number\",\n          // Default value is explicitly set to 0 to prevent users from mistakenly thinking the tooltip isn’t opening due to a delay.\n          defaultValue: 0,\n          defaultValueHint: 0,\n          description:\n            \"The delay (in milliseconds) for the tooltip to show up.\",\n        },\n        closeDelay: {\n          type: \"number\",\n          // Default value is explicitly set to 0 to prevent users from mistakenly thinking the tooltip isn’t closing due to a delay.\n          defaultValue: 0,\n          defaultValueHint: 0,\n          description: \"The delay (in milliseconds) for the tooltip to close.\",\n        },\n        trigger: {\n          type: \"choice\",\n          options: [\"focus\", \"focus and hover\"],\n          defaultValueHint: \"focus and hover\",\n        },\n        ...getCommonOverlayProps<BaseTooltipProps>(\"popover\", {\n          placement: { defaultValueHint: \"top\" },\n          offset: { defaultValueHint: 0 },\n          containerPadding: { defaultValueHint: 12 },\n          crossOffset: { defaultValueHint: 0 },\n        }),\n        isOpen: {\n          type: \"boolean\",\n          editOnly: true,\n          uncontrolledProp: \"defaultOpen\",\n          description: \"Whether the overlay is open by default\",\n          defaultValueHint: false,\n          hidden: () => true,\n        },\n        onOpenChange: {\n          type: \"eventHandler\",\n          argTypes: [{ name: \"isOpen\", type: \"boolean\" }],\n        },\n      },\n      states: {\n        isOpen: {\n          type: \"writable\",\n          valueProp: \"isOpen\",\n          onChangeProp: \"onOpenChange\",\n          variableType: \"boolean\",\n        },\n      },\n      trapsFocus: true,\n    },\n    overrides\n  );\n}\n"],"names":["pickAriaComponentVariants","React","useFocusable","COMMON_STYLES","usePlasmicCanvasComponentInfo","TooltipTrigger","Tooltip","registerComponentHelper","getCommonOverlayProps"],"mappings":"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"}
+{"version":3,"file":"registerTooltip.cjs.js","sources":["../src/registerTooltip.tsx"],"sourcesContent":["import { usePlasmicCanvasComponentInfo } from \"@plasmicapp/host\";\nimport React from \"react\";\nimport { useFocusable } from \"react-aria\";\nimport { Tooltip, TooltipProps, TooltipTrigger } from \"react-aria-components\";\nimport { TooltipTriggerProps } from \"react-stately\";\nimport { COMMON_STYLES, getCommonOverlayProps } from \"./common\";\nimport {\n  CodeComponentMetaOverrides,\n  Registerable,\n  registerComponentHelper,\n  WithPlasmicCanvasComponentInfo,\n} from \"./utils\";\nimport { pickAriaComponentVariants, WithVariants } from \"./variant-utils\";\n\n/*\n  NOTE: Placement should be managed as variants, not just props.\n  When `shouldFlip` is true, the placement prop may not represent the final position\n  (e.g., if placement is set to \"bottom\" but lacks space, the tooltip may flip to \"top\").\n  However, data-selectors will consistently indicate the actual placement of the tooltip.\n*/\nconst TOOLTIP_VARIANTS = [\n  \"placementTop\" as const,\n  \"placementBottom\" as const,\n  \"placementLeft\" as const,\n  \"placementRight\" as const,\n];\n\nexport interface BaseTooltipProps\n  extends TooltipTriggerProps,\n    TooltipProps,\n    WithPlasmicCanvasComponentInfo,\n    WithVariants<typeof TOOLTIP_VARIANTS> {\n  children: React.ReactElement<HTMLElement>;\n  tooltipContent?: React.ReactElement;\n  resetClassName?: string;\n}\n\ninterface TriggerWrapperProps {\n  children: React.ReactElement;\n  className?: string;\n}\n\nconst { variants, withObservedValues } =\n  pickAriaComponentVariants(TOOLTIP_VARIANTS);\n\n/*\n\n  React Aria's TooltipTrigger TooltipTrigger requires a focusable element with ref.\n  To make sure that this requirement is fulfilled, wrap everything in a focusable div.\n  https://react-spectrum.adobe.com/react-aria/Tooltip.html#example\n  (In the example, Aria Button works as a trigger because it uses useFocusable behind the scenes)\n\n  Discussion (React-aria-components TooltipTrigger with custom button):\n  https://github.com/adobe/react-spectrum/discussions/5119#discussioncomment-7084661\n\n  */\nfunction TriggerWrapper({ children, className }: TriggerWrapperProps) {\n  const ref = React.useRef<HTMLDivElement | null>(null);\n  const { focusableProps } = useFocusable({}, ref);\n  return (\n    <div\n      ref={ref}\n      className={className}\n      {...focusableProps}\n      style={COMMON_STYLES}\n    >\n      {children}\n    </div>\n  );\n}\n\nexport function BaseTooltip(props: BaseTooltipProps) {\n  const {\n    children,\n    isDisabled,\n    delay,\n    closeDelay,\n    trigger,\n    isOpen,\n    defaultOpen,\n    tooltipContent,\n    resetClassName,\n    placement,\n    offset,\n    crossOffset,\n    shouldFlip,\n    onOpenChange,\n    plasmicUpdateVariant,\n  } = props;\n\n  const { isSelected, selectedSlotName } =\n    usePlasmicCanvasComponentInfo?.(props) ?? {};\n  const isAutoOpen = selectedSlotName !== \"children\" && isSelected;\n  const _isOpen = isAutoOpen || isOpen;\n\n  return (\n    <TooltipTrigger\n      isDisabled={isDisabled}\n      delay={delay}\n      closeDelay={closeDelay}\n      trigger={trigger}\n      isOpen={_isOpen}\n      defaultOpen={defaultOpen}\n      onOpenChange={onOpenChange}\n    >\n      <TriggerWrapper className={resetClassName}>{children}</TriggerWrapper>\n      <Tooltip\n        isOpen={_isOpen}\n        offset={offset}\n        crossOffset={crossOffset}\n        shouldFlip={shouldFlip}\n        defaultOpen={defaultOpen}\n        className={resetClassName}\n        onOpenChange={onOpenChange}\n        placement={placement}\n      >\n        {({ placement: _placement }) =>\n          withObservedValues(\n            <>{tooltipContent}</>,\n            {\n              placementTop: _placement === \"top\",\n              placementBottom: _placement === \"bottom\",\n              placementLeft: _placement === \"left\",\n              placementRight: _placement === \"right\",\n            },\n            plasmicUpdateVariant\n          )\n        }\n      </Tooltip>\n    </TooltipTrigger>\n  );\n}\n\nexport function registerTooltip(\n  loader?: Registerable,\n  overrides?: CodeComponentMetaOverrides<typeof BaseTooltip>\n) {\n  registerComponentHelper(\n    loader,\n    BaseTooltip,\n    {\n      name: \"plasmic-react-aria-tooltip\",\n      displayName: \"Aria Tooltip\",\n      importPath: \"@plasmicpkgs/react-aria/skinny/registerTooltip\",\n      importName: \"BaseTooltip\",\n      isAttachment: true,\n      styleSections: false,\n      variants,\n      props: {\n        children: {\n          type: \"slot\",\n          mergeWithParent: true,\n          displayName: \"Trigger\",\n          defaultValue: {\n            type: \"text\",\n            value: \"Hover me!\",\n            styles: {\n              width: \"hug\",\n            },\n          },\n        },\n        tooltipContent: {\n          type: \"slot\",\n          mergeWithParent: true,\n          displayName: \"Tooltip Content\",\n          // NOTE: This is not applied in attachment\n          defaultValue: {\n            type: \"text\",\n            value: \"Hello from Tooltip!\",\n            styles: {\n              background: \"black\",\n              color: \"white\",\n              padding: \"7px\",\n              borderRadius: \"7px\",\n            },\n          },\n        },\n        resetClassName: {\n          type: \"themeResetClass\",\n        },\n        isDisabled: {\n          type: \"boolean\",\n        },\n        delay: {\n          type: \"number\",\n          // Default value is explicitly set to 0 to prevent users from mistakenly thinking the tooltip isn’t opening due to a delay.\n          defaultValue: 0,\n          defaultValueHint: 0,\n          description:\n            \"The delay (in milliseconds) for the tooltip to show up.\",\n        },\n        closeDelay: {\n          type: \"number\",\n          // Default value is explicitly set to 0 to prevent users from mistakenly thinking the tooltip isn’t closing due to a delay.\n          defaultValue: 0,\n          defaultValueHint: 0,\n          description: \"The delay (in milliseconds) for the tooltip to close.\",\n        },\n        trigger: {\n          type: \"choice\",\n          options: [\"focus\", \"focus and hover\"],\n          defaultValueHint: \"focus and hover\",\n        },\n        ...getCommonOverlayProps<BaseTooltipProps>(\"popover\", {\n          placement: { defaultValueHint: \"top\" },\n          offset: { defaultValueHint: 0 },\n          containerPadding: { defaultValueHint: 12 },\n          crossOffset: { defaultValueHint: 0 },\n        }),\n        isOpen: {\n          type: \"boolean\",\n          editOnly: true,\n          uncontrolledProp: \"defaultOpen\",\n          description: \"Whether the overlay is open by default\",\n          defaultValueHint: false,\n          hidden: () => true,\n        },\n        onOpenChange: {\n          type: \"eventHandler\",\n          argTypes: [{ name: \"isOpen\", type: \"boolean\" }],\n        },\n      },\n      states: {\n        isOpen: {\n          type: \"writable\",\n          valueProp: \"isOpen\",\n          onChangeProp: \"onOpenChange\",\n          variableType: \"boolean\",\n        },\n      },\n      trapsFocus: true,\n    },\n    overrides\n  );\n}\n"],"names":["pickAriaComponentVariants","React","useFocusable","COMMON_STYLES","usePlasmicCanvasComponentInfo","TooltipTrigger","Tooltip","registerComponentHelper","getCommonOverlayProps"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,MAAM,gBAAmB,GAAA;AAAA,EACvB,cAAA;AAAA,EACA,iBAAA;AAAA,EACA,eAAA;AAAA,EACA,gBAAA;AACF,CAAA,CAAA;AAiBA,MAAM,EAAE,QAAA,EAAU,kBAAmB,EAAA,GACnCA,uCAA0B,gBAAgB,CAAA,CAAA;AAa5C,SAAS,cAAe,CAAA,EAAE,QAAU,EAAA,SAAA,EAAkC,EAAA;AACpE,EAAM,MAAA,GAAA,GAAMC,sBAAM,CAAA,MAAA,CAA8B,IAAI,CAAA,CAAA;AACpD,EAAA,MAAM,EAAE,cAAe,EAAA,GAAIC,sBAAa,CAAA,IAAI,GAAG,CAAA,CAAA;AAC/C,EACE,uBAAAD,sBAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA,aAAA,CAAA,cAAA,CAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAA;AAAA,KAAA,EACI,cAHL,CAAA,EAAA;AAAA,MAIC,KAAO,EAAAE,oBAAA;AAAA,KAAA,CAAA;AAAA,IAEN,QAAA;AAAA,GACH,CAAA;AAEJ,CAAA;AAEO,SAAS,YAAY,KAAyB,EAAA;AAvErD,EAAA,IAAA,EAAA,EAAA,EAAA,CAAA;AAwEE,EAAM,MAAA;AAAA,IACJ,QAAA;AAAA,IACA,UAAA;AAAA,IACA,KAAA;AAAA,IACA,UAAA;AAAA,IACA,OAAA;AAAA,IACA,MAAA;AAAA,IACA,WAAA;AAAA,IACA,cAAA;AAAA,IACA,cAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAA;AAAA,IACA,WAAA;AAAA,IACA,UAAA;AAAA,IACA,YAAA;AAAA,IACA,oBAAA;AAAA,GACE,GAAA,KAAA,CAAA;AAEJ,EAAA,MAAM,EAAE,UAAY,EAAA,gBAAA,MAClB,EAAgC,GAAA,CAAA,EAAA,GAAAC,kCAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,KAAA,CAAA,KAAhC,YAA0C,EAAC,CAAA;AAC7C,EAAM,MAAA,UAAA,GAAa,qBAAqB,UAAc,IAAA,UAAA,CAAA;AACtD,EAAA,MAAM,UAAU,UAAc,IAAA,MAAA,CAAA;AAE9B,EACE,uBAAAH,sBAAA,CAAA,aAAA;AAAA,IAACI,kCAAA;AAAA,IAAA;AAAA,MACC,UAAA;AAAA,MACA,KAAA;AAAA,MACA,UAAA;AAAA,MACA,OAAA;AAAA,MACA,MAAQ,EAAA,OAAA;AAAA,MACR,WAAA;AAAA,MACA,YAAA;AAAA,KAAA;AAAA,oBAECJ,sBAAA,CAAA,aAAA,CAAA,cAAA,EAAA,EAAe,SAAW,EAAA,cAAA,EAAA,EAAiB,QAAS,CAAA;AAAA,oBACrDA,sBAAA,CAAA,aAAA;AAAA,MAACK,2BAAA;AAAA,MAAA;AAAA,QACC,MAAQ,EAAA,OAAA;AAAA,QACR,MAAA;AAAA,QACA,WAAA;AAAA,QACA,UAAA;AAAA,QACA,WAAA;AAAA,QACA,SAAW,EAAA,cAAA;AAAA,QACX,YAAA;AAAA,QACA,SAAA;AAAA,OAAA;AAAA,MAEC,CAAC,EAAE,SAAW,EAAA,UAAA,EACb,KAAA,kBAAA;AAAA,oGACK,cAAe,CAAA;AAAA,QAClB;AAAA,UACE,cAAc,UAAe,KAAA,KAAA;AAAA,UAC7B,iBAAiB,UAAe,KAAA,QAAA;AAAA,UAChC,eAAe,UAAe,KAAA,MAAA;AAAA,UAC9B,gBAAgB,UAAe,KAAA,OAAA;AAAA,SACjC;AAAA,QACA,oBAAA;AAAA,OACF;AAAA,KAEJ;AAAA,GACF,CAAA;AAEJ,CAAA;AAEgB,SAAA,eAAA,CACd,QACA,SACA,EAAA;AACA,EAAAC,6BAAA;AAAA,IACE,MAAA;AAAA,IACA,WAAA;AAAA,IACA;AAAA,MACE,IAAM,EAAA,4BAAA;AAAA,MACN,WAAa,EAAA,cAAA;AAAA,MACb,UAAY,EAAA,gDAAA;AAAA,MACZ,UAAY,EAAA,aAAA;AAAA,MACZ,YAAc,EAAA,IAAA;AAAA,MACd,aAAe,EAAA,KAAA;AAAA,MACf,QAAA;AAAA,MACA,KAAO,EAAA,aAAA,CAAA,cAAA,CAAA;AAAA,QACL,QAAU,EAAA;AAAA,UACR,IAAM,EAAA,MAAA;AAAA,UACN,eAAiB,EAAA,IAAA;AAAA,UACjB,WAAa,EAAA,SAAA;AAAA,UACb,YAAc,EAAA;AAAA,YACZ,IAAM,EAAA,MAAA;AAAA,YACN,KAAO,EAAA,WAAA;AAAA,YACP,MAAQ,EAAA;AAAA,cACN,KAAO,EAAA,KAAA;AAAA,aACT;AAAA,WACF;AAAA,SACF;AAAA,QACA,cAAgB,EAAA;AAAA,UACd,IAAM,EAAA,MAAA;AAAA,UACN,eAAiB,EAAA,IAAA;AAAA,UACjB,WAAa,EAAA,iBAAA;AAAA;AAAA,UAEb,YAAc,EAAA;AAAA,YACZ,IAAM,EAAA,MAAA;AAAA,YACN,KAAO,EAAA,qBAAA;AAAA,YACP,MAAQ,EAAA;AAAA,cACN,UAAY,EAAA,OAAA;AAAA,cACZ,KAAO,EAAA,OAAA;AAAA,cACP,OAAS,EAAA,KAAA;AAAA,cACT,YAAc,EAAA,KAAA;AAAA,aAChB;AAAA,WACF;AAAA,SACF;AAAA,QACA,cAAgB,EAAA;AAAA,UACd,IAAM,EAAA,iBAAA;AAAA,SACR;AAAA,QACA,UAAY,EAAA;AAAA,UACV,IAAM,EAAA,SAAA;AAAA,SACR;AAAA,QACA,KAAO,EAAA;AAAA,UACL,IAAM,EAAA,QAAA;AAAA;AAAA,UAEN,YAAc,EAAA,CAAA;AAAA,UACd,gBAAkB,EAAA,CAAA;AAAA,UAClB,WACE,EAAA,yDAAA;AAAA,SACJ;AAAA,QACA,UAAY,EAAA;AAAA,UACV,IAAM,EAAA,QAAA;AAAA;AAAA,UAEN,YAAc,EAAA,CAAA;AAAA,UACd,gBAAkB,EAAA,CAAA;AAAA,UAClB,WAAa,EAAA,uDAAA;AAAA,SACf;AAAA,QACA,OAAS,EAAA;AAAA,UACP,IAAM,EAAA,QAAA;AAAA,UACN,OAAA,EAAS,CAAC,OAAA,EAAS,iBAAiB,CAAA;AAAA,UACpC,gBAAkB,EAAA,iBAAA;AAAA,SACpB;AAAA,OAAA,EACGC,6BAAwC,SAAW,EAAA;AAAA,QACpD,SAAA,EAAW,EAAE,gBAAA,EAAkB,KAAM,EAAA;AAAA,QACrC,MAAA,EAAQ,EAAE,gBAAA,EAAkB,CAAE,EAAA;AAAA,QAC9B,gBAAA,EAAkB,EAAE,gBAAA,EAAkB,EAAG,EAAA;AAAA,QACzC,WAAA,EAAa,EAAE,gBAAA,EAAkB,CAAE,EAAA;AAAA,OACpC,CA5DI,CAAA,EAAA;AAAA,QA6DL,MAAQ,EAAA;AAAA,UACN,IAAM,EAAA,SAAA;AAAA,UACN,QAAU,EAAA,IAAA;AAAA,UACV,gBAAkB,EAAA,aAAA;AAAA,UAClB,WAAa,EAAA,wCAAA;AAAA,UACb,gBAAkB,EAAA,KAAA;AAAA,UAClB,QAAQ,MAAM,IAAA;AAAA,SAChB;AAAA,QACA,YAAc,EAAA;AAAA,UACZ,IAAM,EAAA,cAAA;AAAA,UACN,UAAU,CAAC,EAAE,MAAM,QAAU,EAAA,IAAA,EAAM,WAAW,CAAA;AAAA,SAChD;AAAA,OACF,CAAA;AAAA,MACA,MAAQ,EAAA;AAAA,QACN,MAAQ,EAAA;AAAA,UACN,IAAM,EAAA,UAAA;AAAA,UACN,SAAW,EAAA,QAAA;AAAA,UACX,YAAc,EAAA,cAAA;AAAA,UACd,YAAc,EAAA,SAAA;AAAA,SAChB;AAAA,OACF;AAAA,MACA,UAAY,EAAA,IAAA;AAAA,KACd;AAAA,IACA,SAAA;AAAA,GACF,CAAA;AACF;;;;;"}

package/skinny/registerTooltip.esm.js

@@ -48,7 +48,7 @@ function TriggerWrapper({ children, className }) {
   );
 }
 function BaseTooltip(props) {
-  var _a, _b, _c;
+  var _a, _b;
   const {
     children,
     isDisabled,
@@ -68,7 +68,7 @@ function BaseTooltip(props) {
   } = props;
   const { isSelected, selectedSlotName } = (_b = (_a = usePlasmicCanvasComponentInfo) == null ? void 0 : _a(props)) != null ? _b : {};
   const isAutoOpen = selectedSlotName !== "children" && isSelected;
-  const _isOpen = (_c = isAutoOpen || isOpen) != null ? _c : false;
+  const _isOpen = isAutoOpen || isOpen;
   return /* @__PURE__ */ React.createElement(
     TooltipTrigger,
     {

package/skinny/registerTooltip.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"registerTooltip.esm.js","sources":["../src/registerTooltip.tsx"],"sourcesContent":["import { usePlasmicCanvasComponentInfo } from \"@plasmicapp/host\";\nimport React from \"react\";\nimport { useFocusable } from \"react-aria\";\nimport { Tooltip, TooltipProps, TooltipTrigger } from \"react-aria-components\";\nimport { TooltipTriggerProps } from \"react-stately\";\nimport { COMMON_STYLES, getCommonOverlayProps } from \"./common\";\nimport {\n  CodeComponentMetaOverrides,\n  Registerable,\n  registerComponentHelper,\n  WithPlasmicCanvasComponentInfo,\n} from \"./utils\";\nimport { pickAriaComponentVariants, WithVariants } from \"./variant-utils\";\n\n/*\n  NOTE: Placement should be managed as variants, not just props.\n  When `shouldFlip` is true, the placement prop may not represent the final position\n  (e.g., if placement is set to \"bottom\" but lacks space, the tooltip may flip to \"top\").\n  However, data-selectors will consistently indicate the actual placement of the tooltip.\n*/\nconst TOOLTIP_VARIANTS = [\n  \"placementTop\" as const,\n  \"placementBottom\" as const,\n  \"placementLeft\" as const,\n  \"placementRight\" as const,\n];\n\nexport interface BaseTooltipProps\n  extends TooltipTriggerProps,\n    TooltipProps,\n    WithPlasmicCanvasComponentInfo,\n    WithVariants<typeof TOOLTIP_VARIANTS> {\n  children: React.ReactElement<HTMLElement>;\n  tooltipContent?: React.ReactElement;\n  resetClassName?: string;\n}\n\ninterface TriggerWrapperProps {\n  children: React.ReactElement;\n  className?: string;\n}\n\nconst { variants, withObservedValues } =\n  pickAriaComponentVariants(TOOLTIP_VARIANTS);\n\n/*\n\n  React Aria's TooltipTrigger TooltipTrigger requires a focusable element with ref.\n  To make sure that this requirement is fulfilled, wrap everything in a focusable div.\n  https://react-spectrum.adobe.com/react-aria/Tooltip.html#example\n  (In the example, Aria Button works as a trigger because it uses useFocusable behind the scenes)\n\n  Discussion (React-aria-components TooltipTrigger with custom button):\n  https://github.com/adobe/react-spectrum/discussions/5119#discussioncomment-7084661\n\n  */\nfunction TriggerWrapper({ children, className }: TriggerWrapperProps) {\n  const ref = React.useRef<HTMLDivElement | null>(null);\n  const { focusableProps } = useFocusable({}, ref);\n  return (\n    <div\n      ref={ref}\n      className={className}\n      {...focusableProps}\n      style={COMMON_STYLES}\n    >\n      {children}\n    </div>\n  );\n}\n\nexport function BaseTooltip(props: BaseTooltipProps) {\n  const {\n    children,\n    isDisabled,\n    delay,\n    closeDelay,\n    trigger,\n    isOpen,\n    defaultOpen,\n    tooltipContent,\n    resetClassName,\n    placement,\n    offset,\n    crossOffset,\n    shouldFlip,\n    onOpenChange,\n    plasmicUpdateVariant,\n  } = props;\n\n  const { isSelected, selectedSlotName } =\n    usePlasmicCanvasComponentInfo?.(props) ?? {};\n  const isAutoOpen = selectedSlotName !== \"children\" && isSelected;\n  const _isOpen = (isAutoOpen || isOpen) ?? false;\n\n  return (\n    <TooltipTrigger\n      isDisabled={isDisabled}\n      delay={delay}\n      closeDelay={closeDelay}\n      trigger={trigger}\n      isOpen={_isOpen}\n      defaultOpen={defaultOpen}\n      onOpenChange={onOpenChange}\n    >\n      <TriggerWrapper className={resetClassName}>{children}</TriggerWrapper>\n      <Tooltip\n        isOpen={_isOpen}\n        offset={offset}\n        crossOffset={crossOffset}\n        shouldFlip={shouldFlip}\n        defaultOpen={defaultOpen}\n        className={resetClassName}\n        onOpenChange={onOpenChange}\n        placement={placement}\n      >\n        {({ placement: _placement }) =>\n          withObservedValues(\n            <>{tooltipContent}</>,\n            {\n              placementTop: _placement === \"top\",\n              placementBottom: _placement === \"bottom\",\n              placementLeft: _placement === \"left\",\n              placementRight: _placement === \"right\",\n            },\n            plasmicUpdateVariant\n          )\n        }\n      </Tooltip>\n    </TooltipTrigger>\n  );\n}\n\nexport function registerTooltip(\n  loader?: Registerable,\n  overrides?: CodeComponentMetaOverrides<typeof BaseTooltip>\n) {\n  registerComponentHelper(\n    loader,\n    BaseTooltip,\n    {\n      name: \"plasmic-react-aria-tooltip\",\n      displayName: \"Aria Tooltip\",\n      importPath: \"@plasmicpkgs/react-aria/skinny/registerTooltip\",\n      importName: \"BaseTooltip\",\n      isAttachment: true,\n      styleSections: false,\n      variants,\n      props: {\n        children: {\n          type: \"slot\",\n          mergeWithParent: true,\n          displayName: \"Trigger\",\n          defaultValue: {\n            type: \"text\",\n            value: \"Hover me!\",\n            styles: {\n              width: \"hug\",\n            },\n          },\n        },\n        tooltipContent: {\n          type: \"slot\",\n          mergeWithParent: true,\n          displayName: \"Tooltip Content\",\n          // NOTE: This is not applied in attachment\n          defaultValue: {\n            type: \"text\",\n            value: \"Hello from Tooltip!\",\n            styles: {\n              background: \"black\",\n              color: \"white\",\n              padding: \"7px\",\n              borderRadius: \"7px\",\n            },\n          },\n        },\n        resetClassName: {\n          type: \"themeResetClass\",\n        },\n        isDisabled: {\n          type: \"boolean\",\n        },\n        delay: {\n          type: \"number\",\n          // Default value is explicitly set to 0 to prevent users from mistakenly thinking the tooltip isn’t opening due to a delay.\n          defaultValue: 0,\n          defaultValueHint: 0,\n          description:\n            \"The delay (in milliseconds) for the tooltip to show up.\",\n        },\n        closeDelay: {\n          type: \"number\",\n          // Default value is explicitly set to 0 to prevent users from mistakenly thinking the tooltip isn’t closing due to a delay.\n          defaultValue: 0,\n          defaultValueHint: 0,\n          description: \"The delay (in milliseconds) for the tooltip to close.\",\n        },\n        trigger: {\n          type: \"choice\",\n          options: [\"focus\", \"focus and hover\"],\n          defaultValueHint: \"focus and hover\",\n        },\n        ...getCommonOverlayProps<BaseTooltipProps>(\"popover\", {\n          placement: { defaultValueHint: \"top\" },\n          offset: { defaultValueHint: 0 },\n          containerPadding: { defaultValueHint: 12 },\n          crossOffset: { defaultValueHint: 0 },\n        }),\n        isOpen: {\n          type: \"boolean\",\n          editOnly: true,\n          uncontrolledProp: \"defaultOpen\",\n          description: \"Whether the overlay is open by default\",\n          defaultValueHint: false,\n          hidden: () => true,\n        },\n        onOpenChange: {\n          type: \"eventHandler\",\n          argTypes: [{ name: \"isOpen\", type: \"boolean\" }],\n        },\n      },\n      states: {\n        isOpen: {\n          type: \"writable\",\n          valueProp: \"isOpen\",\n          onChangeProp: \"onOpenChange\",\n          variableType: \"boolean\",\n        },\n      },\n      trapsFocus: true,\n    },\n    overrides\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"registerTooltip.esm.js","sources":["../src/registerTooltip.tsx"],"sourcesContent":["import { usePlasmicCanvasComponentInfo } from \"@plasmicapp/host\";\nimport React from \"react\";\nimport { useFocusable } from \"react-aria\";\nimport { Tooltip, TooltipProps, TooltipTrigger } from \"react-aria-components\";\nimport { TooltipTriggerProps } from \"react-stately\";\nimport { COMMON_STYLES, getCommonOverlayProps } from \"./common\";\nimport {\n  CodeComponentMetaOverrides,\n  Registerable,\n  registerComponentHelper,\n  WithPlasmicCanvasComponentInfo,\n} from \"./utils\";\nimport { pickAriaComponentVariants, WithVariants } from \"./variant-utils\";\n\n/*\n  NOTE: Placement should be managed as variants, not just props.\n  When `shouldFlip` is true, the placement prop may not represent the final position\n  (e.g., if placement is set to \"bottom\" but lacks space, the tooltip may flip to \"top\").\n  However, data-selectors will consistently indicate the actual placement of the tooltip.\n*/\nconst TOOLTIP_VARIANTS = [\n  \"placementTop\" as const,\n  \"placementBottom\" as const,\n  \"placementLeft\" as const,\n  \"placementRight\" as const,\n];\n\nexport interface BaseTooltipProps\n  extends TooltipTriggerProps,\n    TooltipProps,\n    WithPlasmicCanvasComponentInfo,\n    WithVariants<typeof TOOLTIP_VARIANTS> {\n  children: React.ReactElement<HTMLElement>;\n  tooltipContent?: React.ReactElement;\n  resetClassName?: string;\n}\n\ninterface TriggerWrapperProps {\n  children: React.ReactElement;\n  className?: string;\n}\n\nconst { variants, withObservedValues } =\n  pickAriaComponentVariants(TOOLTIP_VARIANTS);\n\n/*\n\n  React Aria's TooltipTrigger TooltipTrigger requires a focusable element with ref.\n  To make sure that this requirement is fulfilled, wrap everything in a focusable div.\n  https://react-spectrum.adobe.com/react-aria/Tooltip.html#example\n  (In the example, Aria Button works as a trigger because it uses useFocusable behind the scenes)\n\n  Discussion (React-aria-components TooltipTrigger with custom button):\n  https://github.com/adobe/react-spectrum/discussions/5119#discussioncomment-7084661\n\n  */\nfunction TriggerWrapper({ children, className }: TriggerWrapperProps) {\n  const ref = React.useRef<HTMLDivElement | null>(null);\n  const { focusableProps } = useFocusable({}, ref);\n  return (\n    <div\n      ref={ref}\n      className={className}\n      {...focusableProps}\n      style={COMMON_STYLES}\n    >\n      {children}\n    </div>\n  );\n}\n\nexport function BaseTooltip(props: BaseTooltipProps) {\n  const {\n    children,\n    isDisabled,\n    delay,\n    closeDelay,\n    trigger,\n    isOpen,\n    defaultOpen,\n    tooltipContent,\n    resetClassName,\n    placement,\n    offset,\n    crossOffset,\n    shouldFlip,\n    onOpenChange,\n    plasmicUpdateVariant,\n  } = props;\n\n  const { isSelected, selectedSlotName } =\n    usePlasmicCanvasComponentInfo?.(props) ?? {};\n  const isAutoOpen = selectedSlotName !== \"children\" && isSelected;\n  const _isOpen = isAutoOpen || isOpen;\n\n  return (\n    <TooltipTrigger\n      isDisabled={isDisabled}\n      delay={delay}\n      closeDelay={closeDelay}\n      trigger={trigger}\n      isOpen={_isOpen}\n      defaultOpen={defaultOpen}\n      onOpenChange={onOpenChange}\n    >\n      <TriggerWrapper className={resetClassName}>{children}</TriggerWrapper>\n      <Tooltip\n        isOpen={_isOpen}\n        offset={offset}\n        crossOffset={crossOffset}\n        shouldFlip={shouldFlip}\n        defaultOpen={defaultOpen}\n        className={resetClassName}\n        onOpenChange={onOpenChange}\n        placement={placement}\n      >\n        {({ placement: _placement }) =>\n          withObservedValues(\n            <>{tooltipContent}</>,\n            {\n              placementTop: _placement === \"top\",\n              placementBottom: _placement === \"bottom\",\n              placementLeft: _placement === \"left\",\n              placementRight: _placement === \"right\",\n            },\n            plasmicUpdateVariant\n          )\n        }\n      </Tooltip>\n    </TooltipTrigger>\n  );\n}\n\nexport function registerTooltip(\n  loader?: Registerable,\n  overrides?: CodeComponentMetaOverrides<typeof BaseTooltip>\n) {\n  registerComponentHelper(\n    loader,\n    BaseTooltip,\n    {\n      name: \"plasmic-react-aria-tooltip\",\n      displayName: \"Aria Tooltip\",\n      importPath: \"@plasmicpkgs/react-aria/skinny/registerTooltip\",\n      importName: \"BaseTooltip\",\n      isAttachment: true,\n      styleSections: false,\n      variants,\n      props: {\n        children: {\n          type: \"slot\",\n          mergeWithParent: true,\n          displayName: \"Trigger\",\n          defaultValue: {\n            type: \"text\",\n            value: \"Hover me!\",\n            styles: {\n              width: \"hug\",\n            },\n          },\n        },\n        tooltipContent: {\n          type: \"slot\",\n          mergeWithParent: true,\n          displayName: \"Tooltip Content\",\n          // NOTE: This is not applied in attachment\n          defaultValue: {\n            type: \"text\",\n            value: \"Hello from Tooltip!\",\n            styles: {\n              background: \"black\",\n              color: \"white\",\n              padding: \"7px\",\n              borderRadius: \"7px\",\n            },\n          },\n        },\n        resetClassName: {\n          type: \"themeResetClass\",\n        },\n        isDisabled: {\n          type: \"boolean\",\n        },\n        delay: {\n          type: \"number\",\n          // Default value is explicitly set to 0 to prevent users from mistakenly thinking the tooltip isn’t opening due to a delay.\n          defaultValue: 0,\n          defaultValueHint: 0,\n          description:\n            \"The delay (in milliseconds) for the tooltip to show up.\",\n        },\n        closeDelay: {\n          type: \"number\",\n          // Default value is explicitly set to 0 to prevent users from mistakenly thinking the tooltip isn’t closing due to a delay.\n          defaultValue: 0,\n          defaultValueHint: 0,\n          description: \"The delay (in milliseconds) for the tooltip to close.\",\n        },\n        trigger: {\n          type: \"choice\",\n          options: [\"focus\", \"focus and hover\"],\n          defaultValueHint: \"focus and hover\",\n        },\n        ...getCommonOverlayProps<BaseTooltipProps>(\"popover\", {\n          placement: { defaultValueHint: \"top\" },\n          offset: { defaultValueHint: 0 },\n          containerPadding: { defaultValueHint: 12 },\n          crossOffset: { defaultValueHint: 0 },\n        }),\n        isOpen: {\n          type: \"boolean\",\n          editOnly: true,\n          uncontrolledProp: \"defaultOpen\",\n          description: \"Whether the overlay is open by default\",\n          defaultValueHint: false,\n          hidden: () => true,\n        },\n        onOpenChange: {\n          type: \"eventHandler\",\n          argTypes: [{ name: \"isOpen\", type: \"boolean\" }],\n        },\n      },\n      states: {\n        isOpen: {\n          type: \"writable\",\n          valueProp: \"isOpen\",\n          onChangeProp: \"onOpenChange\",\n          variableType: \"boolean\",\n        },\n      },\n      trapsFocus: true,\n    },\n    overrides\n  );\n}\n"],"names":[],"mappings":"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"}

package/skinny/registerTooltip.stories.cjs.js

@@ -61,22 +61,6 @@ const meta = {
     // means that it triggers on both focus and hover
     delay: 0,
     closeDelay: 0
-  },
-  //   TODO: Currently, the BaseTooltip component cannot be uncontrolled, because a false is assumed for isOpen prop, if it is undefined
-  //   Remove this render function in the PR that fixes the issue
-  render: (_a) => {
-    var _b = _a, { isOpen, onOpenChange } = _b, args = __objRest(_b, ["isOpen", "onOpenChange"]);
-    const [open, setOpen] = React.useState(isOpen);
-    return /* @__PURE__ */ React__default.default.createElement(
-      registerTooltip.BaseTooltip,
-      __spreadValues({
-        isOpen: open,
-        onOpenChange: (newValue) => {
-          setOpen(newValue);
-          onOpenChange == null ? void 0 : onOpenChange(newValue);
-        }
-      }, args)
-    );
   }
 };
 const AlwaysOpen = {
@@ -164,8 +148,8 @@ const Disabled = {
   }
 };
 const SelectedInCanvas = {
-  render: (_c) => {
-    var _d = _c, args = __objRest(_d, ["__plasmic_selection_prop__"]);
+  render: (_a) => {
+    var _b = _a, args = __objRest(_b, ["__plasmic_selection_prop__"]);
     const [selected, setSelected] = React.useState(false);
     const [selectedSlotName, setSelectedSlotName] = React.useState("");
     React.useEffect(() => {

package/skinny/registerTooltip.stories.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"registerTooltip.stories.cjs.js","sources":["../src/registerTooltip.stories.tsx"],"sourcesContent":["import { PlasmicCanvasContext } from \"@plasmicapp/host\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { expect, fn, userEvent, waitFor, within } from \"@storybook/test\";\nimport React, { useEffect, useState } from \"react\";\nimport { BaseButton } from \"./registerButton\";\nimport { BaseTooltip } from \"./registerTooltip\";\n\nconst meta: Meta<typeof BaseTooltip> = {\n  title: \"Components/BaseTooltip\",\n  component: BaseTooltip,\n  args: {\n    onOpenChange: fn(),\n    children: <BaseButton>Hover me!</BaseButton>, // anything can be used as a trigger\n    tooltipContent: <div data-testid=\"tooltip-content\">This is a tooltip</div>,\n    trigger: undefined, // means that it triggers on both focus and hover\n    delay: 0,\n    closeDelay: 0,\n  },\n  //   TODO: Currently, the BaseTooltip component cannot be uncontrolled, because a false is assumed for isOpen prop, if it is undefined\n  //   Remove this render function in the PR that fixes the issue\n  render: ({ isOpen, onOpenChange, ...args }) => {\n    const [open, setOpen] = useState(isOpen);\n    return (\n      <BaseTooltip\n        isOpen={open}\n        onOpenChange={(newValue) => {\n          setOpen(newValue);\n          onOpenChange?.(newValue);\n        }}\n        {...args}\n      />\n    );\n  },\n};\n\nexport default meta;\ntype Story = StoryObj<typeof BaseTooltip>;\n\n// TODO: Note, this test is failing only in headless mode (so the CI will fail),\n// because the hover simulation does not trigger the onOpenChange event.\n// I'm unsure why this is happening, as the story/test passes in interactive mode.\n// Uncomment this test in the PR that fixes the issue\n// Basic tooltip with hover trigger\n// export const Basic: Story = {\n//   play: async ({ canvasElement, args }) => {\n//     const canvas = within(canvasElement);\n//     const trigger = canvas.getByText(\"Hover me!\");\n\n//     await waitFor(() =>\n//       expect(\n//         within(document.body).queryByTestId(\"tooltip-content\")\n//       ).not.toBeInTheDocument()\n//     );\n\n//     await userEvent.hover(trigger);\n\n//     // Check that tooltip appears\n//     await waitFor(() =>\n//       expect(\n//         within(document.body).queryByTestId(\"tooltip-content\")\n//       ).toBeInTheDocument()\n//     );\n\n//     expect(args.onOpenChange).toHaveBeenCalledWith(true);\n\n//     await userEvent.unhover(trigger);\n\n//     await waitFor(() => expect(args.onOpenChange).toHaveBeenCalledWith(false));\n//   },\n// };\n\n// Test only that the tooltip renders initially\nexport const AlwaysOpen: Story = {\n  args: {\n    isOpen: true, // Force tooltip to be open\n  },\n  play: async () => {\n    // Just verify the tooltip content is in the document\n    await waitFor(() =>\n      expect(\n        within(document.body).queryByTestId(\"tooltip-content\")\n      ).toBeInTheDocument()\n    );\n  },\n};\n\n// Tooltip with focus trigger\nexport const FocusTrigger: Story = {\n  play: async ({ args }) => {\n    await waitFor(() =>\n      expect(\n        within(document.body).queryByTestId(\"tooltip-content\")\n      ).not.toBeInTheDocument()\n    );\n\n    // Focus trigger\n    await userEvent.tab();\n\n    // Check that tooltip appears\n    await waitFor(() =>\n      expect(\n        within(document.body).queryByTestId(\"tooltip-content\")\n      ).toBeInTheDocument()\n    );\n\n    expect(args.onOpenChange).toHaveBeenCalledWith(true);\n\n    // Move focus away\n    await userEvent.tab();\n    await waitFor(() => expect(args.onOpenChange).toHaveBeenCalledWith(false));\n  },\n};\n\n// Tooltip with focus trigger only\nexport const FocusTriggerOnly: Story = {\n  args: {\n    trigger: \"focus\",\n  },\n  play: async ({ args, canvasElement }) => {\n    const canvas = within(canvasElement);\n    const trigger = canvas.getByText(\"Hover me!\");\n\n    await waitFor(() =>\n      expect(\n        within(document.body).queryByTestId(\"tooltip-content\")\n      ).not.toBeInTheDocument()\n    );\n\n    // Hover over trigger\n    await userEvent.hover(trigger);\n\n    // Check that tooltip does NOT appear on hover\n    await waitFor(() =>\n      expect(\n        within(document.body).queryByTestId(\"tooltip-content\")\n      ).not.toBeInTheDocument()\n    );\n\n    expect(args.onOpenChange).not.toHaveBeenCalled();\n\n    // Move mouse away\n    await userEvent.unhover(trigger);\n\n    // Focus trigger\n    await userEvent.tab();\n\n    // Check that tooltip DOES appear on focus\n    await waitFor(() =>\n      expect(\n        within(document.body).queryByTestId(\"tooltip-content\")\n      ).toBeInTheDocument()\n    );\n\n    expect(args.onOpenChange).toHaveBeenCalledWith(true);\n\n    // Move focus away\n    await userEvent.tab();\n    await waitFor(() => expect(args.onOpenChange).toHaveBeenCalledWith(false));\n  },\n};\n\n// Disabled tooltip\nexport const Disabled: Story = {\n  args: {\n    isDisabled: true,\n  },\n  play: async ({ args, canvasElement }) => {\n    const canvas = within(canvasElement);\n    const trigger = canvas.getByText(\"Hover me!\");\n\n    await waitFor(() =>\n      expect(\n        within(document.body).queryByTestId(\"tooltip-content\")\n      ).not.toBeInTheDocument()\n    );\n\n    // Focus trigger\n    await userEvent.tab();\n\n    // Check that the disabled tooltip does NOT appear\n    await waitFor(() =>\n      expect(\n        within(document.body).queryByTestId(\"tooltip-content\")\n      ).not.toBeInTheDocument()\n    );\n\n    expect(args.onOpenChange).not.toHaveBeenCalled();\n\n    await userEvent.hover(trigger);\n  },\n};\n\nexport const SelectedInCanvas: Story = {\n  render: ({ __plasmic_selection_prop__, ...args }) => {\n    const [selected, setSelected] = useState(false);\n    const [selectedSlotName, setSelectedSlotName] = useState(\"\");\n\n    useEffect(() => {\n      setTimeout(() => {\n        setSelected(true);\n        setTimeout(() => {\n          // Simulate trigger slot selection in Plasmic canvas\n          setSelectedSlotName(\"children\");\n        }, 1000);\n      }, 1000);\n    }, []);\n\n    return (\n      // Simulate Plasmic canvas envirnment\n      <PlasmicCanvasContext.Provider\n        value={{\n          componentName: \"test\",\n          globalVariants: {},\n        }}\n      >\n        <BaseTooltip\n          {...args}\n          // Simulate node selection in Plasmic canvas\n          __plasmic_selection_prop__={{\n            isSelected: selected,\n            selectedSlotName,\n          }}\n          {...args}\n        />\n      </PlasmicCanvasContext.Provider>\n    );\n  },\n  play: async () => {\n    await waitFor(() =>\n      expect(\n        within(document.body).queryByTestId(\"tooltip-content\")\n      ).not.toBeInTheDocument()\n    );\n\n    await waitFor(\n      () =>\n        expect(\n          within(document.body).queryByTestId(\"tooltip-content\")\n        ).toBeInTheDocument(),\n      { timeout: 1100 }\n    );\n\n    await waitFor(\n      () =>\n        expect(\n          within(document.body).queryByTestId(\"tooltip-content\")\n        ).not.toBeInTheDocument(),\n      { timeout: 1100 }\n    );\n  },\n};\n"],"names":["BaseTooltip","fn","React","BaseButton","useState","waitFor","expect","within","userEvent","useEffect","PlasmicCanvasContext"],"mappings":"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"}
+{"version":3,"file":"registerTooltip.stories.cjs.js","sources":["../src/registerTooltip.stories.tsx"],"sourcesContent":["import { PlasmicCanvasContext } from \"@plasmicapp/host\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { expect, fn, userEvent, waitFor, within } from \"@storybook/test\";\nimport React, { useEffect, useState } from \"react\";\nimport { BaseButton } from \"./registerButton\";\nimport { BaseTooltip } from \"./registerTooltip\";\n\nconst meta: Meta<typeof BaseTooltip> = {\n  title: \"Components/BaseTooltip\",\n  component: BaseTooltip,\n  args: {\n    onOpenChange: fn(),\n    children: <BaseButton>Hover me!</BaseButton>, // anything can be used as a trigger\n    tooltipContent: <div data-testid=\"tooltip-content\">This is a tooltip</div>,\n    trigger: undefined, // means that it triggers on both focus and hover\n    delay: 0,\n    closeDelay: 0,\n  },\n};\n\nexport default meta;\ntype Story = StoryObj<typeof BaseTooltip>;\n\n// TODO: Note, this test is failing only in headless mode (so the CI will fail),\n// because the hover simulation does not trigger the onOpenChange event.\n// I'm unsure why this is happening, as the story/test passes in interactive mode.\n// Uncomment this test in the PR that fixes the issue\n// Basic tooltip with hover trigger\n// export const Basic: Story = {\n//   play: async ({ canvasElement, args }) => {\n//     const canvas = within(canvasElement);\n//     const trigger = canvas.getByText(\"Hover me!\");\n\n//     await waitFor(() =>\n//       expect(\n//         within(document.body).queryByTestId(\"tooltip-content\")\n//       ).not.toBeInTheDocument()\n//     );\n\n//     await userEvent.hover(trigger);\n\n//     // Check that tooltip appears\n//     await waitFor(() =>\n//       expect(\n//         within(document.body).queryByTestId(\"tooltip-content\")\n//       ).toBeInTheDocument()\n//     );\n\n//     expect(args.onOpenChange).toHaveBeenCalledWith(true);\n\n//     await userEvent.unhover(trigger);\n\n//     await waitFor(() => expect(args.onOpenChange).toHaveBeenCalledWith(false));\n//   },\n// };\n\n// Test only that the tooltip renders initially\nexport const AlwaysOpen: Story = {\n  args: {\n    isOpen: true, // Force tooltip to be open\n  },\n  play: async () => {\n    // Just verify the tooltip content is in the document\n    await waitFor(() =>\n      expect(\n        within(document.body).queryByTestId(\"tooltip-content\")\n      ).toBeInTheDocument()\n    );\n  },\n};\n\n// Tooltip with focus trigger\nexport const FocusTrigger: Story = {\n  play: async ({ args }) => {\n    await waitFor(() =>\n      expect(\n        within(document.body).queryByTestId(\"tooltip-content\")\n      ).not.toBeInTheDocument()\n    );\n\n    // Focus trigger\n    await userEvent.tab();\n\n    // Check that tooltip appears\n    await waitFor(() =>\n      expect(\n        within(document.body).queryByTestId(\"tooltip-content\")\n      ).toBeInTheDocument()\n    );\n\n    expect(args.onOpenChange).toHaveBeenCalledWith(true);\n\n    // Move focus away\n    await userEvent.tab();\n    await waitFor(() => expect(args.onOpenChange).toHaveBeenCalledWith(false));\n  },\n};\n\n// Tooltip with focus trigger only\nexport const FocusTriggerOnly: Story = {\n  args: {\n    trigger: \"focus\",\n  },\n  play: async ({ args, canvasElement }) => {\n    const canvas = within(canvasElement);\n    const trigger = canvas.getByText(\"Hover me!\");\n\n    await waitFor(() =>\n      expect(\n        within(document.body).queryByTestId(\"tooltip-content\")\n      ).not.toBeInTheDocument()\n    );\n\n    // Hover over trigger\n    await userEvent.hover(trigger);\n\n    // Check that tooltip does NOT appear on hover\n    await waitFor(() =>\n      expect(\n        within(document.body).queryByTestId(\"tooltip-content\")\n      ).not.toBeInTheDocument()\n    );\n\n    expect(args.onOpenChange).not.toHaveBeenCalled();\n\n    // Move mouse away\n    await userEvent.unhover(trigger);\n\n    // Focus trigger\n    await userEvent.tab();\n\n    // Check that tooltip DOES appear on focus\n    await waitFor(() =>\n      expect(\n        within(document.body).queryByTestId(\"tooltip-content\")\n      ).toBeInTheDocument()\n    );\n\n    expect(args.onOpenChange).toHaveBeenCalledWith(true);\n\n    // Move focus away\n    await userEvent.tab();\n    await waitFor(() => expect(args.onOpenChange).toHaveBeenCalledWith(false));\n  },\n};\n\n// Disabled tooltip\nexport const Disabled: Story = {\n  args: {\n    isDisabled: true,\n  },\n  play: async ({ args, canvasElement }) => {\n    const canvas = within(canvasElement);\n    const trigger = canvas.getByText(\"Hover me!\");\n\n    await waitFor(() =>\n      expect(\n        within(document.body).queryByTestId(\"tooltip-content\")\n      ).not.toBeInTheDocument()\n    );\n\n    // Focus trigger\n    await userEvent.tab();\n\n    // Check that the disabled tooltip does NOT appear\n    await waitFor(() =>\n      expect(\n        within(document.body).queryByTestId(\"tooltip-content\")\n      ).not.toBeInTheDocument()\n    );\n\n    expect(args.onOpenChange).not.toHaveBeenCalled();\n\n    await userEvent.hover(trigger);\n  },\n};\n\nexport const SelectedInCanvas: Story = {\n  render: ({ __plasmic_selection_prop__, ...args }) => {\n    const [selected, setSelected] = useState(false);\n    const [selectedSlotName, setSelectedSlotName] = useState(\"\");\n\n    useEffect(() => {\n      setTimeout(() => {\n        setSelected(true);\n        setTimeout(() => {\n          // Simulate trigger slot selection in Plasmic canvas\n          setSelectedSlotName(\"children\");\n        }, 1000);\n      }, 1000);\n    }, []);\n\n    return (\n      // Simulate Plasmic canvas envirnment\n      <PlasmicCanvasContext.Provider\n        value={{\n          componentName: \"test\",\n          globalVariants: {},\n        }}\n      >\n        <BaseTooltip\n          {...args}\n          // Simulate node selection in Plasmic canvas\n          __plasmic_selection_prop__={{\n            isSelected: selected,\n            selectedSlotName,\n          }}\n          {...args}\n        />\n      </PlasmicCanvasContext.Provider>\n    );\n  },\n  play: async () => {\n    await waitFor(() =>\n      expect(\n        within(document.body).queryByTestId(\"tooltip-content\")\n      ).not.toBeInTheDocument()\n    );\n\n    await waitFor(\n      () =>\n        expect(\n          within(document.body).queryByTestId(\"tooltip-content\")\n        ).toBeInTheDocument(),\n      { timeout: 1100 }\n    );\n\n    await waitFor(\n      () =>\n        expect(\n          within(document.body).queryByTestId(\"tooltip-content\")\n        ).not.toBeInTheDocument(),\n      { timeout: 1100 }\n    );\n  },\n};\n"],"names":["BaseTooltip","fn","React","BaseButton","waitFor","expect","within","userEvent","useState","useEffect","PlasmicCanvasContext"],"mappings":"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"}

package/skinny/registerTooltip.stories.esm.js

@@ -53,22 +53,6 @@ const meta = {
     // means that it triggers on both focus and hover
     delay: 0,
     closeDelay: 0
-  },
-  //   TODO: Currently, the BaseTooltip component cannot be uncontrolled, because a false is assumed for isOpen prop, if it is undefined
-  //   Remove this render function in the PR that fixes the issue
-  render: (_a) => {
-    var _b = _a, { isOpen, onOpenChange } = _b, args = __objRest(_b, ["isOpen", "onOpenChange"]);
-    const [open, setOpen] = useState(isOpen);
-    return /* @__PURE__ */ React.createElement(
-      BaseTooltip,
-      __spreadValues({
-        isOpen: open,
-        onOpenChange: (newValue) => {
-          setOpen(newValue);
-          onOpenChange == null ? void 0 : onOpenChange(newValue);
-        }
-      }, args)
-    );
   }
 };
 const AlwaysOpen = {
@@ -156,8 +140,8 @@ const Disabled = {
   }
 };
 const SelectedInCanvas = {
-  render: (_c) => {
-    var _d = _c, args = __objRest(_d, ["__plasmic_selection_prop__"]);
+  render: (_a) => {
+    var _b = _a, args = __objRest(_b, ["__plasmic_selection_prop__"]);
     const [selected, setSelected] = useState(false);
     const [selectedSlotName, setSelectedSlotName] = useState("");
     useEffect(() => {