@plasmicpkgs/react-aria 0.0.103 → 0.0.105

package/skinny/registerTooltip.stories.cjs.js

@@ -0,0 +1,228 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var host = require('@plasmicapp/host');
+var test = require('@storybook/test');
+var React = require('react');
+var registerButton = require('./registerButton.cjs.js');
+var registerTooltip = require('./registerTooltip.cjs.js');
+require('react-aria');
+require('react-aria-components');
+require('./common-b3b54c72.cjs.js');
+require('./utils-7d000fa4.cjs.js');
+require('@plasmicapp/host/registerComponent');
+require('./variant-utils-0ad70db8.cjs.js');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+const meta = {
+  title: "Components/BaseTooltip",
+  component: registerTooltip.BaseTooltip,
+  args: {
+    onOpenChange: test.fn(),
+    children: /* @__PURE__ */ React__default.default.createElement(registerButton.BaseButton, null, "Hover me!"),
+    // anything can be used as a trigger
+    tooltipContent: /* @__PURE__ */ React__default.default.createElement("div", { "data-testid": "tooltip-content" }, "This is a tooltip"),
+    trigger: void 0,
+    // 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 = {
+  args: {
+    isOpen: true
+    // Force tooltip to be open
+  },
+  play: async () => {
+    await test.waitFor(
+      () => test.expect(
+        test.within(document.body).queryByTestId("tooltip-content")
+      ).toBeInTheDocument()
+    );
+  }
+};
+const FocusTrigger = {
+  play: async ({ args }) => {
+    await test.waitFor(
+      () => test.expect(
+        test.within(document.body).queryByTestId("tooltip-content")
+      ).not.toBeInTheDocument()
+    );
+    await test.userEvent.tab();
+    await test.waitFor(
+      () => test.expect(
+        test.within(document.body).queryByTestId("tooltip-content")
+      ).toBeInTheDocument()
+    );
+    test.expect(args.onOpenChange).toHaveBeenCalledWith(true);
+    await test.userEvent.tab();
+    await test.waitFor(() => test.expect(args.onOpenChange).toHaveBeenCalledWith(false));
+  }
+};
+const FocusTriggerOnly = {
+  args: {
+    trigger: "focus"
+  },
+  play: async ({ args, canvasElement }) => {
+    const canvas = test.within(canvasElement);
+    const trigger = canvas.getByText("Hover me!");
+    await test.waitFor(
+      () => test.expect(
+        test.within(document.body).queryByTestId("tooltip-content")
+      ).not.toBeInTheDocument()
+    );
+    await test.userEvent.hover(trigger);
+    await test.waitFor(
+      () => test.expect(
+        test.within(document.body).queryByTestId("tooltip-content")
+      ).not.toBeInTheDocument()
+    );
+    test.expect(args.onOpenChange).not.toHaveBeenCalled();
+    await test.userEvent.unhover(trigger);
+    await test.userEvent.tab();
+    await test.waitFor(
+      () => test.expect(
+        test.within(document.body).queryByTestId("tooltip-content")
+      ).toBeInTheDocument()
+    );
+    test.expect(args.onOpenChange).toHaveBeenCalledWith(true);
+    await test.userEvent.tab();
+    await test.waitFor(() => test.expect(args.onOpenChange).toHaveBeenCalledWith(false));
+  }
+};
+const Disabled = {
+  args: {
+    isDisabled: true
+  },
+  play: async ({ args, canvasElement }) => {
+    const canvas = test.within(canvasElement);
+    const trigger = canvas.getByText("Hover me!");
+    await test.waitFor(
+      () => test.expect(
+        test.within(document.body).queryByTestId("tooltip-content")
+      ).not.toBeInTheDocument()
+    );
+    await test.userEvent.tab();
+    await test.waitFor(
+      () => test.expect(
+        test.within(document.body).queryByTestId("tooltip-content")
+      ).not.toBeInTheDocument()
+    );
+    test.expect(args.onOpenChange).not.toHaveBeenCalled();
+    await test.userEvent.hover(trigger);
+  }
+};
+const SelectedInCanvas = {
+  render: (_c) => {
+    var _d = _c, args = __objRest(_d, ["__plasmic_selection_prop__"]);
+    const [selected, setSelected] = React.useState(false);
+    const [selectedSlotName, setSelectedSlotName] = React.useState("");
+    React.useEffect(() => {
+      setTimeout(() => {
+        setSelected(true);
+        setTimeout(() => {
+          setSelectedSlotName("children");
+        }, 1e3);
+      }, 1e3);
+    }, []);
+    return (
+      // Simulate Plasmic canvas envirnment
+      /* @__PURE__ */ React__default.default.createElement(
+        host.PlasmicCanvasContext.Provider,
+        {
+          value: {
+            componentName: "test",
+            globalVariants: {}
+          }
+        },
+        /* @__PURE__ */ React__default.default.createElement(
+          registerTooltip.BaseTooltip,
+          __spreadValues(__spreadProps(__spreadValues({}, args), {
+            __plasmic_selection_prop__: {
+              isSelected: selected,
+              selectedSlotName
+            }
+          }), args)
+        )
+      )
+    );
+  },
+  play: async () => {
+    await test.waitFor(
+      () => test.expect(
+        test.within(document.body).queryByTestId("tooltip-content")
+      ).not.toBeInTheDocument()
+    );
+    await test.waitFor(
+      () => test.expect(
+        test.within(document.body).queryByTestId("tooltip-content")
+      ).toBeInTheDocument(),
+      { timeout: 1100 }
+    );
+    await test.waitFor(
+      () => test.expect(
+        test.within(document.body).queryByTestId("tooltip-content")
+      ).not.toBeInTheDocument(),
+      { timeout: 1100 }
+    );
+  }
+};
+
+exports.AlwaysOpen = AlwaysOpen;
+exports.Disabled = Disabled;
+exports.FocusTrigger = FocusTrigger;
+exports.FocusTriggerOnly = FocusTriggerOnly;
+exports.SelectedInCanvas = SelectedInCanvas;
+exports.default = meta;
+//# sourceMappingURL=registerTooltip.stories.cjs.js.map

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

@@ -0,0 +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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"}

package/skinny/registerTooltip.stories.esm.js

@@ -0,0 +1,215 @@
+import { PlasmicCanvasContext } from '@plasmicapp/host';
+import { fn, waitFor, expect, within, userEvent } from '@storybook/test';
+import React, { useState, useEffect } from 'react';
+import { BaseButton } from './registerButton.esm.js';
+import { BaseTooltip } from './registerTooltip.esm.js';
+import 'react-aria';
+import 'react-aria-components';
+import './common-ceebbaea.esm.js';
+import './utils-5d1b4c6b.esm.js';
+import '@plasmicapp/host/registerComponent';
+import './variant-utils-4405ebb0.esm.js';
+
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+const meta = {
+  title: "Components/BaseTooltip",
+  component: BaseTooltip,
+  args: {
+    onOpenChange: fn(),
+    children: /* @__PURE__ */ React.createElement(BaseButton, null, "Hover me!"),
+    // anything can be used as a trigger
+    tooltipContent: /* @__PURE__ */ React.createElement("div", { "data-testid": "tooltip-content" }, "This is a tooltip"),
+    trigger: void 0,
+    // 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 = {
+  args: {
+    isOpen: true
+    // Force tooltip to be open
+  },
+  play: async () => {
+    await waitFor(
+      () => expect(
+        within(document.body).queryByTestId("tooltip-content")
+      ).toBeInTheDocument()
+    );
+  }
+};
+const FocusTrigger = {
+  play: async ({ args }) => {
+    await waitFor(
+      () => expect(
+        within(document.body).queryByTestId("tooltip-content")
+      ).not.toBeInTheDocument()
+    );
+    await userEvent.tab();
+    await waitFor(
+      () => expect(
+        within(document.body).queryByTestId("tooltip-content")
+      ).toBeInTheDocument()
+    );
+    expect(args.onOpenChange).toHaveBeenCalledWith(true);
+    await userEvent.tab();
+    await waitFor(() => expect(args.onOpenChange).toHaveBeenCalledWith(false));
+  }
+};
+const FocusTriggerOnly = {
+  args: {
+    trigger: "focus"
+  },
+  play: async ({ args, canvasElement }) => {
+    const canvas = within(canvasElement);
+    const trigger = canvas.getByText("Hover me!");
+    await waitFor(
+      () => expect(
+        within(document.body).queryByTestId("tooltip-content")
+      ).not.toBeInTheDocument()
+    );
+    await userEvent.hover(trigger);
+    await waitFor(
+      () => expect(
+        within(document.body).queryByTestId("tooltip-content")
+      ).not.toBeInTheDocument()
+    );
+    expect(args.onOpenChange).not.toHaveBeenCalled();
+    await userEvent.unhover(trigger);
+    await userEvent.tab();
+    await waitFor(
+      () => expect(
+        within(document.body).queryByTestId("tooltip-content")
+      ).toBeInTheDocument()
+    );
+    expect(args.onOpenChange).toHaveBeenCalledWith(true);
+    await userEvent.tab();
+    await waitFor(() => expect(args.onOpenChange).toHaveBeenCalledWith(false));
+  }
+};
+const Disabled = {
+  args: {
+    isDisabled: true
+  },
+  play: async ({ args, canvasElement }) => {
+    const canvas = within(canvasElement);
+    const trigger = canvas.getByText("Hover me!");
+    await waitFor(
+      () => expect(
+        within(document.body).queryByTestId("tooltip-content")
+      ).not.toBeInTheDocument()
+    );
+    await userEvent.tab();
+    await waitFor(
+      () => expect(
+        within(document.body).queryByTestId("tooltip-content")
+      ).not.toBeInTheDocument()
+    );
+    expect(args.onOpenChange).not.toHaveBeenCalled();
+    await userEvent.hover(trigger);
+  }
+};
+const SelectedInCanvas = {
+  render: (_c) => {
+    var _d = _c, args = __objRest(_d, ["__plasmic_selection_prop__"]);
+    const [selected, setSelected] = useState(false);
+    const [selectedSlotName, setSelectedSlotName] = useState("");
+    useEffect(() => {
+      setTimeout(() => {
+        setSelected(true);
+        setTimeout(() => {
+          setSelectedSlotName("children");
+        }, 1e3);
+      }, 1e3);
+    }, []);
+    return (
+      // Simulate Plasmic canvas envirnment
+      /* @__PURE__ */ React.createElement(
+        PlasmicCanvasContext.Provider,
+        {
+          value: {
+            componentName: "test",
+            globalVariants: {}
+          }
+        },
+        /* @__PURE__ */ React.createElement(
+          BaseTooltip,
+          __spreadValues(__spreadProps(__spreadValues({}, args), {
+            __plasmic_selection_prop__: {
+              isSelected: selected,
+              selectedSlotName
+            }
+          }), args)
+        )
+      )
+    );
+  },
+  play: async () => {
+    await waitFor(
+      () => expect(
+        within(document.body).queryByTestId("tooltip-content")
+      ).not.toBeInTheDocument()
+    );
+    await waitFor(
+      () => expect(
+        within(document.body).queryByTestId("tooltip-content")
+      ).toBeInTheDocument(),
+      { timeout: 1100 }
+    );
+    await waitFor(
+      () => expect(
+        within(document.body).queryByTestId("tooltip-content")
+      ).not.toBeInTheDocument(),
+      { timeout: 1100 }
+    );
+  }
+};
+
+export { AlwaysOpen, Disabled, FocusTrigger, FocusTriggerOnly, SelectedInCanvas, meta as default };
+//# sourceMappingURL=registerTooltip.stories.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"registerTooltip.stories.esm.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":[],"mappings":"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"}

package/skinny/utils-5d1b4c6b.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils-5d1b4c6b.esm.js","sources":["../src/utils.ts"],"sourcesContent":["import {\n  usePlasmicCanvasComponentInfo,\n  usePlasmicCanvasContext,\n  type CodeComponentMeta,\n} from \"@plasmicapp/host\";\nimport registerComponent from \"@plasmicapp/host/registerComponent\";\nimport React, { useEffect } from \"react\";\n\nexport type HasControlContextData<T = BaseControlContextData> = {\n  setControlContextData?: (ctxData: T) => void;\n};\n\nexport type BaseControlContextData = {\n  parent?: {\n    isDisabled?: boolean;\n    isReadOnly?: boolean;\n  };\n};\n\nexport type Registerable = {\n  registerComponent: typeof registerComponent;\n};\n\nexport type OtherCodeComponentsMeta = {\n  text: CodeComponentMeta<any>;\n  description: CodeComponentMeta<any>;\n};\n\nexport type CodeComponentMetaOverrides<T extends React.ComponentType<any>> =\n  Partial<\n    Pick<\n      CodeComponentMeta<React.ComponentProps<T>>,\n      \"parentComponentName\" | \"props\" | \"displayName\" | \"name\"\n    >\n  >;\n\nexport function useAutoOpen({\n  props,\n  open,\n  close,\n}: {\n  props: any;\n  open?: () => void;\n  close?: () => void;\n}) {\n  const inPlasmicCanvas = !!usePlasmicCanvasContext();\n  const isSelected =\n    usePlasmicCanvasComponentInfo?.(props)?.isSelected ?? false;\n\n  useEffect(() => {\n    // selection in outline tab only matters in canvas\n    if (!inPlasmicCanvas) {\n      return;\n    }\n    if (isSelected) {\n      open?.();\n    } else {\n      close?.();\n    }\n    // Not putting open and close in the useEffect dependencies array, because it causes a re-render loop.\n  }, [isSelected, inPlasmicCanvas]);\n}\n\nexport function registerComponentHelper<T extends React.ComponentType<any>>(\n  loader: Registerable | undefined,\n  component: T,\n  meta: CodeComponentMeta<React.ComponentProps<T>>,\n  overrides?: CodeComponentMetaOverrides<T>\n) {\n  if (overrides) {\n    meta = {\n      ...meta,\n      ...overrides,\n      props: {\n        ...meta.props,\n        ...overrides.props,\n      },\n    };\n    if (overrides.parentComponentName) {\n      meta.name = makeChildComponentName(\n        overrides.parentComponentName,\n        meta.name\n      );\n    }\n  }\n  if (loader) {\n    loader.registerComponent(component, meta);\n  } else {\n    registerComponent(component, meta);\n  }\n  return meta;\n}\n\nexport function makeComponentName(name: string) {\n  return `plasmic-react-aria-${name}`;\n}\n\nexport function makeChildComponentName(\n  fullParentName: string | undefined,\n  fullChildName: string\n) {\n  if (!fullParentName) {\n    return fullChildName;\n  }\n  return `${fullParentName}-${fullChildName.replace(\n    \"plasmic-react-aria-\",\n    \"\"\n  )}`;\n}\n\nexport interface Styleable {\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport function extractPlasmicDataProps(props: Record<string, any>) {\n  return Object.fromEntries(\n    Object.entries(props).filter(([key]) => key.startsWith(\"data-plasmic-\"))\n  );\n}\n\nexport function withoutNils<T>(array: (T | undefined | null)[]) {\n  return array.filter((x): x is T => x != null);\n}\n\nexport function isDefined<T>(thing: T | undefined | null): thing is T {\n  return thing !== undefined && thing !== null;\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAoCO,SAAS,WAAY,CAAA;AAAA,EAC1B,KAAA;AAAA,EACA,IAAA;AAAA,EACA,KAAA;AACF,CAIG,EAAA;AA5CH,EAAA,IAAA,EAAA,EAAA,EAAA,EAAA,EAAA,CAAA;AA6CE,EAAM,MAAA,eAAA,GAAkB,CAAC,CAAC,uBAAwB,EAAA,CAAA;AAClD,EAAA,MAAM,UACJ,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,6BAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAgC,KAAhC,CAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAwC,eAAxC,IAAsD,GAAA,EAAA,GAAA,KAAA,CAAA;AAExD,EAAA,SAAA,CAAU,MAAM;AAEd,IAAA,IAAI,CAAC,eAAiB,EAAA;AACpB,MAAA,OAAA;AAAA,KACF;AACA,IAAA,IAAI,UAAY,EAAA;AACd,MAAA,IAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,IAAA,EAAA,CAAA;AAAA,KACK,MAAA;AACL,MAAA,KAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,KAAA,EAAA,CAAA;AAAA,KACF;AAAA,GAEC,EAAA,CAAC,UAAY,EAAA,eAAe,CAAC,CAAA,CAAA;AAClC,CAAA;AAEO,SAAS,uBACd,CAAA,MAAA,EACA,SACA,EAAA,IAAA,EACA,SACA,EAAA;AACA,EAAA,IAAI,SAAW,EAAA;AACb,IAAO,IAAA,GAAA,aAAA,CAAA,cAAA,CAAA,cAAA,CAAA,EAAA,EACF,OACA,SAFE,CAAA,EAAA;AAAA,MAGL,KAAO,EAAA,cAAA,CAAA,cAAA,CAAA,EAAA,EACF,IAAK,CAAA,KAAA,CAAA,EACL,SAAU,CAAA,KAAA,CAAA;AAAA,KAEjB,CAAA,CAAA;AACA,IAAA,IAAI,UAAU,mBAAqB,EAAA;AACjC,MAAA,IAAA,CAAK,IAAO,GAAA,sBAAA;AAAA,QACV,SAAU,CAAA,mBAAA;AAAA,QACV,IAAK,CAAA,IAAA;AAAA,OACP,CAAA;AAAA,KACF;AAAA,GACF;AACA,EAAA,IAAI,MAAQ,EAAA;AACV,IAAO,MAAA,CAAA,iBAAA,CAAkB,WAAW,IAAI,CAAA,CAAA;AAAA,GACnC,MAAA;AACL,IAAA,iBAAA,CAAkB,WAAW,IAAI,CAAA,CAAA;AAAA,GACnC;AACA,EAAO,OAAA,IAAA,CAAA;AACT,CAAA;AAEO,SAAS,kBAAkB,IAAc,EAAA;AAC9C,EAAA,OAAO,CAAsB,mBAAA,EAAA,IAAA,CAAA,CAAA,CAAA;AAC/B,CAAA;AAEgB,SAAA,sBAAA,CACd,gBACA,aACA,EAAA;AACA,EAAA,IAAI,CAAC,cAAgB,EAAA;AACnB,IAAO,OAAA,aAAA,CAAA;AAAA,GACT;AACA,EAAO,OAAA,CAAA,EAAG,kBAAkB,aAAc,CAAA,OAAA;AAAA,IACxC,qBAAA;AAAA,IACA,EAAA;AAAA,GACF,CAAA,CAAA,CAAA;AACF,CAAA;AAOO,SAAS,wBAAwB,KAA4B,EAAA;AAClE,EAAA,OAAO,MAAO,CAAA,WAAA;AAAA,IACZ,MAAO,CAAA,OAAA,CAAQ,KAAK,CAAA,CAAE,MAAO,CAAA,CAAC,CAAC,GAAG,CAAM,KAAA,GAAA,CAAI,UAAW,CAAA,eAAe,CAAC,CAAA;AAAA,GACzE,CAAA;AACF,CAAA;AAMO,SAAS,UAAa,KAAyC,EAAA;AACpE,EAAO,OAAA,KAAA,KAAU,UAAa,KAAU,KAAA,IAAA,CAAA;AAC1C;;;;"}
+{"version":3,"file":"utils-5d1b4c6b.esm.js","sources":["../src/utils.ts"],"sourcesContent":["import {\n  usePlasmicCanvasComponentInfo,\n  usePlasmicCanvasContext,\n  type CodeComponentMeta,\n} from \"@plasmicapp/host\";\nimport registerComponent from \"@plasmicapp/host/registerComponent\";\nimport React, { useEffect } from \"react\";\n\nexport type HasControlContextData<T = BaseControlContextData> = {\n  setControlContextData?: (ctxData: T) => void;\n};\n\nexport type WithPlasmicCanvasComponentInfo = {\n  __plasmic_selection_prop__?: {\n    isSelected: boolean;\n    selectedSlotName?: string | undefined;\n  };\n};\n\nexport type BaseControlContextData = {\n  parent?: {\n    isDisabled?: boolean;\n    isReadOnly?: boolean;\n  };\n};\n\nexport type Registerable = {\n  registerComponent: typeof registerComponent;\n};\n\nexport type OtherCodeComponentsMeta = {\n  text: CodeComponentMeta<any>;\n  description: CodeComponentMeta<any>;\n};\n\nexport type CodeComponentMetaOverrides<T extends React.ComponentType<any>> =\n  Partial<\n    Pick<\n      CodeComponentMeta<React.ComponentProps<T>>,\n      \"parentComponentName\" | \"props\" | \"displayName\" | \"name\"\n    >\n  >;\n\nexport function useAutoOpen({\n  props,\n  open,\n  close,\n}: {\n  props: any;\n  open?: () => void;\n  close?: () => void;\n}) {\n  const inPlasmicCanvas = !!usePlasmicCanvasContext();\n  const isSelected =\n    usePlasmicCanvasComponentInfo?.(props)?.isSelected ?? false;\n\n  useEffect(() => {\n    // selection in outline tab only matters in canvas\n    if (!inPlasmicCanvas) {\n      return;\n    }\n    if (isSelected) {\n      open?.();\n    } else {\n      close?.();\n    }\n    // Not putting open and close in the useEffect dependencies array, because it causes a re-render loop.\n  }, [isSelected, inPlasmicCanvas]);\n}\n\nexport function registerComponentHelper<T extends React.ComponentType<any>>(\n  loader: Registerable | undefined,\n  component: T,\n  meta: CodeComponentMeta<React.ComponentProps<T>>,\n  overrides?: CodeComponentMetaOverrides<T>\n) {\n  if (overrides) {\n    meta = {\n      ...meta,\n      ...overrides,\n      props: {\n        ...meta.props,\n        ...overrides.props,\n      },\n    };\n    if (overrides.parentComponentName) {\n      meta.name = makeChildComponentName(\n        overrides.parentComponentName,\n        meta.name\n      );\n    }\n  }\n  if (loader) {\n    loader.registerComponent(component, meta);\n  } else {\n    registerComponent(component, meta);\n  }\n  return meta;\n}\n\nexport function makeComponentName(name: string) {\n  return `plasmic-react-aria-${name}`;\n}\n\nexport function makeChildComponentName(\n  fullParentName: string | undefined,\n  fullChildName: string\n) {\n  if (!fullParentName) {\n    return fullChildName;\n  }\n  return `${fullParentName}-${fullChildName.replace(\n    \"plasmic-react-aria-\",\n    \"\"\n  )}`;\n}\n\nexport interface Styleable {\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport function extractPlasmicDataProps(props: Record<string, any>) {\n  return Object.fromEntries(\n    Object.entries(props).filter(([key]) => key.startsWith(\"data-plasmic-\"))\n  );\n}\n\nexport function withoutNils<T>(array: (T | undefined | null)[]) {\n  return array.filter((x): x is T => x != null);\n}\n\nexport function isDefined<T>(thing: T | undefined | null): thing is T {\n  return thing !== undefined && thing !== null;\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AA2CO,SAAS,WAAY,CAAA;AAAA,EAC1B,KAAA;AAAA,EACA,IAAA;AAAA,EACA,KAAA;AACF,CAIG,EAAA;AAnDH,EAAA,IAAA,EAAA,EAAA,EAAA,EAAA,EAAA,CAAA;AAoDE,EAAM,MAAA,eAAA,GAAkB,CAAC,CAAC,uBAAwB,EAAA,CAAA;AAClD,EAAA,MAAM,UACJ,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,6BAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAgC,KAAhC,CAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAwC,eAAxC,IAAsD,GAAA,EAAA,GAAA,KAAA,CAAA;AAExD,EAAA,SAAA,CAAU,MAAM;AAEd,IAAA,IAAI,CAAC,eAAiB,EAAA;AACpB,MAAA,OAAA;AAAA,KACF;AACA,IAAA,IAAI,UAAY,EAAA;AACd,MAAA,IAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,IAAA,EAAA,CAAA;AAAA,KACK,MAAA;AACL,MAAA,KAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,KAAA,EAAA,CAAA;AAAA,KACF;AAAA,GAEC,EAAA,CAAC,UAAY,EAAA,eAAe,CAAC,CAAA,CAAA;AAClC,CAAA;AAEO,SAAS,uBACd,CAAA,MAAA,EACA,SACA,EAAA,IAAA,EACA,SACA,EAAA;AACA,EAAA,IAAI,SAAW,EAAA;AACb,IAAO,IAAA,GAAA,aAAA,CAAA,cAAA,CAAA,cAAA,CAAA,EAAA,EACF,OACA,SAFE,CAAA,EAAA;AAAA,MAGL,KAAO,EAAA,cAAA,CAAA,cAAA,CAAA,EAAA,EACF,IAAK,CAAA,KAAA,CAAA,EACL,SAAU,CAAA,KAAA,CAAA;AAAA,KAEjB,CAAA,CAAA;AACA,IAAA,IAAI,UAAU,mBAAqB,EAAA;AACjC,MAAA,IAAA,CAAK,IAAO,GAAA,sBAAA;AAAA,QACV,SAAU,CAAA,mBAAA;AAAA,QACV,IAAK,CAAA,IAAA;AAAA,OACP,CAAA;AAAA,KACF;AAAA,GACF;AACA,EAAA,IAAI,MAAQ,EAAA;AACV,IAAO,MAAA,CAAA,iBAAA,CAAkB,WAAW,IAAI,CAAA,CAAA;AAAA,GACnC,MAAA;AACL,IAAA,iBAAA,CAAkB,WAAW,IAAI,CAAA,CAAA;AAAA,GACnC;AACA,EAAO,OAAA,IAAA,CAAA;AACT,CAAA;AAEO,SAAS,kBAAkB,IAAc,EAAA;AAC9C,EAAA,OAAO,CAAsB,mBAAA,EAAA,IAAA,CAAA,CAAA,CAAA;AAC/B,CAAA;AAEgB,SAAA,sBAAA,CACd,gBACA,aACA,EAAA;AACA,EAAA,IAAI,CAAC,cAAgB,EAAA;AACnB,IAAO,OAAA,aAAA,CAAA;AAAA,GACT;AACA,EAAO,OAAA,CAAA,EAAG,kBAAkB,aAAc,CAAA,OAAA;AAAA,IACxC,qBAAA;AAAA,IACA,EAAA;AAAA,GACF,CAAA,CAAA,CAAA;AACF,CAAA;AAOO,SAAS,wBAAwB,KAA4B,EAAA;AAClE,EAAA,OAAO,MAAO,CAAA,WAAA;AAAA,IACZ,MAAO,CAAA,OAAA,CAAQ,KAAK,CAAA,CAAE,MAAO,CAAA,CAAC,CAAC,GAAG,CAAM,KAAA,GAAA,CAAI,UAAW,CAAA,eAAe,CAAC,CAAA;AAAA,GACzE,CAAA;AACF,CAAA;AAMO,SAAS,UAAa,KAAyC,EAAA;AACpE,EAAO,OAAA,KAAA,KAAU,UAAa,KAAU,KAAA,IAAA,CAAA;AAC1C;;;;"}

package/skinny/utils-7d000fa4.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils-7d000fa4.cjs.js","sources":["../src/utils.ts"],"sourcesContent":["import {\n  usePlasmicCanvasComponentInfo,\n  usePlasmicCanvasContext,\n  type CodeComponentMeta,\n} from \"@plasmicapp/host\";\nimport registerComponent from \"@plasmicapp/host/registerComponent\";\nimport React, { useEffect } from \"react\";\n\nexport type HasControlContextData<T = BaseControlContextData> = {\n  setControlContextData?: (ctxData: T) => void;\n};\n\nexport type BaseControlContextData = {\n  parent?: {\n    isDisabled?: boolean;\n    isReadOnly?: boolean;\n  };\n};\n\nexport type Registerable = {\n  registerComponent: typeof registerComponent;\n};\n\nexport type OtherCodeComponentsMeta = {\n  text: CodeComponentMeta<any>;\n  description: CodeComponentMeta<any>;\n};\n\nexport type CodeComponentMetaOverrides<T extends React.ComponentType<any>> =\n  Partial<\n    Pick<\n      CodeComponentMeta<React.ComponentProps<T>>,\n      \"parentComponentName\" | \"props\" | \"displayName\" | \"name\"\n    >\n  >;\n\nexport function useAutoOpen({\n  props,\n  open,\n  close,\n}: {\n  props: any;\n  open?: () => void;\n  close?: () => void;\n}) {\n  const inPlasmicCanvas = !!usePlasmicCanvasContext();\n  const isSelected =\n    usePlasmicCanvasComponentInfo?.(props)?.isSelected ?? false;\n\n  useEffect(() => {\n    // selection in outline tab only matters in canvas\n    if (!inPlasmicCanvas) {\n      return;\n    }\n    if (isSelected) {\n      open?.();\n    } else {\n      close?.();\n    }\n    // Not putting open and close in the useEffect dependencies array, because it causes a re-render loop.\n  }, [isSelected, inPlasmicCanvas]);\n}\n\nexport function registerComponentHelper<T extends React.ComponentType<any>>(\n  loader: Registerable | undefined,\n  component: T,\n  meta: CodeComponentMeta<React.ComponentProps<T>>,\n  overrides?: CodeComponentMetaOverrides<T>\n) {\n  if (overrides) {\n    meta = {\n      ...meta,\n      ...overrides,\n      props: {\n        ...meta.props,\n        ...overrides.props,\n      },\n    };\n    if (overrides.parentComponentName) {\n      meta.name = makeChildComponentName(\n        overrides.parentComponentName,\n        meta.name\n      );\n    }\n  }\n  if (loader) {\n    loader.registerComponent(component, meta);\n  } else {\n    registerComponent(component, meta);\n  }\n  return meta;\n}\n\nexport function makeComponentName(name: string) {\n  return `plasmic-react-aria-${name}`;\n}\n\nexport function makeChildComponentName(\n  fullParentName: string | undefined,\n  fullChildName: string\n) {\n  if (!fullParentName) {\n    return fullChildName;\n  }\n  return `${fullParentName}-${fullChildName.replace(\n    \"plasmic-react-aria-\",\n    \"\"\n  )}`;\n}\n\nexport interface Styleable {\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport function extractPlasmicDataProps(props: Record<string, any>) {\n  return Object.fromEntries(\n    Object.entries(props).filter(([key]) => key.startsWith(\"data-plasmic-\"))\n  );\n}\n\nexport function withoutNils<T>(array: (T | undefined | null)[]) {\n  return array.filter((x): x is T => x != null);\n}\n\nexport function isDefined<T>(thing: T | undefined | null): thing is T {\n  return thing !== undefined && thing !== null;\n}\n"],"names":["usePlasmicCanvasContext","usePlasmicCanvasComponentInfo","useEffect","registerComponent"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCO,SAAS,WAAY,CAAA;AAAA,EAC1B,KAAA;AAAA,EACA,IAAA;AAAA,EACA,KAAA;AACF,CAIG,EAAA;AA5CH,EAAA,IAAA,EAAA,EAAA,EAAA,EAAA,EAAA,CAAA;AA6CE,EAAM,MAAA,eAAA,GAAkB,CAAC,CAACA,4BAAwB,EAAA,CAAA;AAClD,EAAA,MAAM,UACJ,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAAC,kCAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAgC,KAAhC,CAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAwC,eAAxC,IAAsD,GAAA,EAAA,GAAA,KAAA,CAAA;AAExD,EAAAC,eAAA,CAAU,MAAM;AAEd,IAAA,IAAI,CAAC,eAAiB,EAAA;AACpB,MAAA,OAAA;AAAA,KACF;AACA,IAAA,IAAI,UAAY,EAAA;AACd,MAAA,IAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,IAAA,EAAA,CAAA;AAAA,KACK,MAAA;AACL,MAAA,KAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,KAAA,EAAA,CAAA;AAAA,KACF;AAAA,GAEC,EAAA,CAAC,UAAY,EAAA,eAAe,CAAC,CAAA,CAAA;AAClC,CAAA;AAEO,SAAS,uBACd,CAAA,MAAA,EACA,SACA,EAAA,IAAA,EACA,SACA,EAAA;AACA,EAAA,IAAI,SAAW,EAAA;AACb,IAAO,IAAA,GAAA,aAAA,CAAA,cAAA,CAAA,cAAA,CAAA,EAAA,EACF,OACA,SAFE,CAAA,EAAA;AAAA,MAGL,KAAO,EAAA,cAAA,CAAA,cAAA,CAAA,EAAA,EACF,IAAK,CAAA,KAAA,CAAA,EACL,SAAU,CAAA,KAAA,CAAA;AAAA,KAEjB,CAAA,CAAA;AACA,IAAA,IAAI,UAAU,mBAAqB,EAAA;AACjC,MAAA,IAAA,CAAK,IAAO,GAAA,sBAAA;AAAA,QACV,SAAU,CAAA,mBAAA;AAAA,QACV,IAAK,CAAA,IAAA;AAAA,OACP,CAAA;AAAA,KACF;AAAA,GACF;AACA,EAAA,IAAI,MAAQ,EAAA;AACV,IAAO,MAAA,CAAA,iBAAA,CAAkB,WAAW,IAAI,CAAA,CAAA;AAAA,GACnC,MAAA;AACL,IAAAC,kCAAA,CAAkB,WAAW,IAAI,CAAA,CAAA;AAAA,GACnC;AACA,EAAO,OAAA,IAAA,CAAA;AACT,CAAA;AAEO,SAAS,kBAAkB,IAAc,EAAA;AAC9C,EAAA,OAAO,CAAsB,mBAAA,EAAA,IAAA,CAAA,CAAA,CAAA;AAC/B,CAAA;AAEgB,SAAA,sBAAA,CACd,gBACA,aACA,EAAA;AACA,EAAA,IAAI,CAAC,cAAgB,EAAA;AACnB,IAAO,OAAA,aAAA,CAAA;AAAA,GACT;AACA,EAAO,OAAA,CAAA,EAAG,kBAAkB,aAAc,CAAA,OAAA;AAAA,IACxC,qBAAA;AAAA,IACA,EAAA;AAAA,GACF,CAAA,CAAA,CAAA;AACF,CAAA;AAOO,SAAS,wBAAwB,KAA4B,EAAA;AAClE,EAAA,OAAO,MAAO,CAAA,WAAA;AAAA,IACZ,MAAO,CAAA,OAAA,CAAQ,KAAK,CAAA,CAAE,MAAO,CAAA,CAAC,CAAC,GAAG,CAAM,KAAA,GAAA,CAAI,UAAW,CAAA,eAAe,CAAC,CAAA;AAAA,GACzE,CAAA;AACF,CAAA;AAMO,SAAS,UAAa,KAAyC,EAAA;AACpE,EAAO,OAAA,KAAA,KAAU,UAAa,KAAU,KAAA,IAAA,CAAA;AAC1C;;;;;;;;;"}
+{"version":3,"file":"utils-7d000fa4.cjs.js","sources":["../src/utils.ts"],"sourcesContent":["import {\n  usePlasmicCanvasComponentInfo,\n  usePlasmicCanvasContext,\n  type CodeComponentMeta,\n} from \"@plasmicapp/host\";\nimport registerComponent from \"@plasmicapp/host/registerComponent\";\nimport React, { useEffect } from \"react\";\n\nexport type HasControlContextData<T = BaseControlContextData> = {\n  setControlContextData?: (ctxData: T) => void;\n};\n\nexport type WithPlasmicCanvasComponentInfo = {\n  __plasmic_selection_prop__?: {\n    isSelected: boolean;\n    selectedSlotName?: string | undefined;\n  };\n};\n\nexport type BaseControlContextData = {\n  parent?: {\n    isDisabled?: boolean;\n    isReadOnly?: boolean;\n  };\n};\n\nexport type Registerable = {\n  registerComponent: typeof registerComponent;\n};\n\nexport type OtherCodeComponentsMeta = {\n  text: CodeComponentMeta<any>;\n  description: CodeComponentMeta<any>;\n};\n\nexport type CodeComponentMetaOverrides<T extends React.ComponentType<any>> =\n  Partial<\n    Pick<\n      CodeComponentMeta<React.ComponentProps<T>>,\n      \"parentComponentName\" | \"props\" | \"displayName\" | \"name\"\n    >\n  >;\n\nexport function useAutoOpen({\n  props,\n  open,\n  close,\n}: {\n  props: any;\n  open?: () => void;\n  close?: () => void;\n}) {\n  const inPlasmicCanvas = !!usePlasmicCanvasContext();\n  const isSelected =\n    usePlasmicCanvasComponentInfo?.(props)?.isSelected ?? false;\n\n  useEffect(() => {\n    // selection in outline tab only matters in canvas\n    if (!inPlasmicCanvas) {\n      return;\n    }\n    if (isSelected) {\n      open?.();\n    } else {\n      close?.();\n    }\n    // Not putting open and close in the useEffect dependencies array, because it causes a re-render loop.\n  }, [isSelected, inPlasmicCanvas]);\n}\n\nexport function registerComponentHelper<T extends React.ComponentType<any>>(\n  loader: Registerable | undefined,\n  component: T,\n  meta: CodeComponentMeta<React.ComponentProps<T>>,\n  overrides?: CodeComponentMetaOverrides<T>\n) {\n  if (overrides) {\n    meta = {\n      ...meta,\n      ...overrides,\n      props: {\n        ...meta.props,\n        ...overrides.props,\n      },\n    };\n    if (overrides.parentComponentName) {\n      meta.name = makeChildComponentName(\n        overrides.parentComponentName,\n        meta.name\n      );\n    }\n  }\n  if (loader) {\n    loader.registerComponent(component, meta);\n  } else {\n    registerComponent(component, meta);\n  }\n  return meta;\n}\n\nexport function makeComponentName(name: string) {\n  return `plasmic-react-aria-${name}`;\n}\n\nexport function makeChildComponentName(\n  fullParentName: string | undefined,\n  fullChildName: string\n) {\n  if (!fullParentName) {\n    return fullChildName;\n  }\n  return `${fullParentName}-${fullChildName.replace(\n    \"plasmic-react-aria-\",\n    \"\"\n  )}`;\n}\n\nexport interface Styleable {\n  className?: string;\n  style?: React.CSSProperties;\n}\n\nexport function extractPlasmicDataProps(props: Record<string, any>) {\n  return Object.fromEntries(\n    Object.entries(props).filter(([key]) => key.startsWith(\"data-plasmic-\"))\n  );\n}\n\nexport function withoutNils<T>(array: (T | undefined | null)[]) {\n  return array.filter((x): x is T => x != null);\n}\n\nexport function isDefined<T>(thing: T | undefined | null): thing is T {\n  return thing !== undefined && thing !== null;\n}\n"],"names":["usePlasmicCanvasContext","usePlasmicCanvasComponentInfo","useEffect","registerComponent"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2CO,SAAS,WAAY,CAAA;AAAA,EAC1B,KAAA;AAAA,EACA,IAAA;AAAA,EACA,KAAA;AACF,CAIG,EAAA;AAnDH,EAAA,IAAA,EAAA,EAAA,EAAA,EAAA,EAAA,CAAA;AAoDE,EAAM,MAAA,eAAA,GAAkB,CAAC,CAACA,4BAAwB,EAAA,CAAA;AAClD,EAAA,MAAM,UACJ,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAAC,kCAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAgC,KAAhC,CAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAwC,eAAxC,IAAsD,GAAA,EAAA,GAAA,KAAA,CAAA;AAExD,EAAAC,eAAA,CAAU,MAAM;AAEd,IAAA,IAAI,CAAC,eAAiB,EAAA;AACpB,MAAA,OAAA;AAAA,KACF;AACA,IAAA,IAAI,UAAY,EAAA;AACd,MAAA,IAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,IAAA,EAAA,CAAA;AAAA,KACK,MAAA;AACL,MAAA,KAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,KAAA,EAAA,CAAA;AAAA,KACF;AAAA,GAEC,EAAA,CAAC,UAAY,EAAA,eAAe,CAAC,CAAA,CAAA;AAClC,CAAA;AAEO,SAAS,uBACd,CAAA,MAAA,EACA,SACA,EAAA,IAAA,EACA,SACA,EAAA;AACA,EAAA,IAAI,SAAW,EAAA;AACb,IAAO,IAAA,GAAA,aAAA,CAAA,cAAA,CAAA,cAAA,CAAA,EAAA,EACF,OACA,SAFE,CAAA,EAAA;AAAA,MAGL,KAAO,EAAA,cAAA,CAAA,cAAA,CAAA,EAAA,EACF,IAAK,CAAA,KAAA,CAAA,EACL,SAAU,CAAA,KAAA,CAAA;AAAA,KAEjB,CAAA,CAAA;AACA,IAAA,IAAI,UAAU,mBAAqB,EAAA;AACjC,MAAA,IAAA,CAAK,IAAO,GAAA,sBAAA;AAAA,QACV,SAAU,CAAA,mBAAA;AAAA,QACV,IAAK,CAAA,IAAA;AAAA,OACP,CAAA;AAAA,KACF;AAAA,GACF;AACA,EAAA,IAAI,MAAQ,EAAA;AACV,IAAO,MAAA,CAAA,iBAAA,CAAkB,WAAW,IAAI,CAAA,CAAA;AAAA,GACnC,MAAA;AACL,IAAAC,kCAAA,CAAkB,WAAW,IAAI,CAAA,CAAA;AAAA,GACnC;AACA,EAAO,OAAA,IAAA,CAAA;AACT,CAAA;AAEO,SAAS,kBAAkB,IAAc,EAAA;AAC9C,EAAA,OAAO,CAAsB,mBAAA,EAAA,IAAA,CAAA,CAAA,CAAA;AAC/B,CAAA;AAEgB,SAAA,sBAAA,CACd,gBACA,aACA,EAAA;AACA,EAAA,IAAI,CAAC,cAAgB,EAAA;AACnB,IAAO,OAAA,aAAA,CAAA;AAAA,GACT;AACA,EAAO,OAAA,CAAA,EAAG,kBAAkB,aAAc,CAAA,OAAA;AAAA,IACxC,qBAAA;AAAA,IACA,EAAA;AAAA,GACF,CAAA,CAAA,CAAA;AACF,CAAA;AAOO,SAAS,wBAAwB,KAA4B,EAAA;AAClE,EAAA,OAAO,MAAO,CAAA,WAAA;AAAA,IACZ,MAAO,CAAA,OAAA,CAAQ,KAAK,CAAA,CAAE,MAAO,CAAA,CAAC,CAAC,GAAG,CAAM,KAAA,GAAA,CAAI,UAAW,CAAA,eAAe,CAAC,CAAA;AAAA,GACzE,CAAA;AACF,CAAA;AAMO,SAAS,UAAa,KAAyC,EAAA;AACpE,EAAO,OAAA,KAAA,KAAU,UAAa,KAAU,KAAA,IAAA,CAAA;AAC1C;;;;;;;;;"}

package/skinny/utils.d.ts

@@ -4,6 +4,12 @@ import React from "react";
 export type HasControlContextData<T = BaseControlContextData> = {
     setControlContextData?: (ctxData: T) => void;
 };
+export type WithPlasmicCanvasComponentInfo = {
+    __plasmic_selection_prop__?: {
+        isSelected: boolean;
+        selectedSlotName?: string | undefined;
+    };
+};
 export type BaseControlContextData = {
     parent?: {
         isDisabled?: boolean;