@plasmicpkgs/react-aria 0.0.103 → 0.0.105
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/.tsbuildinfo +1 -1
- package/dist/react-aria.esm.js.map +1 -1
- package/dist/react-aria.js.map +1 -1
- package/dist/registerButton.d.ts +1 -1
- package/dist/registerComboBox.d.ts +2 -2
- package/dist/registerDialogTrigger.d.ts +3 -3
- package/dist/registerModal.d.ts +3 -4
- package/dist/registerPopover.d.ts +2 -2
- package/dist/registerSelect.d.ts +2 -2
- package/dist/registerSliderTrack.d.ts +1 -1
- package/dist/registerTooltip.d.ts +2 -2
- package/dist/utils.d.ts +6 -0
- package/package.json +13 -3
- package/skinny/registerButton.cjs.js.map +1 -1
- package/skinny/registerButton.d.ts +1 -1
- package/skinny/registerButton.esm.js.map +1 -1
- package/skinny/registerButton.stories.cjs.js +163 -0
- package/skinny/registerButton.stories.cjs.js.map +1 -0
- package/skinny/registerButton.stories.esm.js +149 -0
- package/skinny/registerButton.stories.esm.js.map +1 -0
- package/skinny/registerCheckboxGroup.stories.cjs.js +121 -0
- package/skinny/registerCheckboxGroup.stories.cjs.js.map +1 -0
- package/skinny/registerCheckboxGroup.stories.esm.js +109 -0
- package/skinny/registerCheckboxGroup.stories.esm.js.map +1 -0
- package/skinny/registerComboBox.cjs.js.map +1 -1
- package/skinny/registerComboBox.d.ts +2 -2
- package/skinny/registerComboBox.esm.js +1 -1
- package/skinny/registerComboBox.esm.js.map +1 -1
- package/skinny/registerComboBox.stories.cjs.js +244 -0
- package/skinny/registerComboBox.stories.cjs.js.map +1 -0
- package/skinny/registerComboBox.stories.esm.js +230 -0
- package/skinny/registerComboBox.stories.esm.js.map +1 -0
- package/skinny/registerDialogTrigger.cjs.js.map +1 -1
- package/skinny/registerDialogTrigger.d.ts +3 -3
- package/skinny/registerDialogTrigger.esm.js.map +1 -1
- package/skinny/registerDialogTrigger.stories.cjs.js +233 -0
- package/skinny/registerDialogTrigger.stories.cjs.js.map +1 -0
- package/skinny/registerDialogTrigger.stories.esm.js +221 -0
- package/skinny/registerDialogTrigger.stories.esm.js.map +1 -0
- package/skinny/{registerListBox-40846430.esm.js → registerListBox-49626f55.esm.js} +2 -2
- package/skinny/{registerListBox-40846430.esm.js.map → registerListBox-49626f55.esm.js.map} +1 -1
- package/skinny/registerListBox.esm.js +1 -1
- package/skinny/registerListbox.stories.cjs.js +219 -0
- package/skinny/registerListbox.stories.cjs.js.map +1 -0
- package/skinny/registerListbox.stories.esm.js +206 -0
- package/skinny/registerListbox.stories.esm.js.map +1 -0
- package/skinny/registerModal.cjs.js.map +1 -1
- package/skinny/registerModal.d.ts +3 -4
- package/skinny/registerModal.esm.js.map +1 -1
- package/skinny/registerModal.stories.cjs.js +194 -0
- package/skinny/registerModal.stories.cjs.js.map +1 -0
- package/skinny/registerModal.stories.esm.js +181 -0
- package/skinny/registerModal.stories.esm.js.map +1 -0
- package/skinny/registerPopover.cjs.js.map +1 -1
- package/skinny/registerPopover.d.ts +2 -2
- package/skinny/registerPopover.esm.js.map +1 -1
- package/skinny/registerPopover.stories.cjs.js +42 -0
- package/skinny/registerPopover.stories.cjs.js.map +1 -0
- package/skinny/registerPopover.stories.esm.js +33 -0
- package/skinny/registerPopover.stories.esm.js.map +1 -0
- package/skinny/registerRadioGroup.stories.cjs.js +120 -0
- package/skinny/registerRadioGroup.stories.cjs.js.map +1 -0
- package/skinny/registerRadioGroup.stories.esm.js +108 -0
- package/skinny/registerRadioGroup.stories.esm.js.map +1 -0
- package/skinny/registerSection.esm.js +1 -1
- package/skinny/registerSelect.cjs.js.map +1 -1
- package/skinny/registerSelect.d.ts +2 -2
- package/skinny/registerSelect.esm.js +1 -1
- package/skinny/registerSelect.esm.js.map +1 -1
- package/skinny/registerSelect.stories.cjs.js +176 -0
- package/skinny/registerSelect.stories.cjs.js.map +1 -0
- package/skinny/registerSelect.stories.esm.js +165 -0
- package/skinny/registerSelect.stories.esm.js.map +1 -0
- package/skinny/registerSlider.stories.cjs.js +184 -0
- package/skinny/registerSlider.stories.cjs.js.map +1 -0
- package/skinny/registerSlider.stories.esm.js +171 -0
- package/skinny/registerSlider.stories.esm.js.map +1 -0
- package/skinny/registerSliderTrack.cjs.js.map +1 -1
- package/skinny/registerSliderTrack.d.ts +1 -1
- package/skinny/registerSliderTrack.esm.js.map +1 -1
- package/skinny/registerTextField.cjs.js +1 -1
- package/skinny/registerTextField.esm.js +1 -1
- package/skinny/registerTooltip.cjs.js.map +1 -1
- package/skinny/registerTooltip.d.ts +2 -2
- package/skinny/registerTooltip.esm.js.map +1 -1
- package/skinny/registerTooltip.stories.cjs.js +228 -0
- package/skinny/registerTooltip.stories.cjs.js.map +1 -0
- package/skinny/registerTooltip.stories.esm.js +215 -0
- package/skinny/registerTooltip.stories.esm.js.map +1 -0
- package/skinny/utils-5d1b4c6b.esm.js.map +1 -1
- package/skinny/utils-7d000fa4.cjs.js.map +1 -1
- package/skinny/utils.d.ts +6 -0
|
@@ -0,0 +1,120 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var test = require('@storybook/test');
|
|
6
|
+
var React = require('react');
|
|
7
|
+
var registerRadio = require('./registerRadio.cjs.js');
|
|
8
|
+
var registerRadioGroup = require('./registerRadioGroup.cjs.js');
|
|
9
|
+
require('react-aria-components');
|
|
10
|
+
require('./common-b3b54c72.cjs.js');
|
|
11
|
+
require('./utils-7d000fa4.cjs.js');
|
|
12
|
+
require('@plasmicapp/host');
|
|
13
|
+
require('@plasmicapp/host/registerComponent');
|
|
14
|
+
require('./contexts-6d0cb2b1.cjs.js');
|
|
15
|
+
require('./registerLabel.cjs.js');
|
|
16
|
+
require('./variant-utils-0ad70db8.cjs.js');
|
|
17
|
+
require('./OptionsItemIdManager-a89a28b9.cjs.js');
|
|
18
|
+
require('./registerDescription.cjs.js');
|
|
19
|
+
require('./registerText.cjs.js');
|
|
20
|
+
|
|
21
|
+
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
22
|
+
|
|
23
|
+
var React__default = /*#__PURE__*/_interopDefault(React);
|
|
24
|
+
|
|
25
|
+
const meta = {
|
|
26
|
+
title: "Components/BaseRadioGroup",
|
|
27
|
+
component: registerRadioGroup.BaseRadioGroup,
|
|
28
|
+
args: {
|
|
29
|
+
onChange: test.fn()
|
|
30
|
+
}
|
|
31
|
+
};
|
|
32
|
+
const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
|
|
33
|
+
const beforeEach = async () => {
|
|
34
|
+
await sleep(100);
|
|
35
|
+
};
|
|
36
|
+
const createRadioItems = (count) => {
|
|
37
|
+
return Array.from({ length: count }, (_, i) => ({
|
|
38
|
+
value: `radio${i + 1}`,
|
|
39
|
+
label: `Radio ${i + 1}`
|
|
40
|
+
}));
|
|
41
|
+
};
|
|
42
|
+
const Basic = {
|
|
43
|
+
args: {
|
|
44
|
+
children: createRadioItems(3).map((item) => /* @__PURE__ */ React__default.default.createElement(registerRadio.BaseRadio, { value: item.value }, item.label))
|
|
45
|
+
},
|
|
46
|
+
play: async ({ canvasElement, args }) => {
|
|
47
|
+
await beforeEach();
|
|
48
|
+
const canvas = test.within(canvasElement);
|
|
49
|
+
const radios = await canvas.findAllByRole("radio");
|
|
50
|
+
test.expect(radios).toHaveLength(3);
|
|
51
|
+
radios.forEach((radio) => {
|
|
52
|
+
test.expect(radio).not.toBeChecked();
|
|
53
|
+
});
|
|
54
|
+
await test.userEvent.click(radios[1]);
|
|
55
|
+
test.expect(radios[1]).toBeChecked();
|
|
56
|
+
test.expect(args.onChange).toHaveBeenCalledWith("radio2");
|
|
57
|
+
}
|
|
58
|
+
};
|
|
59
|
+
const WithDefaultSelection = {
|
|
60
|
+
args: {
|
|
61
|
+
defaultValue: "radio1",
|
|
62
|
+
children: createRadioItems(3).map((item) => /* @__PURE__ */ React__default.default.createElement(registerRadio.BaseRadio, { value: item.value }, item.label))
|
|
63
|
+
},
|
|
64
|
+
play: async ({ canvasElement, args }) => {
|
|
65
|
+
await beforeEach();
|
|
66
|
+
const canvas = test.within(canvasElement);
|
|
67
|
+
const radios = await canvas.findAllByRole("radio");
|
|
68
|
+
test.expect(radios[0]).toBeChecked();
|
|
69
|
+
test.expect(radios[1]).not.toBeChecked();
|
|
70
|
+
test.expect(radios[2]).not.toBeChecked();
|
|
71
|
+
await test.userEvent.click(radios[2]);
|
|
72
|
+
test.expect(radios[0]).not.toBeChecked();
|
|
73
|
+
test.expect(radios[1]).not.toBeChecked();
|
|
74
|
+
test.expect(radios[2]).toBeChecked();
|
|
75
|
+
test.expect(args.onChange).toHaveBeenCalledWith("radio3");
|
|
76
|
+
}
|
|
77
|
+
};
|
|
78
|
+
const Disabled = {
|
|
79
|
+
args: {
|
|
80
|
+
isDisabled: true,
|
|
81
|
+
defaultValue: "radio1",
|
|
82
|
+
children: createRadioItems(3).map((item) => /* @__PURE__ */ React__default.default.createElement(registerRadio.BaseRadio, { key: item.value, value: item.value }, item.label))
|
|
83
|
+
},
|
|
84
|
+
play: async ({ canvasElement, args }) => {
|
|
85
|
+
await beforeEach();
|
|
86
|
+
const canvas = test.within(canvasElement);
|
|
87
|
+
const radios = await canvas.findAllByRole("radio");
|
|
88
|
+
radios.forEach((radio) => {
|
|
89
|
+
test.expect(radio).toBeDisabled();
|
|
90
|
+
});
|
|
91
|
+
await test.userEvent.click(radios[1]);
|
|
92
|
+
test.expect(args.onChange).not.toHaveBeenCalled();
|
|
93
|
+
test.expect(radios[1]).not.toBeChecked();
|
|
94
|
+
}
|
|
95
|
+
};
|
|
96
|
+
const ReadOnly = {
|
|
97
|
+
args: {
|
|
98
|
+
isReadOnly: true,
|
|
99
|
+
defaultValue: "radio1",
|
|
100
|
+
children: createRadioItems(3).map((item) => /* @__PURE__ */ React__default.default.createElement(registerRadio.BaseRadio, { key: item.value, value: item.value }, item.label))
|
|
101
|
+
},
|
|
102
|
+
play: async ({ canvasElement, args }) => {
|
|
103
|
+
await beforeEach();
|
|
104
|
+
const canvas = test.within(canvasElement);
|
|
105
|
+
const radios = await canvas.findAllByRole("radio");
|
|
106
|
+
radios.forEach((radio) => {
|
|
107
|
+
test.expect(radio).not.toBeDisabled();
|
|
108
|
+
});
|
|
109
|
+
await test.userEvent.click(radios[2]);
|
|
110
|
+
test.expect(args.onChange).not.toHaveBeenCalled();
|
|
111
|
+
test.expect(radios[2]).not.toBeChecked();
|
|
112
|
+
}
|
|
113
|
+
};
|
|
114
|
+
|
|
115
|
+
exports.Basic = Basic;
|
|
116
|
+
exports.Disabled = Disabled;
|
|
117
|
+
exports.ReadOnly = ReadOnly;
|
|
118
|
+
exports.WithDefaultSelection = WithDefaultSelection;
|
|
119
|
+
exports.default = meta;
|
|
120
|
+
//# sourceMappingURL=registerRadioGroup.stories.cjs.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"registerRadioGroup.stories.cjs.js","sources":["../src/registerRadioGroup.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport { expect, fn, userEvent, within } from \"@storybook/test\";\nimport React from \"react\";\nimport { BaseRadio } from \"./registerRadio\";\nimport { BaseRadioGroup } from \"./registerRadioGroup\";\n\nconst meta: Meta<typeof BaseRadioGroup> = {\n title: \"Components/BaseRadioGroup\",\n component: BaseRadioGroup,\n args: {\n onChange: fn(),\n },\n};\n\nexport default meta;\ntype Story = StoryObj<typeof BaseRadioGroup>;\n\n// TODO: Assertions may be flaky because the registeredId is set inside useEffect, so in the first render, the id is randomly generated by react-aria itself.\n// We use sleep to wait for the id to be set before asserting.\n// This is marked todo because the sleep needs to be removed in a separate PR that fixes this issue\nconst sleep = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms));\n\nconst beforeEach = async () => {\n await sleep(100);\n};\n\n// Helper function to create radio items\nconst createRadioItems = (count: number) => {\n return Array.from({ length: count }, (_, i) => ({\n value: `radio${i + 1}`,\n label: `Radio ${i + 1}`,\n }));\n};\n\n// Basic RadioGroup with no initial selection\nexport const Basic: Story = {\n args: {\n children: createRadioItems(3).map((item) => (\n <BaseRadio value={item.value}>{item.label}</BaseRadio>\n )),\n },\n play: async ({ canvasElement, args }) => {\n await beforeEach();\n const canvas = within(canvasElement);\n const radios = await canvas.findAllByRole(\"radio\");\n expect(radios).toHaveLength(3);\n\n // Verify initial state\n radios.forEach((radio) => {\n expect(radio).not.toBeChecked();\n });\n\n // Test selection\n await userEvent.click(radios[1]);\n expect(radios[1]).toBeChecked();\n expect(args.onChange).toHaveBeenCalledWith(\"radio2\");\n },\n};\n\n// RadioGroup with pre-selected values\nexport const WithDefaultSelection: Story = {\n args: {\n defaultValue: \"radio1\",\n children: createRadioItems(3).map((item) => (\n <BaseRadio value={item.value}>{item.label}</BaseRadio>\n )),\n },\n play: async ({ canvasElement, args }) => {\n await beforeEach();\n const canvas = within(canvasElement);\n const radios = await canvas.findAllByRole(\"radio\");\n\n // Verify initial state\n expect(radios[0]).toBeChecked(); // via defaultSelected prop passed to the group\n expect(radios[1]).not.toBeChecked();\n expect(radios[2]).not.toBeChecked();\n\n // Test deselection\n await userEvent.click(radios[2]);\n expect(radios[0]).not.toBeChecked(); //changed\n expect(radios[1]).not.toBeChecked(); //changed\n expect(radios[2]).toBeChecked();\n expect(args.onChange).toHaveBeenCalledWith(\"radio3\");\n },\n};\n\n// Disabled RadioGroup\nexport const Disabled: Story = {\n args: {\n isDisabled: true,\n defaultValue: \"radio1\",\n children: createRadioItems(3).map((item) => (\n <BaseRadio key={item.value} value={item.value}>\n {item.label}\n </BaseRadio>\n )),\n },\n play: async ({ canvasElement, args }) => {\n await beforeEach();\n const canvas = within(canvasElement);\n const radios = await canvas.findAllByRole(\"radio\");\n\n // Verify disabled state\n radios.forEach((radio) => {\n expect(radio).toBeDisabled();\n });\n\n // Verify clicks don't trigger changes\n await userEvent.click(radios[1]);\n expect(args.onChange).not.toHaveBeenCalled();\n expect(radios[1]).not.toBeChecked();\n },\n};\n\n// ReadOnly RadioGroup\nexport const ReadOnly: Story = {\n args: {\n isReadOnly: true,\n defaultValue: \"radio1\",\n children: createRadioItems(3).map((item) => (\n <BaseRadio key={item.value} value={item.value}>\n {item.label}\n </BaseRadio>\n )),\n },\n play: async ({ canvasElement, args }) => {\n await beforeEach();\n const canvas = within(canvasElement);\n const radios = await canvas.findAllByRole(\"radio\");\n\n // Verify that the items are not disabled (but readonly)\n radios.forEach((radio) => {\n expect(radio).not.toBeDisabled();\n });\n\n // Verify clicks don't trigger changes\n await userEvent.click(radios[2]);\n expect(args.onChange).not.toHaveBeenCalled();\n expect(radios[2]).not.toBeChecked();\n },\n};\n"],"names":["BaseRadioGroup","fn","React","BaseRadio","within","expect","userEvent"],"mappings":"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"}
|
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
import { fn, within, expect, userEvent } from '@storybook/test';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { BaseRadio } from './registerRadio.esm.js';
|
|
4
|
+
import { BaseRadioGroup } from './registerRadioGroup.esm.js';
|
|
5
|
+
import 'react-aria-components';
|
|
6
|
+
import './common-ceebbaea.esm.js';
|
|
7
|
+
import './utils-5d1b4c6b.esm.js';
|
|
8
|
+
import '@plasmicapp/host';
|
|
9
|
+
import '@plasmicapp/host/registerComponent';
|
|
10
|
+
import './contexts-5cb81c2f.esm.js';
|
|
11
|
+
import './registerLabel.esm.js';
|
|
12
|
+
import './variant-utils-4405ebb0.esm.js';
|
|
13
|
+
import './OptionsItemIdManager-832b8cfe.esm.js';
|
|
14
|
+
import './registerDescription.esm.js';
|
|
15
|
+
import './registerText.esm.js';
|
|
16
|
+
|
|
17
|
+
const meta = {
|
|
18
|
+
title: "Components/BaseRadioGroup",
|
|
19
|
+
component: BaseRadioGroup,
|
|
20
|
+
args: {
|
|
21
|
+
onChange: fn()
|
|
22
|
+
}
|
|
23
|
+
};
|
|
24
|
+
const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
|
|
25
|
+
const beforeEach = async () => {
|
|
26
|
+
await sleep(100);
|
|
27
|
+
};
|
|
28
|
+
const createRadioItems = (count) => {
|
|
29
|
+
return Array.from({ length: count }, (_, i) => ({
|
|
30
|
+
value: `radio${i + 1}`,
|
|
31
|
+
label: `Radio ${i + 1}`
|
|
32
|
+
}));
|
|
33
|
+
};
|
|
34
|
+
const Basic = {
|
|
35
|
+
args: {
|
|
36
|
+
children: createRadioItems(3).map((item) => /* @__PURE__ */ React.createElement(BaseRadio, { value: item.value }, item.label))
|
|
37
|
+
},
|
|
38
|
+
play: async ({ canvasElement, args }) => {
|
|
39
|
+
await beforeEach();
|
|
40
|
+
const canvas = within(canvasElement);
|
|
41
|
+
const radios = await canvas.findAllByRole("radio");
|
|
42
|
+
expect(radios).toHaveLength(3);
|
|
43
|
+
radios.forEach((radio) => {
|
|
44
|
+
expect(radio).not.toBeChecked();
|
|
45
|
+
});
|
|
46
|
+
await userEvent.click(radios[1]);
|
|
47
|
+
expect(radios[1]).toBeChecked();
|
|
48
|
+
expect(args.onChange).toHaveBeenCalledWith("radio2");
|
|
49
|
+
}
|
|
50
|
+
};
|
|
51
|
+
const WithDefaultSelection = {
|
|
52
|
+
args: {
|
|
53
|
+
defaultValue: "radio1",
|
|
54
|
+
children: createRadioItems(3).map((item) => /* @__PURE__ */ React.createElement(BaseRadio, { value: item.value }, item.label))
|
|
55
|
+
},
|
|
56
|
+
play: async ({ canvasElement, args }) => {
|
|
57
|
+
await beforeEach();
|
|
58
|
+
const canvas = within(canvasElement);
|
|
59
|
+
const radios = await canvas.findAllByRole("radio");
|
|
60
|
+
expect(radios[0]).toBeChecked();
|
|
61
|
+
expect(radios[1]).not.toBeChecked();
|
|
62
|
+
expect(radios[2]).not.toBeChecked();
|
|
63
|
+
await userEvent.click(radios[2]);
|
|
64
|
+
expect(radios[0]).not.toBeChecked();
|
|
65
|
+
expect(radios[1]).not.toBeChecked();
|
|
66
|
+
expect(radios[2]).toBeChecked();
|
|
67
|
+
expect(args.onChange).toHaveBeenCalledWith("radio3");
|
|
68
|
+
}
|
|
69
|
+
};
|
|
70
|
+
const Disabled = {
|
|
71
|
+
args: {
|
|
72
|
+
isDisabled: true,
|
|
73
|
+
defaultValue: "radio1",
|
|
74
|
+
children: createRadioItems(3).map((item) => /* @__PURE__ */ React.createElement(BaseRadio, { key: item.value, value: item.value }, item.label))
|
|
75
|
+
},
|
|
76
|
+
play: async ({ canvasElement, args }) => {
|
|
77
|
+
await beforeEach();
|
|
78
|
+
const canvas = within(canvasElement);
|
|
79
|
+
const radios = await canvas.findAllByRole("radio");
|
|
80
|
+
radios.forEach((radio) => {
|
|
81
|
+
expect(radio).toBeDisabled();
|
|
82
|
+
});
|
|
83
|
+
await userEvent.click(radios[1]);
|
|
84
|
+
expect(args.onChange).not.toHaveBeenCalled();
|
|
85
|
+
expect(radios[1]).not.toBeChecked();
|
|
86
|
+
}
|
|
87
|
+
};
|
|
88
|
+
const ReadOnly = {
|
|
89
|
+
args: {
|
|
90
|
+
isReadOnly: true,
|
|
91
|
+
defaultValue: "radio1",
|
|
92
|
+
children: createRadioItems(3).map((item) => /* @__PURE__ */ React.createElement(BaseRadio, { key: item.value, value: item.value }, item.label))
|
|
93
|
+
},
|
|
94
|
+
play: async ({ canvasElement, args }) => {
|
|
95
|
+
await beforeEach();
|
|
96
|
+
const canvas = within(canvasElement);
|
|
97
|
+
const radios = await canvas.findAllByRole("radio");
|
|
98
|
+
radios.forEach((radio) => {
|
|
99
|
+
expect(radio).not.toBeDisabled();
|
|
100
|
+
});
|
|
101
|
+
await userEvent.click(radios[2]);
|
|
102
|
+
expect(args.onChange).not.toHaveBeenCalled();
|
|
103
|
+
expect(radios[2]).not.toBeChecked();
|
|
104
|
+
}
|
|
105
|
+
};
|
|
106
|
+
|
|
107
|
+
export { Basic, Disabled, ReadOnly, WithDefaultSelection, meta as default };
|
|
108
|
+
//# sourceMappingURL=registerRadioGroup.stories.esm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"registerRadioGroup.stories.esm.js","sources":["../src/registerRadioGroup.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport { expect, fn, userEvent, within } from \"@storybook/test\";\nimport React from \"react\";\nimport { BaseRadio } from \"./registerRadio\";\nimport { BaseRadioGroup } from \"./registerRadioGroup\";\n\nconst meta: Meta<typeof BaseRadioGroup> = {\n title: \"Components/BaseRadioGroup\",\n component: BaseRadioGroup,\n args: {\n onChange: fn(),\n },\n};\n\nexport default meta;\ntype Story = StoryObj<typeof BaseRadioGroup>;\n\n// TODO: Assertions may be flaky because the registeredId is set inside useEffect, so in the first render, the id is randomly generated by react-aria itself.\n// We use sleep to wait for the id to be set before asserting.\n// This is marked todo because the sleep needs to be removed in a separate PR that fixes this issue\nconst sleep = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms));\n\nconst beforeEach = async () => {\n await sleep(100);\n};\n\n// Helper function to create radio items\nconst createRadioItems = (count: number) => {\n return Array.from({ length: count }, (_, i) => ({\n value: `radio${i + 1}`,\n label: `Radio ${i + 1}`,\n }));\n};\n\n// Basic RadioGroup with no initial selection\nexport const Basic: Story = {\n args: {\n children: createRadioItems(3).map((item) => (\n <BaseRadio value={item.value}>{item.label}</BaseRadio>\n )),\n },\n play: async ({ canvasElement, args }) => {\n await beforeEach();\n const canvas = within(canvasElement);\n const radios = await canvas.findAllByRole(\"radio\");\n expect(radios).toHaveLength(3);\n\n // Verify initial state\n radios.forEach((radio) => {\n expect(radio).not.toBeChecked();\n });\n\n // Test selection\n await userEvent.click(radios[1]);\n expect(radios[1]).toBeChecked();\n expect(args.onChange).toHaveBeenCalledWith(\"radio2\");\n },\n};\n\n// RadioGroup with pre-selected values\nexport const WithDefaultSelection: Story = {\n args: {\n defaultValue: \"radio1\",\n children: createRadioItems(3).map((item) => (\n <BaseRadio value={item.value}>{item.label}</BaseRadio>\n )),\n },\n play: async ({ canvasElement, args }) => {\n await beforeEach();\n const canvas = within(canvasElement);\n const radios = await canvas.findAllByRole(\"radio\");\n\n // Verify initial state\n expect(radios[0]).toBeChecked(); // via defaultSelected prop passed to the group\n expect(radios[1]).not.toBeChecked();\n expect(radios[2]).not.toBeChecked();\n\n // Test deselection\n await userEvent.click(radios[2]);\n expect(radios[0]).not.toBeChecked(); //changed\n expect(radios[1]).not.toBeChecked(); //changed\n expect(radios[2]).toBeChecked();\n expect(args.onChange).toHaveBeenCalledWith(\"radio3\");\n },\n};\n\n// Disabled RadioGroup\nexport const Disabled: Story = {\n args: {\n isDisabled: true,\n defaultValue: \"radio1\",\n children: createRadioItems(3).map((item) => (\n <BaseRadio key={item.value} value={item.value}>\n {item.label}\n </BaseRadio>\n )),\n },\n play: async ({ canvasElement, args }) => {\n await beforeEach();\n const canvas = within(canvasElement);\n const radios = await canvas.findAllByRole(\"radio\");\n\n // Verify disabled state\n radios.forEach((radio) => {\n expect(radio).toBeDisabled();\n });\n\n // Verify clicks don't trigger changes\n await userEvent.click(radios[1]);\n expect(args.onChange).not.toHaveBeenCalled();\n expect(radios[1]).not.toBeChecked();\n },\n};\n\n// ReadOnly RadioGroup\nexport const ReadOnly: Story = {\n args: {\n isReadOnly: true,\n defaultValue: \"radio1\",\n children: createRadioItems(3).map((item) => (\n <BaseRadio key={item.value} value={item.value}>\n {item.label}\n </BaseRadio>\n )),\n },\n play: async ({ canvasElement, args }) => {\n await beforeEach();\n const canvas = within(canvasElement);\n const radios = await canvas.findAllByRole(\"radio\");\n\n // Verify that the items are not disabled (but readonly)\n radios.forEach((radio) => {\n expect(radio).not.toBeDisabled();\n });\n\n // Verify clicks don't trigger changes\n await userEvent.click(radios[2]);\n expect(args.onChange).not.toHaveBeenCalled();\n expect(radios[2]).not.toBeChecked();\n },\n};\n"],"names":[],"mappings":"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"}
|
|
@@ -2,7 +2,7 @@ import 'react';
|
|
|
2
2
|
import 'react-aria-components';
|
|
3
3
|
import './common-ceebbaea.esm.js';
|
|
4
4
|
import './contexts-5cb81c2f.esm.js';
|
|
5
|
-
export {
|
|
5
|
+
export { a as BaseSection, r as registerSection } from './registerListBox-49626f55.esm.js';
|
|
6
6
|
import './utils-5d1b4c6b.esm.js';
|
|
7
7
|
import './OptionsItemIdManager-832b8cfe.esm.js';
|
|
8
8
|
import './registerListBoxItem.esm.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"registerSelect.cjs.js","sources":["../src/registerSelect.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo } from \"react\";\nimport {\n Select,\n SelectProps,\n SelectRenderProps,\n SelectStateContext,\n SelectValue,\n} from \"react-aria-components\";\nimport { COMMON_STYLES, arrowDown, getCommonProps } from \"./common\";\nimport {\n PlasmicListBoxContext,\n PlasmicPopoverTriggerContext,\n} from \"./contexts\";\nimport { OptionsItemIdManager } from \"./OptionsItemIdManager\";\nimport { BUTTON_COMPONENT_NAME } from \"./registerButton\";\nimport { LABEL_COMPONENT_NAME } from \"./registerLabel\";\nimport { LIST_BOX_COMPONENT_NAME } from \"./registerListBox\";\nimport { POPOVER_COMPONENT_NAME } from \"./registerPopover\";\nimport {\n HasControlContextData,\n Registerable,\n extractPlasmicDataProps,\n makeComponentName,\n registerComponentHelper,\n useAutoOpen,\n} from \"./utils\";\nimport { WithVariants, pickAriaComponentVariants } from \"./variant-utils\";\n\n// It cannot be used as a hook like useAutoOpen() within the BaseSelect component\n// because it needs access to SelectStateContext, which is only created in the BaseSelect component's render function.\nfunction SelectAutoOpen(props: any) {\n const { open, close } = React.useContext(SelectStateContext) ?? {};\n useAutoOpen({\n props,\n open: () => {\n open?.();\n // using settimeout because the focus is not immediately available\n setTimeout(() => {\n /*\n When the select's popover is opened in the canvas, the listbox gains focus, trapping the keyboard focus within it. Pressing the up or down arrow keys navigates through the listbox items.\n However, there are three issues with this behavior:\n\n 1. Focus should not be triggered in canvas (non-interactive mode)\n 2. Canvas (non-interactive mode) should remain non-interactive: Navigation between listbox items or selection using the space key should not be possible.\n 3. Keyboard hotkeys (e.g., backspace, undo) stop working: Key presses are absorbed by the listbox, breaking the expected behavior for shortcuts like backspace or undo (reference).\n\n To resolve this, we need to call document.activeElement.blur() to remove focus from the listbox.\n\n However, since the select component is a code component embedded within the artboard iframe, the keyboard hotkeys (e.g., backspace, undo) will not work,\n because they only function in the parent iframe (__wab_studio-frame).\n To ensure hotkeys work properly, we need to shift focus from the active element in the child iframe (artboard iframe) to the parent iframe (__wab_studio-frame) by using window.parent.\n */\n (window.parent.document.activeElement as HTMLElement)?.blur?.();\n }, 1);\n },\n close,\n });\n\n return null;\n}\n\nexport interface BaseSelectValueProps\n extends React.ComponentProps<typeof SelectValue> {\n children: React.ReactNode;\n}\n\nexport const BaseSelectValue = (props: BaseSelectValueProps) => {\n const { children: placeholder, className } = props;\n return (\n <SelectValue className={className} style={COMMON_STYLES}>\n {({ isPlaceholder, selectedText }) => (\n <>{isPlaceholder ? placeholder : selectedText}</>\n )}\n </SelectValue>\n );\n};\n\nconst SELECT_NAME = makeComponentName(\"select\");\n\nexport interface BaseSelectControlContextData {\n itemIds: string[];\n}\n\nconst SELECT_VARIANTS = [\n \"focused\" as const,\n \"focusVisible\" as const,\n \"disabled\" as const,\n];\n\nconst { variants: SELECT_VARIANTS_DATA } =\n pickAriaComponentVariants(SELECT_VARIANTS);\n\nexport interface BaseSelectProps\n extends SelectProps<{}>, // NOTE: We don't need generic type here since we don't use items prop (that needs it). We just need to make the type checker happy\n WithVariants<typeof SELECT_VARIANTS>,\n HasControlContextData<BaseSelectControlContextData> {\n children?: React.ReactNode;\n className?: string;\n}\n\nexport function BaseSelect(props: BaseSelectProps) {\n const {\n selectedKey,\n onSelectionChange,\n onOpenChange,\n isDisabled,\n className,\n children,\n disabledKeys,\n name,\n setControlContextData,\n plasmicUpdateVariant,\n \"aria-label\": ariaLabel,\n } = props;\n\n const idManager = useMemo(() => new OptionsItemIdManager(), []);\n\n useEffect(() => {\n idManager.subscribe((ids: string[]) => {\n setControlContextData?.({\n itemIds: ids,\n });\n });\n }, []);\n\n const classNameProp = useCallback(\n ({\n isDisabled: isDisabled2,\n isFocusVisible,\n isFocused,\n }: SelectRenderProps) => {\n plasmicUpdateVariant?.({\n disabled: isDisabled2,\n focused: isFocused,\n focusVisible: isFocusVisible,\n });\n return className ?? \"\";\n },\n [className, plasmicUpdateVariant]\n );\n\n return (\n <Select\n selectedKey={selectedKey}\n onSelectionChange={onSelectionChange}\n onOpenChange={onOpenChange}\n isDisabled={isDisabled}\n className={classNameProp}\n style={COMMON_STYLES}\n name={name}\n disabledKeys={disabledKeys}\n aria-label={ariaLabel}\n {...extractPlasmicDataProps(props)}\n >\n <SelectAutoOpen {...props} />\n <PlasmicPopoverTriggerContext.Provider value={true}>\n <PlasmicListBoxContext.Provider\n value={{\n idManager,\n }}\n >\n {children}\n </PlasmicListBoxContext.Provider>\n </PlasmicPopoverTriggerContext.Provider>\n </Select>\n );\n}\n\nexport function registerSelect(loader?: Registerable) {\n const selectValueMeta = registerComponentHelper(loader, BaseSelectValue, {\n name: makeComponentName(\"select-value\"),\n displayName: \"Aria Selected Value\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerSelect\",\n importName: \"BaseSelectValue\",\n parentComponentName: SELECT_NAME,\n props: {\n /** @deprecated use children (Placeholder) directly */\n customize: {\n type: \"boolean\",\n displayName: \"Customize placeholder\",\n defaultValue: true,\n description: \"Customize the placeholder text and styles\",\n /** Obsolete, but retained (permanently hidden) for backward compatibility. */\n hidden: () => true,\n },\n children: {\n type: \"slot\",\n displayName: \"Placeholder\",\n defaultValue: [\n {\n type: \"text\",\n value: \"Select an item\",\n },\n ],\n },\n },\n trapsFocus: true,\n });\n\n registerComponentHelper(loader, BaseSelect, {\n name: SELECT_NAME,\n displayName: \"Aria Select\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerSelect\",\n importName: \"BaseSelect\",\n variants: SELECT_VARIANTS_DATA,\n props: {\n ...getCommonProps<BaseSelectProps>(\"Select\", [\n \"name\",\n \"aria-label\",\n \"isDisabled\",\n \"autoFocus\",\n ]),\n selectedKey: {\n type: \"choice\",\n editOnly: true,\n uncontrolledProp: \"defaultSelectedKey\",\n displayName: \"Initial selected item\",\n options: (_props, ctx) => (ctx?.itemIds ? Array.from(ctx.itemIds) : []),\n // React Aria Select do not support multiple selections yet\n multiSelect: false,\n },\n onSelectionChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"selectedValue\", type: \"string\" }],\n },\n disabledKeys: {\n type: \"choice\",\n displayName: \"Disabled values\",\n description:\n \"The items that are disabled. These items cannot be selected, focused, or otherwise interacted with.\",\n options: (_props, ctx) => (ctx?.itemIds ? Array.from(ctx.itemIds) : []),\n multiSelect: true,\n advanced: true,\n },\n isOpen: {\n type: \"boolean\",\n defaultValue: false,\n // It doesn't make sense to make isOpen prop editable (it's controlled by user interaction and always closed by default), so we keep this prop hidden. We have listed the prop here in the meta only so we can expose a writeable state for it.\n hidden: () => true,\n },\n onOpenChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"isOpen\", type: \"boolean\" }],\n },\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: [\n {\n type: \"vbox\",\n styles: {\n justifyContent: \"flex-start\",\n alignItems: \"flex-start\",\n width: \"300px\",\n padding: 0,\n },\n children: [\n {\n type: \"component\",\n name: LABEL_COMPONENT_NAME,\n props: {\n children: {\n type: \"text\",\n value: \"Label\",\n },\n },\n },\n {\n type: \"component\",\n name: BUTTON_COMPONENT_NAME,\n styles: {\n width: \"100%\",\n padding: \"4px 10px\",\n background: \"white\",\n },\n props: {\n children: {\n type: \"hbox\",\n styles: {\n width: \"stretch\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n padding: 0,\n },\n children: [\n {\n type: \"component\",\n name: selectValueMeta.name,\n },\n arrowDown,\n ],\n },\n },\n },\n {\n type: \"component\",\n name: POPOVER_COMPONENT_NAME,\n styles: {\n backgroundColor: \"white\",\n padding: \"10px\",\n overflow: \"scroll\",\n width: \"unset\",\n },\n props: {\n children: [\n {\n type: \"component\",\n name: LIST_BOX_COMPONENT_NAME,\n props: {\n selectionMode: \"single\",\n },\n styles: {\n borderWidth: 0,\n width: \"stretch\",\n },\n },\n ],\n },\n },\n ],\n },\n ],\n },\n },\n states: {\n selectedValue: {\n type: \"writable\",\n valueProp: \"selectedKey\",\n onChangeProp: \"onSelectionChange\",\n variableType: \"text\",\n },\n isOpen: {\n type: \"writable\",\n valueProp: \"isOpen\",\n onChangeProp: \"onOpenChange\",\n variableType: \"boolean\",\n },\n },\n trapsFocus: true,\n });\n}\n"],"names":["SelectStateContext","useAutoOpen","_a","React","SelectValue","COMMON_STYLES","makeComponentName","pickAriaComponentVariants","useMemo","OptionsItemIdManager","useEffect","useCallback","Select","extractPlasmicDataProps","PlasmicPopoverTriggerContext","PlasmicListBoxContext","registerComponentHelper","getCommonProps","LABEL_COMPONENT_NAME","BUTTON_COMPONENT_NAME","arrowDown","POPOVER_COMPONENT_NAME","LIST_BOX_COMPONENT_NAME"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"registerSelect.cjs.js","sources":["../src/registerSelect.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo } from \"react\";\nimport {\n Select,\n SelectProps,\n SelectRenderProps,\n SelectStateContext,\n SelectValue,\n} from \"react-aria-components\";\nimport { COMMON_STYLES, arrowDown, getCommonProps } from \"./common\";\nimport {\n PlasmicListBoxContext,\n PlasmicPopoverTriggerContext,\n} from \"./contexts\";\nimport { OptionsItemIdManager } from \"./OptionsItemIdManager\";\nimport { BUTTON_COMPONENT_NAME } from \"./registerButton\";\nimport { LABEL_COMPONENT_NAME } from \"./registerLabel\";\nimport { LIST_BOX_COMPONENT_NAME } from \"./registerListBox\";\nimport { POPOVER_COMPONENT_NAME } from \"./registerPopover\";\nimport {\n HasControlContextData,\n Registerable,\n WithPlasmicCanvasComponentInfo,\n extractPlasmicDataProps,\n makeComponentName,\n registerComponentHelper,\n useAutoOpen,\n} from \"./utils\";\nimport { WithVariants, pickAriaComponentVariants } from \"./variant-utils\";\n\n// It cannot be used as a hook like useAutoOpen() within the BaseSelect component\n// because it needs access to SelectStateContext, which is only created in the BaseSelect component's render function.\nfunction SelectAutoOpen(props: any) {\n const { open, close } = React.useContext(SelectStateContext) ?? {};\n useAutoOpen({\n props,\n open: () => {\n open?.();\n // using settimeout because the focus is not immediately available\n setTimeout(() => {\n /*\n When the select's popover is opened in the canvas, the listbox gains focus, trapping the keyboard focus within it. Pressing the up or down arrow keys navigates through the listbox items.\n However, there are three issues with this behavior:\n\n 1. Focus should not be triggered in canvas (non-interactive mode)\n 2. Canvas (non-interactive mode) should remain non-interactive: Navigation between listbox items or selection using the space key should not be possible.\n 3. Keyboard hotkeys (e.g., backspace, undo) stop working: Key presses are absorbed by the listbox, breaking the expected behavior for shortcuts like backspace or undo (reference).\n\n To resolve this, we need to call document.activeElement.blur() to remove focus from the listbox.\n\n However, since the select component is a code component embedded within the artboard iframe, the keyboard hotkeys (e.g., backspace, undo) will not work,\n because they only function in the parent iframe (__wab_studio-frame).\n To ensure hotkeys work properly, we need to shift focus from the active element in the child iframe (artboard iframe) to the parent iframe (__wab_studio-frame) by using window.parent.\n */\n (window.parent.document.activeElement as HTMLElement)?.blur?.();\n }, 1);\n },\n close,\n });\n\n return null;\n}\n\nexport interface BaseSelectValueProps\n extends React.ComponentProps<typeof SelectValue> {\n children: React.ReactNode;\n}\n\nexport const BaseSelectValue = (props: BaseSelectValueProps) => {\n const { children: placeholder, className } = props;\n return (\n <SelectValue className={className} style={COMMON_STYLES}>\n {({ isPlaceholder, selectedText }) => (\n <>{isPlaceholder ? placeholder : selectedText}</>\n )}\n </SelectValue>\n );\n};\n\nconst SELECT_NAME = makeComponentName(\"select\");\n\nexport interface BaseSelectControlContextData {\n itemIds: string[];\n}\n\nconst SELECT_VARIANTS = [\n \"focused\" as const,\n \"focusVisible\" as const,\n \"disabled\" as const,\n];\n\nconst { variants: SELECT_VARIANTS_DATA } =\n pickAriaComponentVariants(SELECT_VARIANTS);\n\nexport interface BaseSelectProps\n extends SelectProps<{}>, // NOTE: We don't need generic type here since we don't use items prop (that needs it). We just need to make the type checker happy\n WithVariants<typeof SELECT_VARIANTS>,\n WithPlasmicCanvasComponentInfo,\n HasControlContextData<BaseSelectControlContextData> {\n children?: React.ReactNode;\n className?: string;\n}\n\nexport function BaseSelect(props: BaseSelectProps) {\n const {\n selectedKey,\n onSelectionChange,\n onOpenChange,\n isDisabled,\n className,\n children,\n disabledKeys,\n name,\n setControlContextData,\n plasmicUpdateVariant,\n \"aria-label\": ariaLabel,\n } = props;\n\n const idManager = useMemo(() => new OptionsItemIdManager(), []);\n\n useEffect(() => {\n idManager.subscribe((ids: string[]) => {\n setControlContextData?.({\n itemIds: ids,\n });\n });\n }, []);\n\n const classNameProp = useCallback(\n ({\n isDisabled: isDisabled2,\n isFocusVisible,\n isFocused,\n }: SelectRenderProps) => {\n plasmicUpdateVariant?.({\n disabled: isDisabled2,\n focused: isFocused,\n focusVisible: isFocusVisible,\n });\n return className ?? \"\";\n },\n [className, plasmicUpdateVariant]\n );\n\n return (\n <Select\n selectedKey={selectedKey}\n onSelectionChange={onSelectionChange}\n onOpenChange={onOpenChange}\n isDisabled={isDisabled}\n className={classNameProp}\n style={COMMON_STYLES}\n name={name}\n disabledKeys={disabledKeys}\n aria-label={ariaLabel}\n {...extractPlasmicDataProps(props)}\n >\n <SelectAutoOpen {...props} />\n <PlasmicPopoverTriggerContext.Provider value={true}>\n <PlasmicListBoxContext.Provider\n value={{\n idManager,\n }}\n >\n {children}\n </PlasmicListBoxContext.Provider>\n </PlasmicPopoverTriggerContext.Provider>\n </Select>\n );\n}\n\nexport function registerSelect(loader?: Registerable) {\n const selectValueMeta = registerComponentHelper(loader, BaseSelectValue, {\n name: makeComponentName(\"select-value\"),\n displayName: \"Aria Selected Value\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerSelect\",\n importName: \"BaseSelectValue\",\n parentComponentName: SELECT_NAME,\n props: {\n /** @deprecated use children (Placeholder) directly */\n customize: {\n type: \"boolean\",\n displayName: \"Customize placeholder\",\n defaultValue: true,\n description: \"Customize the placeholder text and styles\",\n /** Obsolete, but retained (permanently hidden) for backward compatibility. */\n hidden: () => true,\n },\n children: {\n type: \"slot\",\n displayName: \"Placeholder\",\n defaultValue: [\n {\n type: \"text\",\n value: \"Select an item\",\n },\n ],\n },\n },\n trapsFocus: true,\n });\n\n registerComponentHelper(loader, BaseSelect, {\n name: SELECT_NAME,\n displayName: \"Aria Select\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerSelect\",\n importName: \"BaseSelect\",\n variants: SELECT_VARIANTS_DATA,\n props: {\n ...getCommonProps<BaseSelectProps>(\"Select\", [\n \"name\",\n \"aria-label\",\n \"isDisabled\",\n \"autoFocus\",\n ]),\n selectedKey: {\n type: \"choice\",\n editOnly: true,\n uncontrolledProp: \"defaultSelectedKey\",\n displayName: \"Initial selected item\",\n options: (_props, ctx) => (ctx?.itemIds ? Array.from(ctx.itemIds) : []),\n // React Aria Select do not support multiple selections yet\n multiSelect: false,\n },\n onSelectionChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"selectedValue\", type: \"string\" }],\n },\n disabledKeys: {\n type: \"choice\",\n displayName: \"Disabled values\",\n description:\n \"The items that are disabled. These items cannot be selected, focused, or otherwise interacted with.\",\n options: (_props, ctx) => (ctx?.itemIds ? Array.from(ctx.itemIds) : []),\n multiSelect: true,\n advanced: true,\n },\n isOpen: {\n type: \"boolean\",\n defaultValue: false,\n // It doesn't make sense to make isOpen prop editable (it's controlled by user interaction and always closed by default), so we keep this prop hidden. We have listed the prop here in the meta only so we can expose a writeable state for it.\n hidden: () => true,\n },\n onOpenChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"isOpen\", type: \"boolean\" }],\n },\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: [\n {\n type: \"vbox\",\n styles: {\n justifyContent: \"flex-start\",\n alignItems: \"flex-start\",\n width: \"300px\",\n padding: 0,\n },\n children: [\n {\n type: \"component\",\n name: LABEL_COMPONENT_NAME,\n props: {\n children: {\n type: \"text\",\n value: \"Label\",\n },\n },\n },\n {\n type: \"component\",\n name: BUTTON_COMPONENT_NAME,\n styles: {\n width: \"100%\",\n padding: \"4px 10px\",\n background: \"white\",\n },\n props: {\n children: {\n type: \"hbox\",\n styles: {\n width: \"stretch\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n padding: 0,\n },\n children: [\n {\n type: \"component\",\n name: selectValueMeta.name,\n },\n arrowDown,\n ],\n },\n },\n },\n {\n type: \"component\",\n name: POPOVER_COMPONENT_NAME,\n styles: {\n backgroundColor: \"white\",\n padding: \"10px\",\n overflow: \"scroll\",\n width: \"unset\",\n },\n props: {\n children: [\n {\n type: \"component\",\n name: LIST_BOX_COMPONENT_NAME,\n props: {\n selectionMode: \"single\",\n },\n styles: {\n borderWidth: 0,\n width: \"stretch\",\n },\n },\n ],\n },\n },\n ],\n },\n ],\n },\n },\n states: {\n selectedValue: {\n type: \"writable\",\n valueProp: \"selectedKey\",\n onChangeProp: \"onSelectionChange\",\n variableType: \"text\",\n },\n isOpen: {\n type: \"writable\",\n valueProp: \"isOpen\",\n onChangeProp: \"onOpenChange\",\n variableType: \"boolean\",\n },\n },\n trapsFocus: true,\n });\n}\n"],"names":["SelectStateContext","useAutoOpen","_a","React","SelectValue","COMMON_STYLES","makeComponentName","pickAriaComponentVariants","useMemo","OptionsItemIdManager","useEffect","useCallback","Select","extractPlasmicDataProps","PlasmicPopoverTriggerContext","PlasmicListBoxContext","registerComponentHelper","getCommonProps","LABEL_COMPONENT_NAME","BUTTON_COMPONENT_NAME","arrowDown","POPOVER_COMPONENT_NAME","LIST_BOX_COMPONENT_NAME"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { SelectProps, SelectValue } from "react-aria-components";
|
|
3
|
-
import { HasControlContextData, Registerable } from "./utils";
|
|
3
|
+
import { HasControlContextData, Registerable, WithPlasmicCanvasComponentInfo } from "./utils";
|
|
4
4
|
import { WithVariants } from "./variant-utils";
|
|
5
5
|
export interface BaseSelectValueProps extends React.ComponentProps<typeof SelectValue> {
|
|
6
6
|
children: React.ReactNode;
|
|
@@ -11,7 +11,7 @@ export interface BaseSelectControlContextData {
|
|
|
11
11
|
}
|
|
12
12
|
declare const SELECT_VARIANTS: ("disabled" | "focused" | "focusVisible")[];
|
|
13
13
|
export interface BaseSelectProps extends SelectProps<{}>, // NOTE: We don't need generic type here since we don't use items prop (that needs it). We just need to make the type checker happy
|
|
14
|
-
WithVariants<typeof SELECT_VARIANTS>, HasControlContextData<BaseSelectControlContextData> {
|
|
14
|
+
WithVariants<typeof SELECT_VARIANTS>, WithPlasmicCanvasComponentInfo, HasControlContextData<BaseSelectControlContextData> {
|
|
15
15
|
children?: React.ReactNode;
|
|
16
16
|
className?: string;
|
|
17
17
|
}
|
|
@@ -5,7 +5,7 @@ import { a as PlasmicPopoverTriggerContext, b as PlasmicListBoxContext } from '.
|
|
|
5
5
|
import { O as OptionsItemIdManager } from './OptionsItemIdManager-832b8cfe.esm.js';
|
|
6
6
|
import { BUTTON_COMPONENT_NAME } from './registerButton.esm.js';
|
|
7
7
|
import { LABEL_COMPONENT_NAME } from './registerLabel.esm.js';
|
|
8
|
-
import { L as LIST_BOX_COMPONENT_NAME } from './registerListBox-
|
|
8
|
+
import { L as LIST_BOX_COMPONENT_NAME } from './registerListBox-49626f55.esm.js';
|
|
9
9
|
import { POPOVER_COMPONENT_NAME } from './registerPopover.esm.js';
|
|
10
10
|
import { e as extractPlasmicDataProps, r as registerComponentHelper, u as useAutoOpen, m as makeComponentName } from './utils-5d1b4c6b.esm.js';
|
|
11
11
|
import { p as pickAriaComponentVariants } from './variant-utils-4405ebb0.esm.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"registerSelect.esm.js","sources":["../src/registerSelect.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo } from \"react\";\nimport {\n Select,\n SelectProps,\n SelectRenderProps,\n SelectStateContext,\n SelectValue,\n} from \"react-aria-components\";\nimport { COMMON_STYLES, arrowDown, getCommonProps } from \"./common\";\nimport {\n PlasmicListBoxContext,\n PlasmicPopoverTriggerContext,\n} from \"./contexts\";\nimport { OptionsItemIdManager } from \"./OptionsItemIdManager\";\nimport { BUTTON_COMPONENT_NAME } from \"./registerButton\";\nimport { LABEL_COMPONENT_NAME } from \"./registerLabel\";\nimport { LIST_BOX_COMPONENT_NAME } from \"./registerListBox\";\nimport { POPOVER_COMPONENT_NAME } from \"./registerPopover\";\nimport {\n HasControlContextData,\n Registerable,\n extractPlasmicDataProps,\n makeComponentName,\n registerComponentHelper,\n useAutoOpen,\n} from \"./utils\";\nimport { WithVariants, pickAriaComponentVariants } from \"./variant-utils\";\n\n// It cannot be used as a hook like useAutoOpen() within the BaseSelect component\n// because it needs access to SelectStateContext, which is only created in the BaseSelect component's render function.\nfunction SelectAutoOpen(props: any) {\n const { open, close } = React.useContext(SelectStateContext) ?? {};\n useAutoOpen({\n props,\n open: () => {\n open?.();\n // using settimeout because the focus is not immediately available\n setTimeout(() => {\n /*\n When the select's popover is opened in the canvas, the listbox gains focus, trapping the keyboard focus within it. Pressing the up or down arrow keys navigates through the listbox items.\n However, there are three issues with this behavior:\n\n 1. Focus should not be triggered in canvas (non-interactive mode)\n 2. Canvas (non-interactive mode) should remain non-interactive: Navigation between listbox items or selection using the space key should not be possible.\n 3. Keyboard hotkeys (e.g., backspace, undo) stop working: Key presses are absorbed by the listbox, breaking the expected behavior for shortcuts like backspace or undo (reference).\n\n To resolve this, we need to call document.activeElement.blur() to remove focus from the listbox.\n\n However, since the select component is a code component embedded within the artboard iframe, the keyboard hotkeys (e.g., backspace, undo) will not work,\n because they only function in the parent iframe (__wab_studio-frame).\n To ensure hotkeys work properly, we need to shift focus from the active element in the child iframe (artboard iframe) to the parent iframe (__wab_studio-frame) by using window.parent.\n */\n (window.parent.document.activeElement as HTMLElement)?.blur?.();\n }, 1);\n },\n close,\n });\n\n return null;\n}\n\nexport interface BaseSelectValueProps\n extends React.ComponentProps<typeof SelectValue> {\n children: React.ReactNode;\n}\n\nexport const BaseSelectValue = (props: BaseSelectValueProps) => {\n const { children: placeholder, className } = props;\n return (\n <SelectValue className={className} style={COMMON_STYLES}>\n {({ isPlaceholder, selectedText }) => (\n <>{isPlaceholder ? placeholder : selectedText}</>\n )}\n </SelectValue>\n );\n};\n\nconst SELECT_NAME = makeComponentName(\"select\");\n\nexport interface BaseSelectControlContextData {\n itemIds: string[];\n}\n\nconst SELECT_VARIANTS = [\n \"focused\" as const,\n \"focusVisible\" as const,\n \"disabled\" as const,\n];\n\nconst { variants: SELECT_VARIANTS_DATA } =\n pickAriaComponentVariants(SELECT_VARIANTS);\n\nexport interface BaseSelectProps\n extends SelectProps<{}>, // NOTE: We don't need generic type here since we don't use items prop (that needs it). We just need to make the type checker happy\n WithVariants<typeof SELECT_VARIANTS>,\n HasControlContextData<BaseSelectControlContextData> {\n children?: React.ReactNode;\n className?: string;\n}\n\nexport function BaseSelect(props: BaseSelectProps) {\n const {\n selectedKey,\n onSelectionChange,\n onOpenChange,\n isDisabled,\n className,\n children,\n disabledKeys,\n name,\n setControlContextData,\n plasmicUpdateVariant,\n \"aria-label\": ariaLabel,\n } = props;\n\n const idManager = useMemo(() => new OptionsItemIdManager(), []);\n\n useEffect(() => {\n idManager.subscribe((ids: string[]) => {\n setControlContextData?.({\n itemIds: ids,\n });\n });\n }, []);\n\n const classNameProp = useCallback(\n ({\n isDisabled: isDisabled2,\n isFocusVisible,\n isFocused,\n }: SelectRenderProps) => {\n plasmicUpdateVariant?.({\n disabled: isDisabled2,\n focused: isFocused,\n focusVisible: isFocusVisible,\n });\n return className ?? \"\";\n },\n [className, plasmicUpdateVariant]\n );\n\n return (\n <Select\n selectedKey={selectedKey}\n onSelectionChange={onSelectionChange}\n onOpenChange={onOpenChange}\n isDisabled={isDisabled}\n className={classNameProp}\n style={COMMON_STYLES}\n name={name}\n disabledKeys={disabledKeys}\n aria-label={ariaLabel}\n {...extractPlasmicDataProps(props)}\n >\n <SelectAutoOpen {...props} />\n <PlasmicPopoverTriggerContext.Provider value={true}>\n <PlasmicListBoxContext.Provider\n value={{\n idManager,\n }}\n >\n {children}\n </PlasmicListBoxContext.Provider>\n </PlasmicPopoverTriggerContext.Provider>\n </Select>\n );\n}\n\nexport function registerSelect(loader?: Registerable) {\n const selectValueMeta = registerComponentHelper(loader, BaseSelectValue, {\n name: makeComponentName(\"select-value\"),\n displayName: \"Aria Selected Value\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerSelect\",\n importName: \"BaseSelectValue\",\n parentComponentName: SELECT_NAME,\n props: {\n /** @deprecated use children (Placeholder) directly */\n customize: {\n type: \"boolean\",\n displayName: \"Customize placeholder\",\n defaultValue: true,\n description: \"Customize the placeholder text and styles\",\n /** Obsolete, but retained (permanently hidden) for backward compatibility. */\n hidden: () => true,\n },\n children: {\n type: \"slot\",\n displayName: \"Placeholder\",\n defaultValue: [\n {\n type: \"text\",\n value: \"Select an item\",\n },\n ],\n },\n },\n trapsFocus: true,\n });\n\n registerComponentHelper(loader, BaseSelect, {\n name: SELECT_NAME,\n displayName: \"Aria Select\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerSelect\",\n importName: \"BaseSelect\",\n variants: SELECT_VARIANTS_DATA,\n props: {\n ...getCommonProps<BaseSelectProps>(\"Select\", [\n \"name\",\n \"aria-label\",\n \"isDisabled\",\n \"autoFocus\",\n ]),\n selectedKey: {\n type: \"choice\",\n editOnly: true,\n uncontrolledProp: \"defaultSelectedKey\",\n displayName: \"Initial selected item\",\n options: (_props, ctx) => (ctx?.itemIds ? Array.from(ctx.itemIds) : []),\n // React Aria Select do not support multiple selections yet\n multiSelect: false,\n },\n onSelectionChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"selectedValue\", type: \"string\" }],\n },\n disabledKeys: {\n type: \"choice\",\n displayName: \"Disabled values\",\n description:\n \"The items that are disabled. These items cannot be selected, focused, or otherwise interacted with.\",\n options: (_props, ctx) => (ctx?.itemIds ? Array.from(ctx.itemIds) : []),\n multiSelect: true,\n advanced: true,\n },\n isOpen: {\n type: \"boolean\",\n defaultValue: false,\n // It doesn't make sense to make isOpen prop editable (it's controlled by user interaction and always closed by default), so we keep this prop hidden. We have listed the prop here in the meta only so we can expose a writeable state for it.\n hidden: () => true,\n },\n onOpenChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"isOpen\", type: \"boolean\" }],\n },\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: [\n {\n type: \"vbox\",\n styles: {\n justifyContent: \"flex-start\",\n alignItems: \"flex-start\",\n width: \"300px\",\n padding: 0,\n },\n children: [\n {\n type: \"component\",\n name: LABEL_COMPONENT_NAME,\n props: {\n children: {\n type: \"text\",\n value: \"Label\",\n },\n },\n },\n {\n type: \"component\",\n name: BUTTON_COMPONENT_NAME,\n styles: {\n width: \"100%\",\n padding: \"4px 10px\",\n background: \"white\",\n },\n props: {\n children: {\n type: \"hbox\",\n styles: {\n width: \"stretch\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n padding: 0,\n },\n children: [\n {\n type: \"component\",\n name: selectValueMeta.name,\n },\n arrowDown,\n ],\n },\n },\n },\n {\n type: \"component\",\n name: POPOVER_COMPONENT_NAME,\n styles: {\n backgroundColor: \"white\",\n padding: \"10px\",\n overflow: \"scroll\",\n width: \"unset\",\n },\n props: {\n children: [\n {\n type: \"component\",\n name: LIST_BOX_COMPONENT_NAME,\n props: {\n selectionMode: \"single\",\n },\n styles: {\n borderWidth: 0,\n width: \"stretch\",\n },\n },\n ],\n },\n },\n ],\n },\n ],\n },\n },\n states: {\n selectedValue: {\n type: \"writable\",\n valueProp: \"selectedKey\",\n onChangeProp: \"onSelectionChange\",\n variableType: \"text\",\n },\n isOpen: {\n type: \"writable\",\n valueProp: \"isOpen\",\n onChangeProp: \"onOpenChange\",\n variableType: \"boolean\",\n },\n },\n trapsFocus: true,\n });\n}\n"],"names":["_a"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"registerSelect.esm.js","sources":["../src/registerSelect.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo } from \"react\";\nimport {\n Select,\n SelectProps,\n SelectRenderProps,\n SelectStateContext,\n SelectValue,\n} from \"react-aria-components\";\nimport { COMMON_STYLES, arrowDown, getCommonProps } from \"./common\";\nimport {\n PlasmicListBoxContext,\n PlasmicPopoverTriggerContext,\n} from \"./contexts\";\nimport { OptionsItemIdManager } from \"./OptionsItemIdManager\";\nimport { BUTTON_COMPONENT_NAME } from \"./registerButton\";\nimport { LABEL_COMPONENT_NAME } from \"./registerLabel\";\nimport { LIST_BOX_COMPONENT_NAME } from \"./registerListBox\";\nimport { POPOVER_COMPONENT_NAME } from \"./registerPopover\";\nimport {\n HasControlContextData,\n Registerable,\n WithPlasmicCanvasComponentInfo,\n extractPlasmicDataProps,\n makeComponentName,\n registerComponentHelper,\n useAutoOpen,\n} from \"./utils\";\nimport { WithVariants, pickAriaComponentVariants } from \"./variant-utils\";\n\n// It cannot be used as a hook like useAutoOpen() within the BaseSelect component\n// because it needs access to SelectStateContext, which is only created in the BaseSelect component's render function.\nfunction SelectAutoOpen(props: any) {\n const { open, close } = React.useContext(SelectStateContext) ?? {};\n useAutoOpen({\n props,\n open: () => {\n open?.();\n // using settimeout because the focus is not immediately available\n setTimeout(() => {\n /*\n When the select's popover is opened in the canvas, the listbox gains focus, trapping the keyboard focus within it. Pressing the up or down arrow keys navigates through the listbox items.\n However, there are three issues with this behavior:\n\n 1. Focus should not be triggered in canvas (non-interactive mode)\n 2. Canvas (non-interactive mode) should remain non-interactive: Navigation between listbox items or selection using the space key should not be possible.\n 3. Keyboard hotkeys (e.g., backspace, undo) stop working: Key presses are absorbed by the listbox, breaking the expected behavior for shortcuts like backspace or undo (reference).\n\n To resolve this, we need to call document.activeElement.blur() to remove focus from the listbox.\n\n However, since the select component is a code component embedded within the artboard iframe, the keyboard hotkeys (e.g., backspace, undo) will not work,\n because they only function in the parent iframe (__wab_studio-frame).\n To ensure hotkeys work properly, we need to shift focus from the active element in the child iframe (artboard iframe) to the parent iframe (__wab_studio-frame) by using window.parent.\n */\n (window.parent.document.activeElement as HTMLElement)?.blur?.();\n }, 1);\n },\n close,\n });\n\n return null;\n}\n\nexport interface BaseSelectValueProps\n extends React.ComponentProps<typeof SelectValue> {\n children: React.ReactNode;\n}\n\nexport const BaseSelectValue = (props: BaseSelectValueProps) => {\n const { children: placeholder, className } = props;\n return (\n <SelectValue className={className} style={COMMON_STYLES}>\n {({ isPlaceholder, selectedText }) => (\n <>{isPlaceholder ? placeholder : selectedText}</>\n )}\n </SelectValue>\n );\n};\n\nconst SELECT_NAME = makeComponentName(\"select\");\n\nexport interface BaseSelectControlContextData {\n itemIds: string[];\n}\n\nconst SELECT_VARIANTS = [\n \"focused\" as const,\n \"focusVisible\" as const,\n \"disabled\" as const,\n];\n\nconst { variants: SELECT_VARIANTS_DATA } =\n pickAriaComponentVariants(SELECT_VARIANTS);\n\nexport interface BaseSelectProps\n extends SelectProps<{}>, // NOTE: We don't need generic type here since we don't use items prop (that needs it). We just need to make the type checker happy\n WithVariants<typeof SELECT_VARIANTS>,\n WithPlasmicCanvasComponentInfo,\n HasControlContextData<BaseSelectControlContextData> {\n children?: React.ReactNode;\n className?: string;\n}\n\nexport function BaseSelect(props: BaseSelectProps) {\n const {\n selectedKey,\n onSelectionChange,\n onOpenChange,\n isDisabled,\n className,\n children,\n disabledKeys,\n name,\n setControlContextData,\n plasmicUpdateVariant,\n \"aria-label\": ariaLabel,\n } = props;\n\n const idManager = useMemo(() => new OptionsItemIdManager(), []);\n\n useEffect(() => {\n idManager.subscribe((ids: string[]) => {\n setControlContextData?.({\n itemIds: ids,\n });\n });\n }, []);\n\n const classNameProp = useCallback(\n ({\n isDisabled: isDisabled2,\n isFocusVisible,\n isFocused,\n }: SelectRenderProps) => {\n plasmicUpdateVariant?.({\n disabled: isDisabled2,\n focused: isFocused,\n focusVisible: isFocusVisible,\n });\n return className ?? \"\";\n },\n [className, plasmicUpdateVariant]\n );\n\n return (\n <Select\n selectedKey={selectedKey}\n onSelectionChange={onSelectionChange}\n onOpenChange={onOpenChange}\n isDisabled={isDisabled}\n className={classNameProp}\n style={COMMON_STYLES}\n name={name}\n disabledKeys={disabledKeys}\n aria-label={ariaLabel}\n {...extractPlasmicDataProps(props)}\n >\n <SelectAutoOpen {...props} />\n <PlasmicPopoverTriggerContext.Provider value={true}>\n <PlasmicListBoxContext.Provider\n value={{\n idManager,\n }}\n >\n {children}\n </PlasmicListBoxContext.Provider>\n </PlasmicPopoverTriggerContext.Provider>\n </Select>\n );\n}\n\nexport function registerSelect(loader?: Registerable) {\n const selectValueMeta = registerComponentHelper(loader, BaseSelectValue, {\n name: makeComponentName(\"select-value\"),\n displayName: \"Aria Selected Value\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerSelect\",\n importName: \"BaseSelectValue\",\n parentComponentName: SELECT_NAME,\n props: {\n /** @deprecated use children (Placeholder) directly */\n customize: {\n type: \"boolean\",\n displayName: \"Customize placeholder\",\n defaultValue: true,\n description: \"Customize the placeholder text and styles\",\n /** Obsolete, but retained (permanently hidden) for backward compatibility. */\n hidden: () => true,\n },\n children: {\n type: \"slot\",\n displayName: \"Placeholder\",\n defaultValue: [\n {\n type: \"text\",\n value: \"Select an item\",\n },\n ],\n },\n },\n trapsFocus: true,\n });\n\n registerComponentHelper(loader, BaseSelect, {\n name: SELECT_NAME,\n displayName: \"Aria Select\",\n importPath: \"@plasmicpkgs/react-aria/skinny/registerSelect\",\n importName: \"BaseSelect\",\n variants: SELECT_VARIANTS_DATA,\n props: {\n ...getCommonProps<BaseSelectProps>(\"Select\", [\n \"name\",\n \"aria-label\",\n \"isDisabled\",\n \"autoFocus\",\n ]),\n selectedKey: {\n type: \"choice\",\n editOnly: true,\n uncontrolledProp: \"defaultSelectedKey\",\n displayName: \"Initial selected item\",\n options: (_props, ctx) => (ctx?.itemIds ? Array.from(ctx.itemIds) : []),\n // React Aria Select do not support multiple selections yet\n multiSelect: false,\n },\n onSelectionChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"selectedValue\", type: \"string\" }],\n },\n disabledKeys: {\n type: \"choice\",\n displayName: \"Disabled values\",\n description:\n \"The items that are disabled. These items cannot be selected, focused, or otherwise interacted with.\",\n options: (_props, ctx) => (ctx?.itemIds ? Array.from(ctx.itemIds) : []),\n multiSelect: true,\n advanced: true,\n },\n isOpen: {\n type: \"boolean\",\n defaultValue: false,\n // It doesn't make sense to make isOpen prop editable (it's controlled by user interaction and always closed by default), so we keep this prop hidden. We have listed the prop here in the meta only so we can expose a writeable state for it.\n hidden: () => true,\n },\n onOpenChange: {\n type: \"eventHandler\",\n argTypes: [{ name: \"isOpen\", type: \"boolean\" }],\n },\n children: {\n type: \"slot\",\n mergeWithParent: true,\n defaultValue: [\n {\n type: \"vbox\",\n styles: {\n justifyContent: \"flex-start\",\n alignItems: \"flex-start\",\n width: \"300px\",\n padding: 0,\n },\n children: [\n {\n type: \"component\",\n name: LABEL_COMPONENT_NAME,\n props: {\n children: {\n type: \"text\",\n value: \"Label\",\n },\n },\n },\n {\n type: \"component\",\n name: BUTTON_COMPONENT_NAME,\n styles: {\n width: \"100%\",\n padding: \"4px 10px\",\n background: \"white\",\n },\n props: {\n children: {\n type: \"hbox\",\n styles: {\n width: \"stretch\",\n justifyContent: \"space-between\",\n alignItems: \"center\",\n padding: 0,\n },\n children: [\n {\n type: \"component\",\n name: selectValueMeta.name,\n },\n arrowDown,\n ],\n },\n },\n },\n {\n type: \"component\",\n name: POPOVER_COMPONENT_NAME,\n styles: {\n backgroundColor: \"white\",\n padding: \"10px\",\n overflow: \"scroll\",\n width: \"unset\",\n },\n props: {\n children: [\n {\n type: \"component\",\n name: LIST_BOX_COMPONENT_NAME,\n props: {\n selectionMode: \"single\",\n },\n styles: {\n borderWidth: 0,\n width: \"stretch\",\n },\n },\n ],\n },\n },\n ],\n },\n ],\n },\n },\n states: {\n selectedValue: {\n type: \"writable\",\n valueProp: \"selectedKey\",\n onChangeProp: \"onSelectionChange\",\n variableType: \"text\",\n },\n isOpen: {\n type: \"writable\",\n valueProp: \"isOpen\",\n onChangeProp: \"onOpenChange\",\n variableType: \"boolean\",\n },\n },\n trapsFocus: true,\n });\n}\n"],"names":["_a"],"mappings":"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"}
|