@spectrum-web-components/picker 1.0.1 → 1.0.2

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.
@@ -1,606 +0,0 @@
1
- "use strict";
2
- import { html } from "@spectrum-web-components/base";
3
- import "@spectrum-web-components/link/sp-link.js";
4
- import "@spectrum-web-components/picker/sp-picker.js";
5
- import "@spectrum-web-components/menu/sp-menu-item.js";
6
- import "@spectrum-web-components/tooltip/sp-tooltip.js";
7
- import "@spectrum-web-components/icons-workflow/icons/sp-icon-edit.js";
8
- import "@spectrum-web-components/icons-workflow/icons/sp-icon-copy.js";
9
- import "@spectrum-web-components/icons-workflow/icons/sp-icon-delete.js";
10
- import { states } from "./states.js";
11
- import "@spectrum-web-components/field-label/sp-field-label.js";
12
- import { spreadProps } from "../../../test/lit-helpers.js";
13
- import { isOverlayOpen } from "../../overlay/stories/index.js";
14
- import "../../overlay/stories/index.js";
15
- import { handleChange, Template } from "./template.js";
16
- import { argTypes } from "./args.js";
17
- import { ifDefined } from "lit-html/directives/if-defined.js";
18
- export default {
19
- title: "Picker",
20
- component: "sp-picker",
21
- args: {
22
- disabled: false,
23
- invalid: false,
24
- open: false,
25
- quiet: false,
26
- pending: false
27
- },
28
- argTypes: {
29
- ...argTypes,
30
- onChange: { action: "change" },
31
- open: {
32
- name: "open",
33
- type: { name: "boolean", required: false },
34
- description: "Whether the menu is open or not.",
35
- table: {
36
- type: { summary: "boolean" },
37
- defaultValue: { summary: false }
38
- },
39
- control: "boolean"
40
- },
41
- pending: {
42
- name: "pending",
43
- type: { name: "boolean", required: false },
44
- table: {
45
- type: { summary: "boolean" },
46
- defaultValue: { summary: false }
47
- },
48
- control: {
49
- type: "boolean"
50
- }
51
- }
52
- }
53
- };
54
- export const Default = (args) => {
55
- return html`
56
- <sp-field-label for="picker-1" size=${ifDefined(args.size)}>
57
- Where do you live?
58
- </sp-field-label>
59
- <sp-picker
60
- id="picker-1"
61
- @change=${handleChange(args)}
62
- label="Select a Country with a very long label, too long, in fact"
63
- ${spreadProps(args)}
64
- >
65
- <sp-menu-item value="option-1">Deselect</sp-menu-item>
66
- <sp-menu-item value="option-2">Select Inverse</sp-menu-item>
67
- <sp-menu-item value="option-3">Feather...</sp-menu-item>
68
- <sp-menu-item value="option-4">Select and Mask...</sp-menu-item>
69
- <sp-menu-item value="option-5">Save Selection</sp-menu-item>
70
- <sp-menu-item disabled value="option-6">
71
- Make Work Path
72
- </sp-menu-item>
73
- </sp-picker>
74
- <p>This is some text.</p>
75
- <p>This is some text.</p>
76
- <p>
77
- This is a
78
- <a href="#anchor">link</a>
79
- .
80
- </p>
81
- `;
82
- };
83
- export const disabled = (args) => Template(args);
84
- disabled.args = {
85
- disabled: true
86
- };
87
- export const invalid = (args) => Template(args);
88
- invalid.args = {
89
- invalid: true
90
- };
91
- export const tooltip = (args) => {
92
- const { open, ...rest } = args;
93
- return html`
94
- <sp-field-label for="picker-1" size=${ifDefined(args.size)}>
95
- Where do you live?
96
- </sp-field-label>
97
- <sp-picker
98
- id="picker-1"
99
- @change=${handleChange(args)}
100
- label="Select a Country with a very long label, too long, in fact"
101
- ${spreadProps(rest)}
102
- >
103
- <sp-menu-item value="option-1">Deselect</sp-menu-item>
104
- <sp-menu-item value="option-2">Select Inverse</sp-menu-item>
105
- <sp-menu-item value="option-3">Feather...</sp-menu-item>
106
- <sp-menu-item value="option-4">Select and Mask...</sp-menu-item>
107
- <sp-menu-item value="option-5">Save Selection</sp-menu-item>
108
- <sp-menu-item disabled value="option-6">
109
- Make Work Path
110
- </sp-menu-item>
111
- <sp-tooltip
112
- slot="tooltip"
113
- ?open=${open}
114
- self-managed
115
- placement="right"
116
- >
117
- This Picker wants to know where you live.
118
- </sp-tooltip>
119
- </sp-picker>
120
- <p>This is some text.</p>
121
- <p>This is some text.</p>
122
- <p>
123
- This is a
124
- <a href="#anchor">link</a>
125
- .
126
- </p>
127
- `;
128
- };
129
- tooltip.args = {
130
- open: true
131
- };
132
- tooltip.decorators = [isOverlayOpen];
133
- export const leftSideLabel = (args) => {
134
- return html`
135
- <sp-field-label
136
- side-aligned="start"
137
- for="picker-1"
138
- size=${ifDefined(args.size)}
139
- >
140
- Where do you live?
141
- </sp-field-label>
142
- <sp-picker
143
- id="picker-1"
144
- @change=${handleChange(args)}
145
- label="Select a Country with a very long label, too long, in fact"
146
- ${spreadProps(args)}
147
- >
148
- <sp-menu-item value="option-1">Deselect</sp-menu-item>
149
- <sp-menu-item value="option-2">Select Inverse</sp-menu-item>
150
- <sp-menu-item value="option-3">Feather...</sp-menu-item>
151
- <sp-menu-item value="option-4">Select and Mask...</sp-menu-item>
152
- <sp-menu-item value="option-5">Save Selection</sp-menu-item>
153
- <sp-menu-item disabled value="option-6">
154
- Make Work Path
155
- </sp-menu-item>
156
- </sp-picker>
157
- <p>This is some text.</p>
158
- <p>This is some text.</p>
159
- <p>
160
- This is a
161
- <a href="#anchor">link</a>
162
- .
163
- </p>
164
- `;
165
- };
166
- export const noVisibleLabel = (args) => {
167
- return html`
168
- <sp-picker
169
- @change=${handleChange(args)}
170
- label="Where do you live?"
171
- ${spreadProps(args)}
172
- >
173
- <sp-menu-item value="option-1">Deselect</sp-menu-item>
174
- <sp-menu-item value="option-2">Select Inverse</sp-menu-item>
175
- <sp-menu-item value="option-3">Feather...</sp-menu-item>
176
- <sp-menu-item value="option-4">Select and Mask...</sp-menu-item>
177
- <sp-menu-item value="option-5">Save Selection</sp-menu-item>
178
- <sp-menu-item disabled value="option-6">
179
- Make Work Path
180
- </sp-menu-item>
181
- </sp-picker>
182
- <p>This is some text.</p>
183
- <p>This is some text.</p>
184
- <p>
185
- This is a
186
- <a href="#anchor">link</a>
187
- .
188
- </p>
189
- `;
190
- };
191
- export const slottedLabel = (args) => {
192
- return html`
193
- <sp-picker @change=${handleChange(args)} ${spreadProps(args)}>
194
- <span slot="label">Where do you live?</span>
195
- <sp-menu-item value="option-1">Deselect</sp-menu-item>
196
- <sp-menu-item value="option-2">Select Inverse</sp-menu-item>
197
- <sp-menu-item value="option-3">Feather...</sp-menu-item>
198
- <sp-menu-item value="option-4">Select and Mask...</sp-menu-item>
199
- <sp-menu-item value="option-5">Save Selection</sp-menu-item>
200
- <sp-menu-item disabled value="option-6">
201
- Make Work Path
202
- </sp-menu-item>
203
- </sp-picker>
204
- <p>This is some text.</p>
205
- <p>This is some text.</p>
206
- <p>
207
- This is a
208
- <a href="#anchor">link</a>
209
- .
210
- </p>
211
- `;
212
- };
213
- export const quiet = (args) => {
214
- return html`
215
- <sp-field-label for="picker-quiet" size=${ifDefined(args.size)}>
216
- Where do you live?
217
- </sp-field-label>
218
- <sp-picker
219
- ${spreadProps(args)}
220
- id="picker-quiet"
221
- @change=${handleChange(args)}
222
- label="Pick an item"
223
- >
224
- <sp-menu-item value="1">Item 1</sp-menu-item>
225
- <sp-menu-item value="2">Item 2</sp-menu-item>
226
- <sp-menu-item value="3">Item 3</sp-menu-item>
227
- <sp-menu-item value="4">Item 4</sp-menu-item>
228
- </sp-picker>
229
- <p>This is some text.</p>
230
- <p>This is some text.</p>
231
- <p>
232
- This is a
233
- <a href="#anchor">link</a>
234
- .
235
- </p>
236
- `;
237
- };
238
- quiet.args = {
239
- quiet: true
240
- };
241
- export const quietSideLabel = (args) => {
242
- return html`
243
- <sp-field-label
244
- side-aligned="start"
245
- for="picker-quiet-sidelabel"
246
- size=${ifDefined(args.size)}
247
- >
248
- Where do you live?
249
- </sp-field-label>
250
- <sp-picker
251
- ${spreadProps(args)}
252
- id="picker-quiet-sidelabel"
253
- @change=${handleChange(args)}
254
- label="Pick an item"
255
- >
256
- <sp-menu-item value="1">Item 1</sp-menu-item>
257
- <sp-menu-item value="2">Item 2</sp-menu-item>
258
- <sp-menu-item value="3">Item 3</sp-menu-item>
259
- <sp-menu-item value="4">Item 4</sp-menu-item>
260
- </sp-picker>
261
- <p>This is some text.</p>
262
- <p>This is some text.</p>
263
- <p>
264
- This is a
265
- <a href="#anchor">link</a>
266
- .
267
- </p>
268
- `;
269
- };
270
- quietSideLabel.args = {
271
- quiet: true
272
- };
273
- export const icons = (args) => {
274
- return html`
275
- <sp-field-label for="picker-quiet" size=${ifDefined(args.size)}>
276
- Choose an action type...
277
- </sp-field-label>
278
- <sp-picker
279
- ${spreadProps(args)}
280
- id="picker-quiet"
281
- @change=${handleChange(args)}
282
- label="Pick an action"
283
- value="1"
284
- >
285
- <sp-menu-item value="1">
286
- <sp-icon-edit slot="icon"></sp-icon-edit>
287
- Edit
288
- </sp-menu-item>
289
- <sp-menu-item value="2">
290
- <sp-icon-copy slot="icon"></sp-icon-copy>
291
- Copy
292
- </sp-menu-item>
293
- <sp-menu-item value="3">
294
- <sp-icon-delete slot="icon"></sp-icon-delete>
295
- Delete
296
- </sp-menu-item>
297
- </sp-picker>
298
- `;
299
- };
300
- export const iconsNone = (args) => {
301
- return html`
302
- <sp-field-label for="picker-quiet" size=${ifDefined(args.size)}>
303
- Choose an action type...
304
- </sp-field-label>
305
- <sp-picker
306
- ${spreadProps(args)}
307
- id="picker-quiet"
308
- @change=${handleChange(args)}
309
- label="Pick an action"
310
- value="1"
311
- icons="none"
312
- >
313
- <sp-menu-item value="1">
314
- <sp-icon-edit slot="icon"></sp-icon-edit>
315
- Edit
316
- </sp-menu-item>
317
- <sp-menu-item value="2">
318
- <sp-icon-copy slot="icon"></sp-icon-copy>
319
- Copy
320
- </sp-menu-item>
321
- <sp-menu-item value="3">
322
- <sp-icon-delete slot="icon"></sp-icon-delete>
323
- Delete
324
- </sp-menu-item>
325
- </sp-picker>
326
- `;
327
- };
328
- iconsNone.args = {
329
- open: true
330
- };
331
- iconsNone.decorators = [isOverlayOpen];
332
- export const iconValue = (args) => {
333
- return html`
334
- <sp-field-label for="picker-quiet" size=${ifDefined(args.size)}>
335
- Choose an action type...
336
- </sp-field-label>
337
- <sp-picker
338
- ${spreadProps(args)}
339
- id="picker-quiet"
340
- @change=${handleChange(args)}
341
- label="Pick an action"
342
- icons="only"
343
- style="width: 100px"
344
- value="2"
345
- >
346
- <sp-menu-item value="1">
347
- <sp-icon-edit slot="icon"></sp-icon-edit>
348
- Edit
349
- </sp-menu-item>
350
- <sp-menu-item value="2">
351
- <sp-icon-copy slot="icon"></sp-icon-copy>
352
- Copy
353
- </sp-menu-item>
354
- <sp-menu-item value="3">
355
- <sp-icon-delete slot="icon"></sp-icon-delete>
356
- Delete
357
- </sp-menu-item>
358
- </sp-picker>
359
- `;
360
- };
361
- export const iconsOnly = (args) => {
362
- return html`
363
- <sp-field-label for="picker-quiet" size=${ifDefined(args.size)}>
364
- Choose an action type...
365
- </sp-field-label>
366
- <sp-picker
367
- ${spreadProps(args)}
368
- id="picker-quiet"
369
- @change=${handleChange(args)}
370
- label="Pick an action"
371
- style="width: 100px"
372
- value="3"
373
- >
374
- <sp-menu-item value="1">
375
- <sp-icon-edit slot="icon" label="Edit"></sp-icon-edit>
376
- </sp-menu-item>
377
- <sp-menu-item value="2">
378
- <sp-icon-copy slot="icon" label="Copy"></sp-icon-copy>
379
- </sp-menu-item>
380
- <sp-menu-item value="3">
381
- <sp-icon-delete slot="icon" label="Delete"></sp-icon-delete>
382
- </sp-menu-item>
383
- </sp-picker>
384
- `;
385
- };
386
- iconsOnly.args = {
387
- open: true
388
- };
389
- iconsOnly.decorators = [isOverlayOpen];
390
- export const Open = (args) => {
391
- return html`
392
- <style>
393
- fieldset {
394
- float: left;
395
- clear: left;
396
- margin-bottom: 15px;
397
- }
398
- </style>
399
- <fieldset class="backdrop-filter-test">
400
- <sp-field-label for="picker-open" size=${ifDefined(args.size)}>
401
- Where do you live?
402
- </sp-field-label>
403
- <sp-picker
404
- id="picker-open"
405
- label="Open picker"
406
- ${spreadProps(args)}
407
- @change=${handleChange(args)}
408
- >
409
- <span slot="label">
410
- Select a Country with a very long label, too long, in fact
411
- </span>
412
- <sp-menu-item>Deselect</sp-menu-item>
413
- <sp-menu-item>Select Inverse</sp-menu-item>
414
- <sp-menu-item>Feather...</sp-menu-item>
415
- <sp-menu-item>Select and Mask...</sp-menu-item>
416
- <sp-menu-item>Save Selection</sp-menu-item>
417
- <sp-menu-item disabled>Make Work Path</sp-menu-item>
418
- </sp-picker>
419
- </fieldset>
420
- <fieldset>
421
- <sp-field-label for="picker-closed" size=${ifDefined(args.size)}>
422
- Where do you live?
423
- </sp-field-label>
424
- <sp-picker
425
- id="picker-closed"
426
- label="Picker that displays below the options"
427
- @change=${handleChange(args)}
428
- >
429
- <span slot="label">
430
- Other menu that goes behind the open one
431
- </span>
432
- <sp-menu-item>Not so many options...</sp-menu-item>
433
- </sp-picker>
434
- </fieldset>
435
- `;
436
- };
437
- Open.args = {
438
- open: true
439
- };
440
- Open.decorators = [isOverlayOpen];
441
- export const OpenShowingEdgeCase = (args) => {
442
- return html`
443
- <style>
444
- fieldset {
445
- float: left;
446
- clear: left;
447
- margin-bottom: 15px;
448
- }
449
- /* Enforce CSS stacking to test "transition-behavior: allow-discrete" */
450
- /* Breaks the story in non-[popover] supporting browsers */
451
- fieldset:nth-of-type(2) {
452
- position: relative;
453
- z-index: 2;
454
- }
455
- .backdrop-filter-test {
456
- backdrop-filter: saturate(80%);
457
- }
458
- </style>
459
- <p>
460
- In browser that do not support
461
- <code>[popover]</code>
462
- , the following "open"
463
- <code>sp-picker</code>
464
- will display behind both the closed
465
- <code>sp-picker</code>
466
- as well as the
467
- <code>fieldset</code>
468
- that contains it.
469
- </p>
470
- <p>
471
- Learn more about this situation in our
472
- <sp-link
473
- href="https://opensource.adobe.com/spectrum-web-components/components/overlay/#fallback-support"
474
- >
475
- documentation site
476
- </sp-link>
477
- .
478
- </p>
479
- <fieldset class="backdrop-filter-test">
480
- <sp-field-label for="picker-open" size=${ifDefined(args.size)}>
481
- Where do you live?
482
- </sp-field-label>
483
- <sp-picker
484
- id="picker-open"
485
- label="Open picker"
486
- ${spreadProps(args)}
487
- @change=${handleChange(args)}
488
- >
489
- <span slot="label">
490
- Select a Country with a very long label, too long, in fact
491
- </span>
492
- <sp-menu-item>Deselect</sp-menu-item>
493
- <sp-menu-item>Select Inverse</sp-menu-item>
494
- <sp-menu-item>Feather...</sp-menu-item>
495
- <sp-menu-item>Select and Mask...</sp-menu-item>
496
- <sp-menu-item>Save Selection</sp-menu-item>
497
- <sp-menu-item disabled>Make Work Path</sp-menu-item>
498
- </sp-picker>
499
- </fieldset>
500
- <fieldset>
501
- <sp-field-label for="picker-closed" size=${ifDefined(args.size)}>
502
- Where do you live?
503
- </sp-field-label>
504
- <sp-picker
505
- id="picker-closed"
506
- label="Picker that displays below the options"
507
- @change=${handleChange(args)}
508
- >
509
- <span slot="label">
510
- Other menu that goes behind the open one
511
- </span>
512
- <sp-menu-item>Not so many options...</sp-menu-item>
513
- </sp-picker>
514
- </fieldset>
515
- `;
516
- };
517
- OpenShowingEdgeCase.args = {
518
- open: true
519
- };
520
- OpenShowingEdgeCase.decorators = [isOverlayOpen];
521
- OpenShowingEdgeCase.swc_vrt = {
522
- skip: true
523
- };
524
- export const initialValue = (args) => {
525
- return html`
526
- <sp-field-label for="picker-initial" size=${ifDefined(args.size)}>
527
- Where do you live?
528
- </sp-field-label>
529
- <sp-picker
530
- id="picker-initial"
531
- @change=${handleChange(args)}
532
- value="item-2"
533
- ${spreadProps(args)}
534
- >
535
- <span slot="label">
536
- Select a Country with a very long label, too long in fact
537
- </span>
538
- <sp-menu-item value="item-1">Deselect</sp-menu-item>
539
- <sp-menu-item value="item-2">Select Inverse</sp-menu-item>
540
- <sp-menu-item value="item-3">Feather...</sp-menu-item>
541
- <sp-menu-item value="item-4">Select and Mask...</sp-menu-item>
542
- <sp-menu-item value="item-5">Save Selection</sp-menu-item>
543
- <sp-menu-item disabled value="item-6">Make Work Path</sp-menu-item>
544
- </sp-picker>
545
- `;
546
- };
547
- export const readonly = (args) => {
548
- return html`
549
- <sp-picker
550
- @change=${handleChange(args)}
551
- readonly
552
- value="item-2"
553
- ${spreadProps(args)}
554
- >
555
- <span slot="label">
556
- Select a Country with a very long label, too long in fact
557
- </span>
558
- <sp-menu-item value="item-1">Deselect</sp-menu-item>
559
- <sp-menu-item value="item-2">Select Inverse</sp-menu-item>
560
- <sp-menu-item value="item-3">Feather...</sp-menu-item>
561
- <sp-menu-item value="item-4">Select and Mask...</sp-menu-item>
562
- <sp-menu-item value="item-5">Save Selection</sp-menu-item>
563
- <sp-menu-item disabled value="item-6">Make Work Path</sp-menu-item>
564
- </sp-picker>
565
- `;
566
- };
567
- export const custom = (args) => {
568
- const initialState = "lb1-mo";
569
- return html`
570
- <sp-field-label for="picker-state" size=${ifDefined(args.size)}>
571
- What state do you live in?
572
- </sp-field-label>
573
- <sp-picker
574
- style="width: 400px;"
575
- @change=${handleChange(args)}
576
- id="picker-state"
577
- label="Pick a state"
578
- ${spreadProps(args)}
579
- value=${initialState}
580
- >
581
- ${states.map(
582
- (state) => html`
583
- <sp-menu-item
584
- id=${state.id}
585
- value=${state.id}
586
- ?selected=${state.id === initialState}
587
- >
588
- ${state.label}
589
- </sp-menu-item>
590
- `
591
- )}
592
- </sp-picker>
593
- <p>This is some text.</p>
594
- <p>This is some text.</p>
595
- <p>
596
- This is a
597
- <a href="#anchor">link</a>
598
- .
599
- </p>
600
- `;
601
- };
602
- custom.args = {
603
- open: true
604
- };
605
- custom.decorators = [isOverlayOpen];
606
- //# sourceMappingURL=picker.stories.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["picker.stories.ts"],
4
- "sourcesContent": ["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\n\nimport { html, TemplateResult } from '@spectrum-web-components/base';\n\nimport '@spectrum-web-components/link/sp-link.js';\nimport '@spectrum-web-components/picker/sp-picker.js';\nimport '@spectrum-web-components/menu/sp-menu-item.js';\nimport '@spectrum-web-components/tooltip/sp-tooltip.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-edit.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-copy.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-delete.js';\nimport { states } from './states.js';\nimport '@spectrum-web-components/field-label/sp-field-label.js';\nimport { spreadProps } from '../../../test/lit-helpers.js';\nimport { isOverlayOpen } from '../../overlay/stories/index.js';\nimport '../../overlay/stories/index.js';\nimport { handleChange, StoryArgs, Template } from './template.js';\nimport { argTypes } from './args.js';\nimport { ifDefined } from 'lit-html/directives/if-defined.js';\n\nexport default {\n title: 'Picker',\n component: 'sp-picker',\n args: {\n disabled: false,\n invalid: false,\n open: false,\n quiet: false,\n pending: false,\n },\n argTypes: {\n ...argTypes,\n onChange: { action: 'change' },\n open: {\n name: 'open',\n type: { name: 'boolean', required: false },\n description: 'Whether the menu is open or not.',\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: 'boolean',\n },\n pending: {\n name: 'pending',\n type: { name: 'boolean', required: false },\n table: {\n type: { summary: 'boolean' },\n defaultValue: { summary: false },\n },\n control: {\n type: 'boolean',\n },\n },\n },\n};\n\nexport const Default = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"picker-1\" size=${ifDefined(args.size)}>\n Where do you live?\n </sp-field-label>\n <sp-picker\n id=\"picker-1\"\n @change=${handleChange(args)}\n label=\"Select a Country with a very long label, too long, in fact\"\n ${spreadProps(args)}\n >\n <sp-menu-item value=\"option-1\">Deselect</sp-menu-item>\n <sp-menu-item value=\"option-2\">Select Inverse</sp-menu-item>\n <sp-menu-item value=\"option-3\">Feather...</sp-menu-item>\n <sp-menu-item value=\"option-4\">Select and Mask...</sp-menu-item>\n <sp-menu-item value=\"option-5\">Save Selection</sp-menu-item>\n <sp-menu-item disabled value=\"option-6\">\n Make Work Path\n </sp-menu-item>\n </sp-picker>\n <p>This is some text.</p>\n <p>This is some text.</p>\n <p>\n This is a\n <a href=\"#anchor\">link</a>\n .\n </p>\n `;\n};\n\nexport const disabled = (args: StoryArgs): TemplateResult => Template(args);\ndisabled.args = {\n disabled: true,\n};\n\nexport const invalid = (args: StoryArgs): TemplateResult => Template(args);\ninvalid.args = {\n invalid: true,\n};\n\nexport const tooltip = (args: StoryArgs): TemplateResult => {\n const { open, ...rest } = args;\n return html`\n <sp-field-label for=\"picker-1\" size=${ifDefined(args.size)}>\n Where do you live?\n </sp-field-label>\n <sp-picker\n id=\"picker-1\"\n @change=${handleChange(args)}\n label=\"Select a Country with a very long label, too long, in fact\"\n ${spreadProps(rest)}\n >\n <sp-menu-item value=\"option-1\">Deselect</sp-menu-item>\n <sp-menu-item value=\"option-2\">Select Inverse</sp-menu-item>\n <sp-menu-item value=\"option-3\">Feather...</sp-menu-item>\n <sp-menu-item value=\"option-4\">Select and Mask...</sp-menu-item>\n <sp-menu-item value=\"option-5\">Save Selection</sp-menu-item>\n <sp-menu-item disabled value=\"option-6\">\n Make Work Path\n </sp-menu-item>\n <sp-tooltip\n slot=\"tooltip\"\n ?open=${open}\n self-managed\n placement=\"right\"\n >\n This Picker wants to know where you live.\n </sp-tooltip>\n </sp-picker>\n <p>This is some text.</p>\n <p>This is some text.</p>\n <p>\n This is a\n <a href=\"#anchor\">link</a>\n .\n </p>\n `;\n};\ntooltip.args = {\n open: true,\n};\ntooltip.decorators = [isOverlayOpen];\n\nexport const leftSideLabel = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label\n side-aligned=\"start\"\n for=\"picker-1\"\n size=${ifDefined(args.size)}\n >\n Where do you live?\n </sp-field-label>\n <sp-picker\n id=\"picker-1\"\n @change=${handleChange(args)}\n label=\"Select a Country with a very long label, too long, in fact\"\n ${spreadProps(args)}\n >\n <sp-menu-item value=\"option-1\">Deselect</sp-menu-item>\n <sp-menu-item value=\"option-2\">Select Inverse</sp-menu-item>\n <sp-menu-item value=\"option-3\">Feather...</sp-menu-item>\n <sp-menu-item value=\"option-4\">Select and Mask...</sp-menu-item>\n <sp-menu-item value=\"option-5\">Save Selection</sp-menu-item>\n <sp-menu-item disabled value=\"option-6\">\n Make Work Path\n </sp-menu-item>\n </sp-picker>\n <p>This is some text.</p>\n <p>This is some text.</p>\n <p>\n This is a\n <a href=\"#anchor\">link</a>\n .\n </p>\n `;\n};\n\nexport const noVisibleLabel = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-picker\n @change=${handleChange(args)}\n label=\"Where do you live?\"\n ${spreadProps(args)}\n >\n <sp-menu-item value=\"option-1\">Deselect</sp-menu-item>\n <sp-menu-item value=\"option-2\">Select Inverse</sp-menu-item>\n <sp-menu-item value=\"option-3\">Feather...</sp-menu-item>\n <sp-menu-item value=\"option-4\">Select and Mask...</sp-menu-item>\n <sp-menu-item value=\"option-5\">Save Selection</sp-menu-item>\n <sp-menu-item disabled value=\"option-6\">\n Make Work Path\n </sp-menu-item>\n </sp-picker>\n <p>This is some text.</p>\n <p>This is some text.</p>\n <p>\n This is a\n <a href=\"#anchor\">link</a>\n .\n </p>\n `;\n};\n\nexport const slottedLabel = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-picker @change=${handleChange(args)} ${spreadProps(args)}>\n <span slot=\"label\">Where do you live?</span>\n <sp-menu-item value=\"option-1\">Deselect</sp-menu-item>\n <sp-menu-item value=\"option-2\">Select Inverse</sp-menu-item>\n <sp-menu-item value=\"option-3\">Feather...</sp-menu-item>\n <sp-menu-item value=\"option-4\">Select and Mask...</sp-menu-item>\n <sp-menu-item value=\"option-5\">Save Selection</sp-menu-item>\n <sp-menu-item disabled value=\"option-6\">\n Make Work Path\n </sp-menu-item>\n </sp-picker>\n <p>This is some text.</p>\n <p>This is some text.</p>\n <p>\n This is a\n <a href=\"#anchor\">link</a>\n .\n </p>\n `;\n};\n\nexport const quiet = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"picker-quiet\" size=${ifDefined(args.size)}>\n Where do you live?\n </sp-field-label>\n <sp-picker\n ${spreadProps(args)}\n id=\"picker-quiet\"\n @change=${handleChange(args)}\n label=\"Pick an item\"\n >\n <sp-menu-item value=\"1\">Item 1</sp-menu-item>\n <sp-menu-item value=\"2\">Item 2</sp-menu-item>\n <sp-menu-item value=\"3\">Item 3</sp-menu-item>\n <sp-menu-item value=\"4\">Item 4</sp-menu-item>\n </sp-picker>\n <p>This is some text.</p>\n <p>This is some text.</p>\n <p>\n This is a\n <a href=\"#anchor\">link</a>\n .\n </p>\n `;\n};\nquiet.args = {\n quiet: true,\n};\n\nexport const quietSideLabel = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label\n side-aligned=\"start\"\n for=\"picker-quiet-sidelabel\"\n size=${ifDefined(args.size)}\n >\n Where do you live?\n </sp-field-label>\n <sp-picker\n ${spreadProps(args)}\n id=\"picker-quiet-sidelabel\"\n @change=${handleChange(args)}\n label=\"Pick an item\"\n >\n <sp-menu-item value=\"1\">Item 1</sp-menu-item>\n <sp-menu-item value=\"2\">Item 2</sp-menu-item>\n <sp-menu-item value=\"3\">Item 3</sp-menu-item>\n <sp-menu-item value=\"4\">Item 4</sp-menu-item>\n </sp-picker>\n <p>This is some text.</p>\n <p>This is some text.</p>\n <p>\n This is a\n <a href=\"#anchor\">link</a>\n .\n </p>\n `;\n};\nquietSideLabel.args = {\n quiet: true,\n};\n\nexport const icons = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"picker-quiet\" size=${ifDefined(args.size)}>\n Choose an action type...\n </sp-field-label>\n <sp-picker\n ${spreadProps(args)}\n id=\"picker-quiet\"\n @change=${handleChange(args)}\n label=\"Pick an action\"\n value=\"1\"\n >\n <sp-menu-item value=\"1\">\n <sp-icon-edit slot=\"icon\"></sp-icon-edit>\n Edit\n </sp-menu-item>\n <sp-menu-item value=\"2\">\n <sp-icon-copy slot=\"icon\"></sp-icon-copy>\n Copy\n </sp-menu-item>\n <sp-menu-item value=\"3\">\n <sp-icon-delete slot=\"icon\"></sp-icon-delete>\n Delete\n </sp-menu-item>\n </sp-picker>\n `;\n};\n\nexport const iconsNone = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"picker-quiet\" size=${ifDefined(args.size)}>\n Choose an action type...\n </sp-field-label>\n <sp-picker\n ${spreadProps(args)}\n id=\"picker-quiet\"\n @change=${handleChange(args)}\n label=\"Pick an action\"\n value=\"1\"\n icons=\"none\"\n >\n <sp-menu-item value=\"1\">\n <sp-icon-edit slot=\"icon\"></sp-icon-edit>\n Edit\n </sp-menu-item>\n <sp-menu-item value=\"2\">\n <sp-icon-copy slot=\"icon\"></sp-icon-copy>\n Copy\n </sp-menu-item>\n <sp-menu-item value=\"3\">\n <sp-icon-delete slot=\"icon\"></sp-icon-delete>\n Delete\n </sp-menu-item>\n </sp-picker>\n `;\n};\niconsNone.args = {\n open: true,\n};\niconsNone.decorators = [isOverlayOpen];\n\nexport const iconValue = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"picker-quiet\" size=${ifDefined(args.size)}>\n Choose an action type...\n </sp-field-label>\n <sp-picker\n ${spreadProps(args)}\n id=\"picker-quiet\"\n @change=${handleChange(args)}\n label=\"Pick an action\"\n icons=\"only\"\n style=\"width: 100px\"\n value=\"2\"\n >\n <sp-menu-item value=\"1\">\n <sp-icon-edit slot=\"icon\"></sp-icon-edit>\n Edit\n </sp-menu-item>\n <sp-menu-item value=\"2\">\n <sp-icon-copy slot=\"icon\"></sp-icon-copy>\n Copy\n </sp-menu-item>\n <sp-menu-item value=\"3\">\n <sp-icon-delete slot=\"icon\"></sp-icon-delete>\n Delete\n </sp-menu-item>\n </sp-picker>\n `;\n};\n\nexport const iconsOnly = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"picker-quiet\" size=${ifDefined(args.size)}>\n Choose an action type...\n </sp-field-label>\n <sp-picker\n ${spreadProps(args)}\n id=\"picker-quiet\"\n @change=${handleChange(args)}\n label=\"Pick an action\"\n style=\"width: 100px\"\n value=\"3\"\n >\n <sp-menu-item value=\"1\">\n <sp-icon-edit slot=\"icon\" label=\"Edit\"></sp-icon-edit>\n </sp-menu-item>\n <sp-menu-item value=\"2\">\n <sp-icon-copy slot=\"icon\" label=\"Copy\"></sp-icon-copy>\n </sp-menu-item>\n <sp-menu-item value=\"3\">\n <sp-icon-delete slot=\"icon\" label=\"Delete\"></sp-icon-delete>\n </sp-menu-item>\n </sp-picker>\n `;\n};\niconsOnly.args = {\n open: true,\n};\niconsOnly.decorators = [isOverlayOpen];\n\nexport const Open = (args: StoryArgs): TemplateResult => {\n return html`\n <style>\n fieldset {\n float: left;\n clear: left;\n margin-bottom: 15px;\n }\n </style>\n <fieldset class=\"backdrop-filter-test\">\n <sp-field-label for=\"picker-open\" size=${ifDefined(args.size)}>\n Where do you live?\n </sp-field-label>\n <sp-picker\n id=\"picker-open\"\n label=\"Open picker\"\n ${spreadProps(args)}\n @change=${handleChange(args)}\n >\n <span slot=\"label\">\n Select a Country with a very long label, too long, in fact\n </span>\n <sp-menu-item>Deselect</sp-menu-item>\n <sp-menu-item>Select Inverse</sp-menu-item>\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and Mask...</sp-menu-item>\n <sp-menu-item>Save Selection</sp-menu-item>\n <sp-menu-item disabled>Make Work Path</sp-menu-item>\n </sp-picker>\n </fieldset>\n <fieldset>\n <sp-field-label for=\"picker-closed\" size=${ifDefined(args.size)}>\n Where do you live?\n </sp-field-label>\n <sp-picker\n id=\"picker-closed\"\n label=\"Picker that displays below the options\"\n @change=${handleChange(args)}\n >\n <span slot=\"label\">\n Other menu that goes behind the open one\n </span>\n <sp-menu-item>Not so many options...</sp-menu-item>\n </sp-picker>\n </fieldset>\n `;\n};\nOpen.args = {\n open: true,\n};\nOpen.decorators = [isOverlayOpen];\n\nexport const OpenShowingEdgeCase = (args: StoryArgs): TemplateResult => {\n return html`\n <style>\n fieldset {\n float: left;\n clear: left;\n margin-bottom: 15px;\n }\n /* Enforce CSS stacking to test \"transition-behavior: allow-discrete\" */\n /* Breaks the story in non-[popover] supporting browsers */\n fieldset:nth-of-type(2) {\n position: relative;\n z-index: 2;\n }\n .backdrop-filter-test {\n backdrop-filter: saturate(80%);\n }\n </style>\n <p>\n In browser that do not support\n <code>[popover]</code>\n , the following \"open\"\n <code>sp-picker</code>\n will display behind both the closed\n <code>sp-picker</code>\n as well as the\n <code>fieldset</code>\n that contains it.\n </p>\n <p>\n Learn more about this situation in our\n <sp-link\n href=\"https://opensource.adobe.com/spectrum-web-components/components/overlay/#fallback-support\"\n >\n documentation site\n </sp-link>\n .\n </p>\n <fieldset class=\"backdrop-filter-test\">\n <sp-field-label for=\"picker-open\" size=${ifDefined(args.size)}>\n Where do you live?\n </sp-field-label>\n <sp-picker\n id=\"picker-open\"\n label=\"Open picker\"\n ${spreadProps(args)}\n @change=${handleChange(args)}\n >\n <span slot=\"label\">\n Select a Country with a very long label, too long, in fact\n </span>\n <sp-menu-item>Deselect</sp-menu-item>\n <sp-menu-item>Select Inverse</sp-menu-item>\n <sp-menu-item>Feather...</sp-menu-item>\n <sp-menu-item>Select and Mask...</sp-menu-item>\n <sp-menu-item>Save Selection</sp-menu-item>\n <sp-menu-item disabled>Make Work Path</sp-menu-item>\n </sp-picker>\n </fieldset>\n <fieldset>\n <sp-field-label for=\"picker-closed\" size=${ifDefined(args.size)}>\n Where do you live?\n </sp-field-label>\n <sp-picker\n id=\"picker-closed\"\n label=\"Picker that displays below the options\"\n @change=${handleChange(args)}\n >\n <span slot=\"label\">\n Other menu that goes behind the open one\n </span>\n <sp-menu-item>Not so many options...</sp-menu-item>\n </sp-picker>\n </fieldset>\n `;\n};\nOpenShowingEdgeCase.args = {\n open: true,\n};\nOpenShowingEdgeCase.decorators = [isOverlayOpen];\nOpenShowingEdgeCase.swc_vrt = {\n skip: true,\n};\n\nexport const initialValue = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-field-label for=\"picker-initial\" size=${ifDefined(args.size)}>\n Where do you live?\n </sp-field-label>\n <sp-picker\n id=\"picker-initial\"\n @change=${handleChange(args)}\n value=\"item-2\"\n ${spreadProps(args)}\n >\n <span slot=\"label\">\n Select a Country with a very long label, too long in fact\n </span>\n <sp-menu-item value=\"item-1\">Deselect</sp-menu-item>\n <sp-menu-item value=\"item-2\">Select Inverse</sp-menu-item>\n <sp-menu-item value=\"item-3\">Feather...</sp-menu-item>\n <sp-menu-item value=\"item-4\">Select and Mask...</sp-menu-item>\n <sp-menu-item value=\"item-5\">Save Selection</sp-menu-item>\n <sp-menu-item disabled value=\"item-6\">Make Work Path</sp-menu-item>\n </sp-picker>\n `;\n};\n\nexport const readonly = (args: StoryArgs): TemplateResult => {\n return html`\n <sp-picker\n @change=${handleChange(args)}\n readonly\n value=\"item-2\"\n ${spreadProps(args)}\n >\n <span slot=\"label\">\n Select a Country with a very long label, too long in fact\n </span>\n <sp-menu-item value=\"item-1\">Deselect</sp-menu-item>\n <sp-menu-item value=\"item-2\">Select Inverse</sp-menu-item>\n <sp-menu-item value=\"item-3\">Feather...</sp-menu-item>\n <sp-menu-item value=\"item-4\">Select and Mask...</sp-menu-item>\n <sp-menu-item value=\"item-5\">Save Selection</sp-menu-item>\n <sp-menu-item disabled value=\"item-6\">Make Work Path</sp-menu-item>\n </sp-picker>\n `;\n};\n\nexport const custom = (args: StoryArgs): TemplateResult => {\n const initialState = 'lb1-mo';\n return html`\n <sp-field-label for=\"picker-state\" size=${ifDefined(args.size)}>\n What state do you live in?\n </sp-field-label>\n <sp-picker\n style=\"width: 400px;\"\n @change=${handleChange(args)}\n id=\"picker-state\"\n label=\"Pick a state\"\n ${spreadProps(args)}\n value=${initialState}\n >\n ${states.map(\n (state) => html`\n <sp-menu-item\n id=${state.id}\n value=${state.id}\n ?selected=${state.id === initialState}\n >\n ${state.label}\n </sp-menu-item>\n `\n )}\n </sp-picker>\n <p>This is some text.</p>\n <p>This is some text.</p>\n <p>\n This is a\n <a href=\"#anchor\">link</a>\n .\n </p>\n `;\n};\ncustom.args = {\n open: true,\n};\ncustom.decorators = [isOverlayOpen];\n"],
5
- "mappings": "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",
6
- "names": []
7
- }