@plasmicpkgs/react-aria 0.0.118 → 0.0.120
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/contexts.d.ts +2 -1
- package/dist/react-aria.esm.js +13 -4
- package/dist/react-aria.esm.js.map +1 -1
- package/dist/react-aria.js +13 -4
- package/dist/react-aria.js.map +1 -1
- package/dist/utils.d.ts +5 -4
- package/package.json +2 -2
- package/skinny/contexts-5cb81c2f.esm.js.map +1 -1
- package/skinny/contexts-6d0cb2b1.cjs.js.map +1 -1
- package/skinny/contexts.d.ts +2 -1
- package/skinny/registerComboBox.esm.js +1 -1
- package/skinny/registerInput.cjs.js +1 -1
- package/skinny/registerInput.cjs.js.map +1 -1
- package/skinny/registerInput.esm.js +2 -2
- package/skinny/registerInput.esm.js.map +1 -1
- package/skinny/{registerListBox-21dc99fa.esm.js → registerListBox-0f6ebcf0.esm.js} +2 -2
- package/skinny/{registerListBox-21dc99fa.esm.js.map → registerListBox-0f6ebcf0.esm.js.map} +1 -1
- package/skinny/registerListBox.esm.js +1 -1
- package/skinny/registerSection.esm.js +1 -1
- package/skinny/registerSelect.esm.js +1 -1
- package/skinny/registerTextArea.cjs.js +5 -2
- package/skinny/registerTextArea.cjs.js.map +1 -1
- package/skinny/registerTextArea.esm.js +6 -3
- package/skinny/registerTextArea.esm.js.map +1 -1
- package/skinny/registerTextField.cjs.js +8 -2
- package/skinny/registerTextField.cjs.js.map +1 -1
- package/skinny/registerTextField.esm.js +8 -2
- package/skinny/registerTextField.esm.js.map +1 -1
- package/skinny/utils-fc1ddd7c.cjs.js.map +1 -1
- package/skinny/utils-fd88ad47.esm.js.map +1 -1
- package/skinny/utils.d.ts +5 -4
- package/skinny/registerButton.stories.cjs.js +0 -163
- package/skinny/registerButton.stories.cjs.js.map +0 -1
- package/skinny/registerButton.stories.esm.js +0 -149
- package/skinny/registerButton.stories.esm.js.map +0 -1
- package/skinny/registerCheckboxGroup.stories.cjs.js +0 -121
- package/skinny/registerCheckboxGroup.stories.cjs.js.map +0 -1
- package/skinny/registerCheckboxGroup.stories.esm.js +0 -109
- package/skinny/registerCheckboxGroup.stories.esm.js.map +0 -1
- package/skinny/registerComboBox.stories.cjs.js +0 -244
- package/skinny/registerComboBox.stories.cjs.js.map +0 -1
- package/skinny/registerComboBox.stories.esm.js +0 -230
- package/skinny/registerComboBox.stories.esm.js.map +0 -1
- package/skinny/registerDialogTrigger.stories.cjs.js +0 -458
- package/skinny/registerDialogTrigger.stories.cjs.js.map +0 -1
- package/skinny/registerDialogTrigger.stories.esm.js +0 -441
- package/skinny/registerDialogTrigger.stories.esm.js.map +0 -1
- package/skinny/registerListbox.stories.cjs.js +0 -219
- package/skinny/registerListbox.stories.cjs.js.map +0 -1
- package/skinny/registerListbox.stories.esm.js +0 -206
- package/skinny/registerListbox.stories.esm.js.map +0 -1
- package/skinny/registerModal.stories.cjs.js +0 -194
- package/skinny/registerModal.stories.cjs.js.map +0 -1
- package/skinny/registerModal.stories.esm.js +0 -181
- package/skinny/registerModal.stories.esm.js.map +0 -1
- package/skinny/registerPopover.stories.cjs.js +0 -102
- package/skinny/registerPopover.stories.cjs.js.map +0 -1
- package/skinny/registerPopover.stories.esm.js +0 -92
- package/skinny/registerPopover.stories.esm.js.map +0 -1
- package/skinny/registerRadioGroup.stories.cjs.js +0 -120
- package/skinny/registerRadioGroup.stories.cjs.js.map +0 -1
- package/skinny/registerRadioGroup.stories.esm.js +0 -108
- package/skinny/registerRadioGroup.stories.esm.js.map +0 -1
- package/skinny/registerSelect.stories.cjs.js +0 -215
- package/skinny/registerSelect.stories.cjs.js.map +0 -1
- package/skinny/registerSelect.stories.esm.js +0 -202
- package/skinny/registerSelect.stories.esm.js.map +0 -1
- package/skinny/registerSlider.stories.cjs.js +0 -165
- package/skinny/registerSlider.stories.cjs.js.map +0 -1
- package/skinny/registerSlider.stories.esm.js +0 -151
- package/skinny/registerSlider.stories.esm.js.map +0 -1
- package/skinny/registerSwitch.stories.cjs.js +0 -162
- package/skinny/registerSwitch.stories.cjs.js.map +0 -1
- package/skinny/registerSwitch.stories.esm.js +0 -148
- package/skinny/registerSwitch.stories.esm.js.map +0 -1
- package/skinny/registerTextField-common-stories.cjs.js +0 -199
- package/skinny/registerTextField-common-stories.cjs.js.map +0 -1
- package/skinny/registerTextField-common-stories.esm.js +0 -185
- package/skinny/registerTextField-common-stories.esm.js.map +0 -1
- package/skinny/registerTextField-input.stories.cjs.js +0 -54
- package/skinny/registerTextField-input.stories.cjs.js.map +0 -1
- package/skinny/registerTextField-input.stories.esm.js +0 -37
- package/skinny/registerTextField-input.stories.esm.js.map +0 -1
- package/skinny/registerTextField-textarea.stories.cjs.js +0 -55
- package/skinny/registerTextField-textarea.stories.cjs.js.map +0 -1
- package/skinny/registerTextField-textarea.stories.esm.js +0 -39
- package/skinny/registerTextField-textarea.stories.esm.js.map +0 -1
- package/skinny/registerTooltip.stories.cjs.js +0 -616
- package/skinny/registerTooltip.stories.cjs.js.map +0 -1
- package/skinny/registerTooltip.stories.esm.js +0 -596
- package/skinny/registerTooltip.stories.esm.js.map +0 -1
|
@@ -1,162 +0,0 @@
|
|
|
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 registerSwitch = require('./registerSwitch.cjs.js');
|
|
8
|
-
require('react-aria-components');
|
|
9
|
-
require('./common-45acb83c.cjs.js');
|
|
10
|
-
require('./utils-fc1ddd7c.cjs.js');
|
|
11
|
-
require('@plasmicapp/host');
|
|
12
|
-
require('@plasmicapp/host/registerComponent');
|
|
13
|
-
require('./registerDescription.cjs.js');
|
|
14
|
-
require('./registerText.cjs.js');
|
|
15
|
-
require('./registerLabel.cjs.js');
|
|
16
|
-
require('./variant-utils-0ad70db8.cjs.js');
|
|
17
|
-
|
|
18
|
-
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
19
|
-
|
|
20
|
-
var React__default = /*#__PURE__*/_interopDefault(React);
|
|
21
|
-
|
|
22
|
-
var __defProp = Object.defineProperty;
|
|
23
|
-
var __defProps = Object.defineProperties;
|
|
24
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
25
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
26
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
27
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
28
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
29
|
-
var __spreadValues = (a, b) => {
|
|
30
|
-
for (var prop in b || (b = {}))
|
|
31
|
-
if (__hasOwnProp.call(b, prop))
|
|
32
|
-
__defNormalProp(a, prop, b[prop]);
|
|
33
|
-
if (__getOwnPropSymbols)
|
|
34
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
35
|
-
if (__propIsEnum.call(b, prop))
|
|
36
|
-
__defNormalProp(a, prop, b[prop]);
|
|
37
|
-
}
|
|
38
|
-
return a;
|
|
39
|
-
};
|
|
40
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
41
|
-
const meta = {
|
|
42
|
-
title: "Components/BaseSwitch",
|
|
43
|
-
component: registerSwitch.BaseSwitch,
|
|
44
|
-
args: {
|
|
45
|
-
onChange: test.fn(),
|
|
46
|
-
children: /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, /* @__PURE__ */ React__default.default.createElement("div", { className: "indicator" }), "Low power mode")
|
|
47
|
-
}
|
|
48
|
-
};
|
|
49
|
-
const Basic = {
|
|
50
|
-
play: async ({ canvasElement, args }) => {
|
|
51
|
-
const canvas = test.within(canvasElement);
|
|
52
|
-
const switchEl = await canvas.findByText("Low power mode");
|
|
53
|
-
test.expect(switchEl).not.toHaveAttribute("data-focused");
|
|
54
|
-
test.expect(switchEl).not.toHaveAttribute("data-selected");
|
|
55
|
-
await test.userEvent.click(switchEl);
|
|
56
|
-
test.expect(args.onChange).toHaveBeenCalledWith(true);
|
|
57
|
-
test.expect(switchEl).toHaveAttribute("data-focused", "true");
|
|
58
|
-
test.expect(switchEl).toHaveAttribute("data-selected", "true");
|
|
59
|
-
await test.userEvent.keyboard("[Space]");
|
|
60
|
-
test.expect(args.onChange).toHaveBeenCalledWith(false);
|
|
61
|
-
test.expect(switchEl).not.toHaveAttribute("data-selected");
|
|
62
|
-
test.expect(switchEl).toHaveAttribute("data-focused", "true");
|
|
63
|
-
await test.userEvent.tab();
|
|
64
|
-
test.expect(switchEl).not.toHaveAttribute("data-focused");
|
|
65
|
-
test.expect(args.onChange).toHaveBeenCalledTimes(2);
|
|
66
|
-
}
|
|
67
|
-
};
|
|
68
|
-
const WithInitialValue = {
|
|
69
|
-
args: {
|
|
70
|
-
defaultSelected: true
|
|
71
|
-
},
|
|
72
|
-
play: async ({ canvasElement, args }) => {
|
|
73
|
-
const canvas = test.within(canvasElement);
|
|
74
|
-
const switchEl = await canvas.findByText("Low power mode");
|
|
75
|
-
test.expect(switchEl).not.toHaveAttribute("data-focused");
|
|
76
|
-
test.expect(switchEl).toHaveAttribute("data-selected", "true");
|
|
77
|
-
await test.userEvent.click(switchEl);
|
|
78
|
-
test.expect(switchEl).not.toHaveAttribute("data-selected");
|
|
79
|
-
test.expect(args.onChange).toHaveBeenCalledWith(false);
|
|
80
|
-
}
|
|
81
|
-
};
|
|
82
|
-
const AutoFocused = {
|
|
83
|
-
args: {
|
|
84
|
-
autoFocus: true
|
|
85
|
-
},
|
|
86
|
-
play: async ({ canvasElement }) => {
|
|
87
|
-
const canvas = test.within(canvasElement);
|
|
88
|
-
const switchEl = await canvas.findByText("Low power mode");
|
|
89
|
-
test.waitFor(() => test.expect(switchEl).toHaveAttribute("data-focused", "true"));
|
|
90
|
-
}
|
|
91
|
-
};
|
|
92
|
-
const ReadOnly = {
|
|
93
|
-
args: {
|
|
94
|
-
isReadOnly: true
|
|
95
|
-
},
|
|
96
|
-
play: async ({ canvasElement, args }) => {
|
|
97
|
-
const canvas = test.within(canvasElement);
|
|
98
|
-
const switchEl = await canvas.findByText("Low power mode");
|
|
99
|
-
test.expect(switchEl).not.toHaveAttribute("data-selected");
|
|
100
|
-
test.expect(switchEl).not.toHaveAttribute("data-disabled");
|
|
101
|
-
await test.userEvent.click(switchEl);
|
|
102
|
-
test.expect(switchEl).not.toHaveAttribute("data-selected");
|
|
103
|
-
test.expect(args.onChange).not.toHaveBeenCalled();
|
|
104
|
-
}
|
|
105
|
-
};
|
|
106
|
-
const Disabled = {
|
|
107
|
-
args: {
|
|
108
|
-
isDisabled: true
|
|
109
|
-
},
|
|
110
|
-
play: async ({ canvasElement, args }) => {
|
|
111
|
-
const canvas = test.within(canvasElement);
|
|
112
|
-
const switchEl = await canvas.findByText("Low power mode");
|
|
113
|
-
test.expect(switchEl).not.toHaveAttribute("data-selected");
|
|
114
|
-
test.expect(switchEl).toHaveAttribute("data-disabled", "true");
|
|
115
|
-
await test.userEvent.click(switchEl);
|
|
116
|
-
test.expect(switchEl).not.toHaveAttribute("data-selected");
|
|
117
|
-
test.expect(args.onChange).not.toHaveBeenCalled();
|
|
118
|
-
}
|
|
119
|
-
};
|
|
120
|
-
const Controlled = {
|
|
121
|
-
args: {
|
|
122
|
-
defaultSelected: true
|
|
123
|
-
},
|
|
124
|
-
render: (args) => {
|
|
125
|
-
const [selected, setSelected] = React.useState(args.defaultSelected);
|
|
126
|
-
return /* @__PURE__ */ React__default.default.createElement(
|
|
127
|
-
registerSwitch.BaseSwitch,
|
|
128
|
-
__spreadProps(__spreadValues({}, args), {
|
|
129
|
-
isSelected: selected,
|
|
130
|
-
onChange: (newVal) => {
|
|
131
|
-
var _a;
|
|
132
|
-
setSelected(newVal);
|
|
133
|
-
(_a = args.onChange) == null ? void 0 : _a.call(args, newVal);
|
|
134
|
-
}
|
|
135
|
-
}),
|
|
136
|
-
/* @__PURE__ */ React__default.default.createElement("div", { className: "indicator" }),
|
|
137
|
-
"Low power mode"
|
|
138
|
-
);
|
|
139
|
-
},
|
|
140
|
-
play: async ({ canvasElement, args }) => {
|
|
141
|
-
const canvas = test.within(canvasElement);
|
|
142
|
-
const switchEl = await canvas.findByText("Low power mode");
|
|
143
|
-
test.expect(switchEl).toHaveAttribute("data-selected", "true");
|
|
144
|
-
await test.userEvent.click(switchEl);
|
|
145
|
-
test.expect(switchEl).not.toHaveAttribute("data-selected");
|
|
146
|
-
test.expect(args.onChange).toHaveBeenCalledWith(false);
|
|
147
|
-
test.expect(args.onChange).toHaveBeenCalledOnce();
|
|
148
|
-
await test.userEvent.click(switchEl);
|
|
149
|
-
test.expect(switchEl).toHaveAttribute("data-selected", "true");
|
|
150
|
-
test.expect(args.onChange).toHaveBeenCalledWith(true);
|
|
151
|
-
test.expect(args.onChange).toHaveBeenCalledTimes(2);
|
|
152
|
-
}
|
|
153
|
-
};
|
|
154
|
-
|
|
155
|
-
exports.AutoFocused = AutoFocused;
|
|
156
|
-
exports.Basic = Basic;
|
|
157
|
-
exports.Controlled = Controlled;
|
|
158
|
-
exports.Disabled = Disabled;
|
|
159
|
-
exports.ReadOnly = ReadOnly;
|
|
160
|
-
exports.WithInitialValue = WithInitialValue;
|
|
161
|
-
exports.default = meta;
|
|
162
|
-
//# sourceMappingURL=registerSwitch.stories.cjs.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"registerSwitch.stories.cjs.js","sources":["../src/registerSwitch.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport { expect, fn, userEvent, waitFor, within } from \"@storybook/test\";\nimport React, { useState } from \"react\";\nimport { BaseSwitch } from \"./registerSwitch\";\n\nconst meta: Meta<typeof BaseSwitch> = {\n title: \"Components/BaseSwitch\",\n component: BaseSwitch,\n args: {\n onChange: fn(),\n children: (\n <>\n <div className=\"indicator\" />\n Low power mode\n </>\n ),\n },\n};\n\nexport default meta;\ntype Story = StoryObj<typeof BaseSwitch>;\n\n// Basic Switch with default state (unselected)\nexport const Basic: Story = {\n play: async ({ canvasElement, args }) => {\n const canvas = within(canvasElement);\n const switchEl = await canvas.findByText(\"Low power mode\");\n\n // Verify initial state\n expect(switchEl).not.toHaveAttribute(\"data-focused\");\n expect(switchEl).not.toHaveAttribute(\"data-selected\");\n\n // Toggle the switch on\n await userEvent.click(switchEl);\n expect(args.onChange).toHaveBeenCalledWith(true);\n expect(switchEl).toHaveAttribute(\"data-focused\", \"true\");\n expect(switchEl).toHaveAttribute(\"data-selected\", \"true\");\n\n await userEvent.keyboard(\"[Space]\"); // simulate toggle on the focused switch\n expect(args.onChange).toHaveBeenCalledWith(false);\n expect(switchEl).not.toHaveAttribute(\"data-selected\");\n expect(switchEl).toHaveAttribute(\"data-focused\", \"true\");\n\n await userEvent.tab();\n expect(switchEl).not.toHaveAttribute(\"data-focused\");\n\n expect(args.onChange).toHaveBeenCalledTimes(2);\n },\n};\n\n// Basic Switch with default state (selected)\nexport const WithInitialValue: Story = {\n args: {\n defaultSelected: true,\n },\n play: async ({ canvasElement, args }) => {\n const canvas = within(canvasElement);\n const switchEl = await canvas.findByText(\"Low power mode\");\n\n expect(switchEl).not.toHaveAttribute(\"data-focused\");\n expect(switchEl).toHaveAttribute(\"data-selected\", \"true\");\n\n await userEvent.click(switchEl);\n expect(switchEl).not.toHaveAttribute(\"data-selected\");\n expect(args.onChange).toHaveBeenCalledWith(false);\n },\n};\n\nexport const AutoFocused: Story = {\n args: {\n autoFocus: true,\n },\n play: async ({ canvasElement }) => {\n const canvas = within(canvasElement);\n const switchEl = await canvas.findByText(\"Low power mode\");\n\n waitFor(() => expect(switchEl).toHaveAttribute(\"data-focused\", \"true\"));\n },\n};\n\nexport const ReadOnly: Story = {\n args: {\n isReadOnly: true,\n },\n play: async ({ canvasElement, args }) => {\n const canvas = within(canvasElement);\n const switchEl = await canvas.findByText(\"Low power mode\");\n\n expect(switchEl).not.toHaveAttribute(\"data-selected\");\n expect(switchEl).not.toHaveAttribute(\"data-disabled\");\n\n await userEvent.click(switchEl);\n expect(switchEl).not.toHaveAttribute(\"data-selected\"); // unchanged\n expect(args.onChange).not.toHaveBeenCalled();\n },\n};\n\nexport const Disabled: Story = {\n args: {\n isDisabled: true,\n },\n play: async ({ canvasElement, args }) => {\n const canvas = within(canvasElement);\n const switchEl = await canvas.findByText(\"Low power mode\");\n\n expect(switchEl).not.toHaveAttribute(\"data-selected\");\n expect(switchEl).toHaveAttribute(\"data-disabled\", \"true\");\n\n await userEvent.click(switchEl);\n expect(switchEl).not.toHaveAttribute(\"data-selected\"); // unchanged\n expect(args.onChange).not.toHaveBeenCalled();\n },\n};\n\nexport const Controlled: Story = {\n args: {\n defaultSelected: true,\n },\n render: (args) => {\n const [selected, setSelected] = useState(args.defaultSelected);\n return (\n <BaseSwitch\n {...args}\n isSelected={selected}\n onChange={(newVal) => {\n setSelected(newVal);\n args.onChange?.(newVal);\n }}\n >\n <div className=\"indicator\" />\n Low power mode\n </BaseSwitch>\n );\n },\n play: async ({ canvasElement, args }) => {\n const canvas = within(canvasElement);\n const switchEl = await canvas.findByText(\"Low power mode\");\n\n expect(switchEl).toHaveAttribute(\"data-selected\", \"true\");\n await userEvent.click(switchEl);\n expect(switchEl).not.toHaveAttribute(\"data-selected\");\n\n expect(args.onChange).toHaveBeenCalledWith(false);\n expect(args.onChange).toHaveBeenCalledOnce();\n\n await userEvent.click(switchEl);\n expect(switchEl).toHaveAttribute(\"data-selected\", \"true\");\n\n expect(args.onChange).toHaveBeenCalledWith(true);\n expect(args.onChange).toHaveBeenCalledTimes(2);\n },\n};\n"],"names":["BaseSwitch","fn","React","within","expect","userEvent","waitFor","useState"],"mappings":"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"}
|
|
@@ -1,148 +0,0 @@
|
|
|
1
|
-
import { fn, within, expect, userEvent, waitFor } from '@storybook/test';
|
|
2
|
-
import React, { useState } from 'react';
|
|
3
|
-
import { BaseSwitch } from './registerSwitch.esm.js';
|
|
4
|
-
import 'react-aria-components';
|
|
5
|
-
import './common-616eb178.esm.js';
|
|
6
|
-
import './utils-fd88ad47.esm.js';
|
|
7
|
-
import '@plasmicapp/host';
|
|
8
|
-
import '@plasmicapp/host/registerComponent';
|
|
9
|
-
import './registerDescription.esm.js';
|
|
10
|
-
import './registerText.esm.js';
|
|
11
|
-
import './registerLabel.esm.js';
|
|
12
|
-
import './variant-utils-4405ebb0.esm.js';
|
|
13
|
-
|
|
14
|
-
var __defProp = Object.defineProperty;
|
|
15
|
-
var __defProps = Object.defineProperties;
|
|
16
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
17
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
18
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
19
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
20
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
21
|
-
var __spreadValues = (a, b) => {
|
|
22
|
-
for (var prop in b || (b = {}))
|
|
23
|
-
if (__hasOwnProp.call(b, prop))
|
|
24
|
-
__defNormalProp(a, prop, b[prop]);
|
|
25
|
-
if (__getOwnPropSymbols)
|
|
26
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
27
|
-
if (__propIsEnum.call(b, prop))
|
|
28
|
-
__defNormalProp(a, prop, b[prop]);
|
|
29
|
-
}
|
|
30
|
-
return a;
|
|
31
|
-
};
|
|
32
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
33
|
-
const meta = {
|
|
34
|
-
title: "Components/BaseSwitch",
|
|
35
|
-
component: BaseSwitch,
|
|
36
|
-
args: {
|
|
37
|
-
onChange: fn(),
|
|
38
|
-
children: /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", { className: "indicator" }), "Low power mode")
|
|
39
|
-
}
|
|
40
|
-
};
|
|
41
|
-
const Basic = {
|
|
42
|
-
play: async ({ canvasElement, args }) => {
|
|
43
|
-
const canvas = within(canvasElement);
|
|
44
|
-
const switchEl = await canvas.findByText("Low power mode");
|
|
45
|
-
expect(switchEl).not.toHaveAttribute("data-focused");
|
|
46
|
-
expect(switchEl).not.toHaveAttribute("data-selected");
|
|
47
|
-
await userEvent.click(switchEl);
|
|
48
|
-
expect(args.onChange).toHaveBeenCalledWith(true);
|
|
49
|
-
expect(switchEl).toHaveAttribute("data-focused", "true");
|
|
50
|
-
expect(switchEl).toHaveAttribute("data-selected", "true");
|
|
51
|
-
await userEvent.keyboard("[Space]");
|
|
52
|
-
expect(args.onChange).toHaveBeenCalledWith(false);
|
|
53
|
-
expect(switchEl).not.toHaveAttribute("data-selected");
|
|
54
|
-
expect(switchEl).toHaveAttribute("data-focused", "true");
|
|
55
|
-
await userEvent.tab();
|
|
56
|
-
expect(switchEl).not.toHaveAttribute("data-focused");
|
|
57
|
-
expect(args.onChange).toHaveBeenCalledTimes(2);
|
|
58
|
-
}
|
|
59
|
-
};
|
|
60
|
-
const WithInitialValue = {
|
|
61
|
-
args: {
|
|
62
|
-
defaultSelected: true
|
|
63
|
-
},
|
|
64
|
-
play: async ({ canvasElement, args }) => {
|
|
65
|
-
const canvas = within(canvasElement);
|
|
66
|
-
const switchEl = await canvas.findByText("Low power mode");
|
|
67
|
-
expect(switchEl).not.toHaveAttribute("data-focused");
|
|
68
|
-
expect(switchEl).toHaveAttribute("data-selected", "true");
|
|
69
|
-
await userEvent.click(switchEl);
|
|
70
|
-
expect(switchEl).not.toHaveAttribute("data-selected");
|
|
71
|
-
expect(args.onChange).toHaveBeenCalledWith(false);
|
|
72
|
-
}
|
|
73
|
-
};
|
|
74
|
-
const AutoFocused = {
|
|
75
|
-
args: {
|
|
76
|
-
autoFocus: true
|
|
77
|
-
},
|
|
78
|
-
play: async ({ canvasElement }) => {
|
|
79
|
-
const canvas = within(canvasElement);
|
|
80
|
-
const switchEl = await canvas.findByText("Low power mode");
|
|
81
|
-
waitFor(() => expect(switchEl).toHaveAttribute("data-focused", "true"));
|
|
82
|
-
}
|
|
83
|
-
};
|
|
84
|
-
const ReadOnly = {
|
|
85
|
-
args: {
|
|
86
|
-
isReadOnly: true
|
|
87
|
-
},
|
|
88
|
-
play: async ({ canvasElement, args }) => {
|
|
89
|
-
const canvas = within(canvasElement);
|
|
90
|
-
const switchEl = await canvas.findByText("Low power mode");
|
|
91
|
-
expect(switchEl).not.toHaveAttribute("data-selected");
|
|
92
|
-
expect(switchEl).not.toHaveAttribute("data-disabled");
|
|
93
|
-
await userEvent.click(switchEl);
|
|
94
|
-
expect(switchEl).not.toHaveAttribute("data-selected");
|
|
95
|
-
expect(args.onChange).not.toHaveBeenCalled();
|
|
96
|
-
}
|
|
97
|
-
};
|
|
98
|
-
const Disabled = {
|
|
99
|
-
args: {
|
|
100
|
-
isDisabled: true
|
|
101
|
-
},
|
|
102
|
-
play: async ({ canvasElement, args }) => {
|
|
103
|
-
const canvas = within(canvasElement);
|
|
104
|
-
const switchEl = await canvas.findByText("Low power mode");
|
|
105
|
-
expect(switchEl).not.toHaveAttribute("data-selected");
|
|
106
|
-
expect(switchEl).toHaveAttribute("data-disabled", "true");
|
|
107
|
-
await userEvent.click(switchEl);
|
|
108
|
-
expect(switchEl).not.toHaveAttribute("data-selected");
|
|
109
|
-
expect(args.onChange).not.toHaveBeenCalled();
|
|
110
|
-
}
|
|
111
|
-
};
|
|
112
|
-
const Controlled = {
|
|
113
|
-
args: {
|
|
114
|
-
defaultSelected: true
|
|
115
|
-
},
|
|
116
|
-
render: (args) => {
|
|
117
|
-
const [selected, setSelected] = useState(args.defaultSelected);
|
|
118
|
-
return /* @__PURE__ */ React.createElement(
|
|
119
|
-
BaseSwitch,
|
|
120
|
-
__spreadProps(__spreadValues({}, args), {
|
|
121
|
-
isSelected: selected,
|
|
122
|
-
onChange: (newVal) => {
|
|
123
|
-
var _a;
|
|
124
|
-
setSelected(newVal);
|
|
125
|
-
(_a = args.onChange) == null ? void 0 : _a.call(args, newVal);
|
|
126
|
-
}
|
|
127
|
-
}),
|
|
128
|
-
/* @__PURE__ */ React.createElement("div", { className: "indicator" }),
|
|
129
|
-
"Low power mode"
|
|
130
|
-
);
|
|
131
|
-
},
|
|
132
|
-
play: async ({ canvasElement, args }) => {
|
|
133
|
-
const canvas = within(canvasElement);
|
|
134
|
-
const switchEl = await canvas.findByText("Low power mode");
|
|
135
|
-
expect(switchEl).toHaveAttribute("data-selected", "true");
|
|
136
|
-
await userEvent.click(switchEl);
|
|
137
|
-
expect(switchEl).not.toHaveAttribute("data-selected");
|
|
138
|
-
expect(args.onChange).toHaveBeenCalledWith(false);
|
|
139
|
-
expect(args.onChange).toHaveBeenCalledOnce();
|
|
140
|
-
await userEvent.click(switchEl);
|
|
141
|
-
expect(switchEl).toHaveAttribute("data-selected", "true");
|
|
142
|
-
expect(args.onChange).toHaveBeenCalledWith(true);
|
|
143
|
-
expect(args.onChange).toHaveBeenCalledTimes(2);
|
|
144
|
-
}
|
|
145
|
-
};
|
|
146
|
-
|
|
147
|
-
export { AutoFocused, Basic, Controlled, Disabled, ReadOnly, WithInitialValue, meta as default };
|
|
148
|
-
//# sourceMappingURL=registerSwitch.stories.esm.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"registerSwitch.stories.esm.js","sources":["../src/registerSwitch.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport { expect, fn, userEvent, waitFor, within } from \"@storybook/test\";\nimport React, { useState } from \"react\";\nimport { BaseSwitch } from \"./registerSwitch\";\n\nconst meta: Meta<typeof BaseSwitch> = {\n title: \"Components/BaseSwitch\",\n component: BaseSwitch,\n args: {\n onChange: fn(),\n children: (\n <>\n <div className=\"indicator\" />\n Low power mode\n </>\n ),\n },\n};\n\nexport default meta;\ntype Story = StoryObj<typeof BaseSwitch>;\n\n// Basic Switch with default state (unselected)\nexport const Basic: Story = {\n play: async ({ canvasElement, args }) => {\n const canvas = within(canvasElement);\n const switchEl = await canvas.findByText(\"Low power mode\");\n\n // Verify initial state\n expect(switchEl).not.toHaveAttribute(\"data-focused\");\n expect(switchEl).not.toHaveAttribute(\"data-selected\");\n\n // Toggle the switch on\n await userEvent.click(switchEl);\n expect(args.onChange).toHaveBeenCalledWith(true);\n expect(switchEl).toHaveAttribute(\"data-focused\", \"true\");\n expect(switchEl).toHaveAttribute(\"data-selected\", \"true\");\n\n await userEvent.keyboard(\"[Space]\"); // simulate toggle on the focused switch\n expect(args.onChange).toHaveBeenCalledWith(false);\n expect(switchEl).not.toHaveAttribute(\"data-selected\");\n expect(switchEl).toHaveAttribute(\"data-focused\", \"true\");\n\n await userEvent.tab();\n expect(switchEl).not.toHaveAttribute(\"data-focused\");\n\n expect(args.onChange).toHaveBeenCalledTimes(2);\n },\n};\n\n// Basic Switch with default state (selected)\nexport const WithInitialValue: Story = {\n args: {\n defaultSelected: true,\n },\n play: async ({ canvasElement, args }) => {\n const canvas = within(canvasElement);\n const switchEl = await canvas.findByText(\"Low power mode\");\n\n expect(switchEl).not.toHaveAttribute(\"data-focused\");\n expect(switchEl).toHaveAttribute(\"data-selected\", \"true\");\n\n await userEvent.click(switchEl);\n expect(switchEl).not.toHaveAttribute(\"data-selected\");\n expect(args.onChange).toHaveBeenCalledWith(false);\n },\n};\n\nexport const AutoFocused: Story = {\n args: {\n autoFocus: true,\n },\n play: async ({ canvasElement }) => {\n const canvas = within(canvasElement);\n const switchEl = await canvas.findByText(\"Low power mode\");\n\n waitFor(() => expect(switchEl).toHaveAttribute(\"data-focused\", \"true\"));\n },\n};\n\nexport const ReadOnly: Story = {\n args: {\n isReadOnly: true,\n },\n play: async ({ canvasElement, args }) => {\n const canvas = within(canvasElement);\n const switchEl = await canvas.findByText(\"Low power mode\");\n\n expect(switchEl).not.toHaveAttribute(\"data-selected\");\n expect(switchEl).not.toHaveAttribute(\"data-disabled\");\n\n await userEvent.click(switchEl);\n expect(switchEl).not.toHaveAttribute(\"data-selected\"); // unchanged\n expect(args.onChange).not.toHaveBeenCalled();\n },\n};\n\nexport const Disabled: Story = {\n args: {\n isDisabled: true,\n },\n play: async ({ canvasElement, args }) => {\n const canvas = within(canvasElement);\n const switchEl = await canvas.findByText(\"Low power mode\");\n\n expect(switchEl).not.toHaveAttribute(\"data-selected\");\n expect(switchEl).toHaveAttribute(\"data-disabled\", \"true\");\n\n await userEvent.click(switchEl);\n expect(switchEl).not.toHaveAttribute(\"data-selected\"); // unchanged\n expect(args.onChange).not.toHaveBeenCalled();\n },\n};\n\nexport const Controlled: Story = {\n args: {\n defaultSelected: true,\n },\n render: (args) => {\n const [selected, setSelected] = useState(args.defaultSelected);\n return (\n <BaseSwitch\n {...args}\n isSelected={selected}\n onChange={(newVal) => {\n setSelected(newVal);\n args.onChange?.(newVal);\n }}\n >\n <div className=\"indicator\" />\n Low power mode\n </BaseSwitch>\n );\n },\n play: async ({ canvasElement, args }) => {\n const canvas = within(canvasElement);\n const switchEl = await canvas.findByText(\"Low power mode\");\n\n expect(switchEl).toHaveAttribute(\"data-selected\", \"true\");\n await userEvent.click(switchEl);\n expect(switchEl).not.toHaveAttribute(\"data-selected\");\n\n expect(args.onChange).toHaveBeenCalledWith(false);\n expect(args.onChange).toHaveBeenCalledOnce();\n\n await userEvent.click(switchEl);\n expect(switchEl).toHaveAttribute(\"data-selected\", \"true\");\n\n expect(args.onChange).toHaveBeenCalledWith(true);\n expect(args.onChange).toHaveBeenCalledTimes(2);\n },\n};\n"],"names":[],"mappings":"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"}
|
|
@@ -1,199 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var test = require('@storybook/test');
|
|
4
|
-
var React = require('react');
|
|
5
|
-
var registerLabel = require('./registerLabel.cjs.js');
|
|
6
|
-
var registerTextField = require('./registerTextField.cjs.js');
|
|
7
|
-
require('react-aria-components');
|
|
8
|
-
require('./common-45acb83c.cjs.js');
|
|
9
|
-
require('./utils-fc1ddd7c.cjs.js');
|
|
10
|
-
require('@plasmicapp/host');
|
|
11
|
-
require('@plasmicapp/host/registerComponent');
|
|
12
|
-
require('./contexts-6d0cb2b1.cjs.js');
|
|
13
|
-
require('./registerDescription.cjs.js');
|
|
14
|
-
require('./registerText.cjs.js');
|
|
15
|
-
require('./registerInput.cjs.js');
|
|
16
|
-
require('react-aria');
|
|
17
|
-
require('./variant-utils-0ad70db8.cjs.js');
|
|
18
|
-
|
|
19
|
-
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
20
|
-
|
|
21
|
-
var React__default = /*#__PURE__*/_interopDefault(React);
|
|
22
|
-
|
|
23
|
-
var __defProp = Object.defineProperty;
|
|
24
|
-
var __defProps = Object.defineProperties;
|
|
25
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
26
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
27
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
28
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
29
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
30
|
-
var __spreadValues = (a, b) => {
|
|
31
|
-
for (var prop in b || (b = {}))
|
|
32
|
-
if (__hasOwnProp.call(b, prop))
|
|
33
|
-
__defNormalProp(a, prop, b[prop]);
|
|
34
|
-
if (__getOwnPropSymbols)
|
|
35
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
36
|
-
if (__propIsEnum.call(b, prop))
|
|
37
|
-
__defNormalProp(a, prop, b[prop]);
|
|
38
|
-
}
|
|
39
|
-
return a;
|
|
40
|
-
};
|
|
41
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
42
|
-
const Basic = {
|
|
43
|
-
args: {
|
|
44
|
-
onFocus: test.fn(),
|
|
45
|
-
onBlur: test.fn(),
|
|
46
|
-
onFocusChange: test.fn(),
|
|
47
|
-
onKeyDown: test.fn(),
|
|
48
|
-
onKeyUp: test.fn(),
|
|
49
|
-
onBeforeInput: test.fn(),
|
|
50
|
-
onInput: test.fn()
|
|
51
|
-
},
|
|
52
|
-
play: async ({ canvasElement, args }) => {
|
|
53
|
-
const canvas = test.within(canvasElement);
|
|
54
|
-
const textbox = await canvas.findByRole("textbox");
|
|
55
|
-
const label = await canvas.findByText("Label");
|
|
56
|
-
test.expect(textbox).not.toHaveFocus();
|
|
57
|
-
await test.userEvent.click(label);
|
|
58
|
-
await test.waitFor(() => {
|
|
59
|
-
test.expect(textbox).toHaveFocus();
|
|
60
|
-
test.expect(args.onFocus).toHaveBeenCalledOnce();
|
|
61
|
-
});
|
|
62
|
-
await test.userEvent.type(textbox, "testuser");
|
|
63
|
-
test.expect(textbox).toHaveValue("testuser");
|
|
64
|
-
await test.waitFor(() => {
|
|
65
|
-
test.expect(args.onChange).toHaveBeenCalledTimes(8);
|
|
66
|
-
test.expect(args.onInput).toHaveBeenCalledTimes(8);
|
|
67
|
-
test.expect(args.onKeyDown).toHaveBeenCalledTimes(8);
|
|
68
|
-
test.expect(args.onKeyUp).toHaveBeenCalledTimes(8);
|
|
69
|
-
});
|
|
70
|
-
await test.userEvent.tab();
|
|
71
|
-
await test.waitFor(() => {
|
|
72
|
-
test.expect(textbox).not.toHaveFocus();
|
|
73
|
-
test.expect(args.onBlur).toHaveBeenCalledOnce();
|
|
74
|
-
test.expect(args.onFocusChange).toHaveBeenCalledTimes(2);
|
|
75
|
-
});
|
|
76
|
-
}
|
|
77
|
-
};
|
|
78
|
-
const WithInitialValue = {
|
|
79
|
-
args: {
|
|
80
|
-
defaultValue: "initial value"
|
|
81
|
-
},
|
|
82
|
-
play: async ({ canvasElement }) => {
|
|
83
|
-
const canvas = test.within(canvasElement);
|
|
84
|
-
const textbox = await canvas.findByRole("textbox");
|
|
85
|
-
test.expect(textbox).toHaveValue("initial value");
|
|
86
|
-
await test.userEvent.type(textbox, "++");
|
|
87
|
-
test.expect(textbox).toHaveValue("initial value++");
|
|
88
|
-
}
|
|
89
|
-
};
|
|
90
|
-
const Disabled = {
|
|
91
|
-
args: {
|
|
92
|
-
isDisabled: true
|
|
93
|
-
},
|
|
94
|
-
play: async ({ canvasElement, args }) => {
|
|
95
|
-
const canvas = test.within(canvasElement);
|
|
96
|
-
const textbox = await canvas.findByRole("textbox");
|
|
97
|
-
test.expect(textbox).toBeDisabled();
|
|
98
|
-
await test.userEvent.click(textbox);
|
|
99
|
-
test.expect(textbox).not.toHaveFocus();
|
|
100
|
-
await test.userEvent.type(textbox, "++");
|
|
101
|
-
test.expect(textbox).toHaveValue("");
|
|
102
|
-
test.expect(args.onChange).not.toHaveBeenCalled();
|
|
103
|
-
}
|
|
104
|
-
};
|
|
105
|
-
const ReadOnly = {
|
|
106
|
-
args: {
|
|
107
|
-
isReadOnly: true,
|
|
108
|
-
defaultValue: "Read-only content"
|
|
109
|
-
},
|
|
110
|
-
play: async ({ canvasElement, args }) => {
|
|
111
|
-
const canvas = test.within(canvasElement);
|
|
112
|
-
const textbox = await canvas.findByRole("textbox");
|
|
113
|
-
test.expect(textbox).not.toBeDisabled();
|
|
114
|
-
test.expect(textbox).toHaveValue("Read-only content");
|
|
115
|
-
await test.userEvent.type(textbox, "attempted edit");
|
|
116
|
-
test.expect(textbox).toHaveValue("Read-only content");
|
|
117
|
-
test.expect(args.onChange).not.toHaveBeenCalled();
|
|
118
|
-
}
|
|
119
|
-
};
|
|
120
|
-
const AutoFocused = {
|
|
121
|
-
args: {
|
|
122
|
-
autoFocus: true
|
|
123
|
-
},
|
|
124
|
-
play: async ({ canvasElement }) => {
|
|
125
|
-
const canvas = test.within(canvasElement);
|
|
126
|
-
const textbox = await canvas.findByRole("textbox");
|
|
127
|
-
test.expect(textbox).toHaveFocus();
|
|
128
|
-
}
|
|
129
|
-
};
|
|
130
|
-
const WithAutoComplete = {
|
|
131
|
-
args: {
|
|
132
|
-
autoComplete: ["shipping", "street-address"]
|
|
133
|
-
},
|
|
134
|
-
play: async ({ canvasElement }) => {
|
|
135
|
-
const canvas = test.within(canvasElement);
|
|
136
|
-
const textbox = await canvas.findByRole("textbox");
|
|
137
|
-
test.expect(textbox).toHaveAttribute("autocomplete", "shipping street-address");
|
|
138
|
-
}
|
|
139
|
-
};
|
|
140
|
-
const WithMaxLength = {
|
|
141
|
-
args: {
|
|
142
|
-
maxLength: 10
|
|
143
|
-
},
|
|
144
|
-
play: async ({ canvasElement }) => {
|
|
145
|
-
const canvas = test.within(canvasElement);
|
|
146
|
-
const textbox = await canvas.findByRole("textbox");
|
|
147
|
-
test.expect(textbox).toHaveAttribute("maxlength", "10");
|
|
148
|
-
await test.userEvent.type(textbox, "abcdefghijklmnopqrstuvwxyz");
|
|
149
|
-
test.expect(textbox).toHaveValue("abcdefghij");
|
|
150
|
-
}
|
|
151
|
-
};
|
|
152
|
-
const Invalid = {
|
|
153
|
-
args: {
|
|
154
|
-
isInvalid: true
|
|
155
|
-
},
|
|
156
|
-
play: async ({ canvasElement }) => {
|
|
157
|
-
const canvas = test.within(canvasElement);
|
|
158
|
-
const textbox = await canvas.findByRole("textbox");
|
|
159
|
-
test.expect(textbox).toHaveAttribute("aria-invalid", "true");
|
|
160
|
-
}
|
|
161
|
-
};
|
|
162
|
-
const createControlledTextFieldStory = (inputComponent) => ({
|
|
163
|
-
render: (args) => {
|
|
164
|
-
var _a;
|
|
165
|
-
const [value, setValue] = React.useState((_a = args.defaultValue) != null ? _a : "");
|
|
166
|
-
return /* @__PURE__ */ React__default.default.createElement(
|
|
167
|
-
registerTextField.BaseTextField,
|
|
168
|
-
__spreadProps(__spreadValues({}, args), {
|
|
169
|
-
value,
|
|
170
|
-
onChange: (e) => {
|
|
171
|
-
var _a2;
|
|
172
|
-
setValue(e);
|
|
173
|
-
(_a2 = args.onChange) == null ? void 0 : _a2.call(args, e);
|
|
174
|
-
}
|
|
175
|
-
}),
|
|
176
|
-
/* @__PURE__ */ React__default.default.createElement(registerLabel.BaseLabel, null, "Label"),
|
|
177
|
-
inputComponent
|
|
178
|
-
);
|
|
179
|
-
},
|
|
180
|
-
play: async ({ canvasElement, args }) => {
|
|
181
|
-
const canvas = test.within(canvasElement);
|
|
182
|
-
const textbox = await canvas.findByRole("textbox");
|
|
183
|
-
test.expect(textbox).toHaveValue("");
|
|
184
|
-
await test.userEvent.type(textbox, "testuser");
|
|
185
|
-
test.expect(textbox).toHaveValue("testuser");
|
|
186
|
-
test.expect(args.onChange).toHaveBeenCalledWith("testuser");
|
|
187
|
-
}
|
|
188
|
-
});
|
|
189
|
-
|
|
190
|
-
exports.AutoFocused = AutoFocused;
|
|
191
|
-
exports.Basic = Basic;
|
|
192
|
-
exports.Disabled = Disabled;
|
|
193
|
-
exports.Invalid = Invalid;
|
|
194
|
-
exports.ReadOnly = ReadOnly;
|
|
195
|
-
exports.WithAutoComplete = WithAutoComplete;
|
|
196
|
-
exports.WithInitialValue = WithInitialValue;
|
|
197
|
-
exports.WithMaxLength = WithMaxLength;
|
|
198
|
-
exports.createControlledTextFieldStory = createControlledTextFieldStory;
|
|
199
|
-
//# sourceMappingURL=registerTextField-common-stories.cjs.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"registerTextField-common-stories.cjs.js","sources":["../src/registerTextField-common-stories.tsx"],"sourcesContent":["import type { StoryObj } from \"@storybook/react\";\nimport { expect, fn, userEvent, waitFor, within } from \"@storybook/test\";\nimport React, { useState } from \"react\";\nimport { BaseLabel } from \"./registerLabel\";\nimport { BaseTextField } from \"./registerTextField\";\n\nexport type Story = StoryObj<typeof BaseTextField>;\n\nexport const Basic: Story = {\n args: {\n onFocus: fn(),\n onBlur: fn(),\n onFocusChange: fn(),\n onKeyDown: fn(),\n onKeyUp: fn(),\n onBeforeInput: fn(),\n onInput: fn(),\n },\n play: async ({ canvasElement, args }) => {\n const canvas = within(canvasElement);\n const textbox = await canvas.findByRole(\"textbox\");\n const label = await canvas.findByText(\"Label\");\n\n // Verify initial state\n expect(textbox).not.toHaveFocus();\n\n // Test interaction\n await userEvent.click(label);\n await waitFor(() => {\n expect(textbox).toHaveFocus();\n expect(args.onFocus).toHaveBeenCalledOnce();\n });\n\n await userEvent.type(textbox, \"testuser\");\n expect(textbox).toHaveValue(\"testuser\");\n await waitFor(() => {\n expect(args.onChange).toHaveBeenCalledTimes(8);\n expect(args.onInput).toHaveBeenCalledTimes(8);\n // onBeforeInput isn't fired by userEvent.type because of an issue in @testing-library/user-event or React: https://github.com/testing-library/user-event/issues/858#issuecomment-1124820366\n // On actual key presses, it is fired.\n // expect(args.onBeforeInput).toHaveBeenCalledTimes(8);\n expect(args.onKeyDown).toHaveBeenCalledTimes(8);\n expect(args.onKeyUp).toHaveBeenCalledTimes(8);\n });\n\n await userEvent.tab();\n await waitFor(() => {\n expect(textbox).not.toHaveFocus();\n expect(args.onBlur).toHaveBeenCalledOnce();\n expect(args.onFocusChange).toHaveBeenCalledTimes(2);\n });\n },\n};\n\n// TextField with initial value\nexport const WithInitialValue: Story = {\n args: {\n defaultValue: \"initial value\",\n },\n play: async ({ canvasElement }) => {\n const canvas = within(canvasElement);\n const textbox = await canvas.findByRole(\"textbox\");\n\n // Verify initial value\n expect(textbox).toHaveValue(\"initial value\");\n await userEvent.type(textbox, \"++\");\n expect(textbox).toHaveValue(\"initial value++\");\n },\n};\n\n// Disabled TextField\nexport const Disabled: Story = {\n args: {\n isDisabled: true,\n },\n play: async ({ canvasElement, args }) => {\n const canvas = within(canvasElement);\n const textbox = await canvas.findByRole(\"textbox\");\n\n // Verify disabled state\n expect(textbox).toBeDisabled();\n\n // Try to interact and verify nothing happens\n await userEvent.click(textbox);\n expect(textbox).not.toHaveFocus(); // not changed\n\n await userEvent.type(textbox, \"++\");\n expect(textbox).toHaveValue(\"\"); // not changed\n expect(args.onChange).not.toHaveBeenCalled();\n },\n};\n\n// Read-only TextField\nexport const ReadOnly: Story = {\n args: {\n isReadOnly: true,\n defaultValue: \"Read-only content\",\n },\n play: async ({ canvasElement, args }) => {\n const canvas = within(canvasElement);\n const textbox = await canvas.findByRole(\"textbox\");\n\n // Verify read-only state\n expect(textbox).not.toBeDisabled();\n expect(textbox).toHaveValue(\"Read-only content\");\n\n // Verify user can't type in the field\n await userEvent.type(textbox, \"attempted edit\");\n expect(textbox).toHaveValue(\"Read-only content\"); // not changed\n expect(args.onChange).not.toHaveBeenCalled();\n },\n};\n\nexport const AutoFocused: Story = {\n args: {\n autoFocus: true,\n },\n play: async ({ canvasElement }) => {\n const canvas = within(canvasElement);\n const textbox = await canvas.findByRole(\"textbox\");\n\n expect(textbox).toHaveFocus();\n },\n};\n\n// TextField with custom auto-complete\nexport const WithAutoComplete: Story = {\n args: {\n autoComplete: [\"shipping\", \"street-address\"],\n },\n play: async ({ canvasElement }) => {\n const canvas = within(canvasElement);\n const textbox = await canvas.findByRole(\"textbox\");\n\n // Verify autocomplete attribute\n expect(textbox).toHaveAttribute(\"autocomplete\", \"shipping street-address\");\n },\n};\n\n// TextField with max length\nexport const WithMaxLength: Story = {\n args: {\n maxLength: 10,\n },\n play: async ({ canvasElement }) => {\n const canvas = within(canvasElement);\n const textbox = await canvas.findByRole(\"textbox\");\n\n // Verify maxlength attribute\n expect(textbox).toHaveAttribute(\"maxlength\", \"10\");\n\n // Type more than max length and verify truncation\n await userEvent.type(textbox, \"abcdefghijklmnopqrstuvwxyz\");\n expect(textbox).toHaveValue(\"abcdefghij\"); // uses the first 10 characters only\n },\n};\n\n// TextField with invalid state\nexport const Invalid: Story = {\n args: {\n isInvalid: true,\n },\n play: async ({ canvasElement }) => {\n const canvas = within(canvasElement);\n const textbox = await canvas.findByRole(\"textbox\");\n\n // Verify aria-invalid attribute\n expect(textbox).toHaveAttribute(\"aria-invalid\", \"true\");\n },\n};\n\nexport const createControlledTextFieldStory = (\n inputComponent: React.ReactElement\n) =>\n ({\n render: (args) => {\n const [value, setValue] = useState(args.defaultValue ?? \"\");\n return (\n <BaseTextField\n {...args}\n value={value}\n onChange={(e) => {\n setValue(e);\n args.onChange?.(e);\n }}\n >\n <BaseLabel>Label</BaseLabel>\n {inputComponent}\n </BaseTextField>\n );\n },\n play: async ({ canvasElement, args }) => {\n const canvas = within(canvasElement);\n const textbox = await canvas.findByRole(\"textbox\");\n expect(textbox).toHaveValue(\"\");\n\n await userEvent.type(textbox, \"testuser\");\n expect(textbox).toHaveValue(\"testuser\");\n expect(args.onChange).toHaveBeenCalledWith(\"testuser\");\n },\n } as Story);\n"],"names":["fn","within","expect","userEvent","waitFor","useState","React","BaseTextField","_a","BaseLabel"],"mappings":"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"}
|