@getflip/swirl-ai 0.527.0 → 0.529.0
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/agent/components/swirl-icon-tab-move.md +50 -0
- package/dist/agent/components/swirl-popover-trigger.md +9 -2
- package/dist/agent/components/swirl-popover.md +5 -0
- package/dist/agent/components-index.json +4 -0
- package/dist/custom-elements.manifest.json +147 -6
- package/dist/types/components/swirl-file-viewer/viewers/swirl-file-viewer-pdf/swirl-file-viewer-pdf.d.ts +1 -0
- package/dist/types/components/swirl-icon/icons/swirl-icon-tab-move.d.ts +8 -0
- package/dist/types/components/swirl-modal/swirl-modal.d.ts +1 -0
- package/dist/types/components/swirl-popover/swirl-popover.d.ts +1 -1
- package/dist/types/components/swirl-popover-trigger/swirl-popover-trigger.d.ts +20 -2
- package/dist/types/components/swirl-popover-trigger/swirl-popover-trigger.stories.d.ts +13 -0
- package/dist/types/components.d.ts +39 -0
- package/package.json +2 -2
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
# `<swirl-icon-tab-move>`
|
|
2
|
+
|
|
3
|
+
## Purpose
|
|
4
|
+
|
|
5
|
+
Custom element: swirl-icon-tab-move.
|
|
6
|
+
|
|
7
|
+
## Required props
|
|
8
|
+
|
|
9
|
+
_None._
|
|
10
|
+
|
|
11
|
+
## Optional props
|
|
12
|
+
|
|
13
|
+
- `color` ("critical" | "default" | "disabled" | "highlight" | "info" | "on-action-primary" | "on-image" | "on-status" | "on-surface-highlight" | "on-surface-highlight-subdued" | "strong" | "success" | "warning" | undefined) –
|
|
14
|
+
- `label` (string | undefined) –
|
|
15
|
+
- `size` (16 | 20 | 24 | 28 | undefined) –
|
|
16
|
+
|
|
17
|
+
## Slots
|
|
18
|
+
|
|
19
|
+
_None._
|
|
20
|
+
|
|
21
|
+
## Events
|
|
22
|
+
|
|
23
|
+
_None._
|
|
24
|
+
|
|
25
|
+
## Methods
|
|
26
|
+
|
|
27
|
+
_None._
|
|
28
|
+
|
|
29
|
+
## Related components
|
|
30
|
+
|
|
31
|
+
_See description for usage context._
|
|
32
|
+
|
|
33
|
+
## Accessibility
|
|
34
|
+
|
|
35
|
+
_See full docs for accessibility details._
|
|
36
|
+
|
|
37
|
+
## Minimal example
|
|
38
|
+
|
|
39
|
+
```html
|
|
40
|
+
<swirl-icon-tab-move></swirl-icon-tab-move>
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
## Usage example
|
|
44
|
+
|
|
45
|
+
_No usage example in docs._
|
|
46
|
+
|
|
47
|
+
## Common mistakes
|
|
48
|
+
|
|
49
|
+
- Ensure required props are set.
|
|
50
|
+
- Use only allowed slot names and child components where documented.
|
|
@@ -14,6 +14,7 @@ The SwirlPopoverTrigger component is used to position and open a referenced [Swi
|
|
|
14
14
|
- `hoverDelay` (number | undefined) –
|
|
15
15
|
- `hoverLingerDuration` (number | undefined) –
|
|
16
16
|
- `setAriaAttributes` (boolean | undefined) –
|
|
17
|
+
- `trigger` (SwirlPopoverTriggerMethod[] | string | undefined) –
|
|
17
18
|
- `triggerOnClick` (boolean | undefined) –
|
|
18
19
|
- `triggerOnHover` (boolean | undefined) –
|
|
19
20
|
- `parentScrollContainer` (HTMLElement | undefined) –
|
|
@@ -48,8 +49,14 @@ _None._
|
|
|
48
49
|
|
|
49
50
|
### Keyboard
|
|
50
51
|
|
|
51
|
-
|
|
52
|
-
|
|
52
|
+
| Key | Function |
|
|
53
|
+
| --------------------------- | ---------------------------------------------------------------------------- |
|
|
54
|
+
| <kbd>Tab</kbd> | Moves focus to the trigger, opening the popover when `"focus"` is active. |
|
|
55
|
+
| <kbd>Escape</kbd> | Closes the popover while the trigger has focus. |
|
|
56
|
+
| <kbd>Enter</kbd>/<kbd>Space</kbd> | Toggles the popover when `"click"` is active (native button behavior). |
|
|
57
|
+
|
|
58
|
+
Further keyboard behavior (moving focus within the popover, closing on
|
|
59
|
+
outside click) is defined by the associated SwirlPopover.
|
|
53
60
|
|
|
54
61
|
## Minimal example
|
|
55
62
|
|
|
@@ -79,6 +79,11 @@ The SwirlPopover component is used to display small non-modal dialogs or menus.
|
|
|
79
79
|
- After closing, the focus is returned to the trigger.
|
|
80
80
|
- Moving focus outside the popover closes it.
|
|
81
81
|
|
|
82
|
+
⚠️ **Hover/focus-triggered popovers behave differently:** when opened via
|
|
83
|
+
[swirl-popover-trigger](?path=/docs/components-swirlpopovertrigger--docs)'s
|
|
84
|
+
`"hover"` or `"focus"` trigger, focus is never moved into the popover content,
|
|
85
|
+
and focus is never returned to the trigger on close.
|
|
86
|
+
|
|
82
87
|
## Minimal example
|
|
83
88
|
|
|
84
89
|
```html
|
|
@@ -38362,6 +38362,117 @@
|
|
|
38362
38362
|
}
|
|
38363
38363
|
]
|
|
38364
38364
|
},
|
|
38365
|
+
{
|
|
38366
|
+
"kind": "javascript-module",
|
|
38367
|
+
"path": "src/components/swirl-icon/icons/swirl-icon-tab-move.tsx",
|
|
38368
|
+
"declarations": [
|
|
38369
|
+
{
|
|
38370
|
+
"kind": "class",
|
|
38371
|
+
"customElement": true,
|
|
38372
|
+
"tagName": "swirl-icon-tab-move",
|
|
38373
|
+
"name": "SwirlIconTabMove",
|
|
38374
|
+
"attributes": [
|
|
38375
|
+
{
|
|
38376
|
+
"name": "color",
|
|
38377
|
+
"type": {
|
|
38378
|
+
"text": "\"critical\" | \"default\" | \"disabled\" | \"highlight\" | \"info\" | \"on-action-primary\" | \"on-image\" | \"on-status\" | \"on-surface-highlight\" | \"on-surface-highlight-subdued\" | \"strong\" | \"success\" | \"warning\" | undefined",
|
|
38379
|
+
"references": [
|
|
38380
|
+
{
|
|
38381
|
+
"name": "SwirlIconColor",
|
|
38382
|
+
"module": "../swirl-icon"
|
|
38383
|
+
}
|
|
38384
|
+
]
|
|
38385
|
+
},
|
|
38386
|
+
"fieldName": "color"
|
|
38387
|
+
},
|
|
38388
|
+
{
|
|
38389
|
+
"name": "label",
|
|
38390
|
+
"type": {
|
|
38391
|
+
"text": "string | undefined"
|
|
38392
|
+
},
|
|
38393
|
+
"fieldName": "label"
|
|
38394
|
+
},
|
|
38395
|
+
{
|
|
38396
|
+
"name": "size",
|
|
38397
|
+
"type": {
|
|
38398
|
+
"text": "16 | 20 | 24 | 28 | undefined",
|
|
38399
|
+
"references": [
|
|
38400
|
+
{
|
|
38401
|
+
"name": "SwirlIconSize",
|
|
38402
|
+
"module": "../swirl-icon.types"
|
|
38403
|
+
}
|
|
38404
|
+
]
|
|
38405
|
+
},
|
|
38406
|
+
"default": "24",
|
|
38407
|
+
"fieldName": "size"
|
|
38408
|
+
}
|
|
38409
|
+
],
|
|
38410
|
+
"members": [
|
|
38411
|
+
{
|
|
38412
|
+
"kind": "field",
|
|
38413
|
+
"name": "color",
|
|
38414
|
+
"type": {
|
|
38415
|
+
"text": "\"critical\" | \"default\" | \"disabled\" | \"highlight\" | \"info\" | \"on-action-primary\" | \"on-image\" | \"on-status\" | \"on-surface-highlight\" | \"on-surface-highlight-subdued\" | \"strong\" | \"success\" | \"warning\" | undefined",
|
|
38416
|
+
"references": [
|
|
38417
|
+
{
|
|
38418
|
+
"name": "SwirlIconColor",
|
|
38419
|
+
"module": "../swirl-icon"
|
|
38420
|
+
}
|
|
38421
|
+
]
|
|
38422
|
+
},
|
|
38423
|
+
"readonly": true,
|
|
38424
|
+
"attribute": "color"
|
|
38425
|
+
},
|
|
38426
|
+
{
|
|
38427
|
+
"kind": "field",
|
|
38428
|
+
"name": "label",
|
|
38429
|
+
"type": {
|
|
38430
|
+
"text": "string | undefined"
|
|
38431
|
+
},
|
|
38432
|
+
"readonly": true,
|
|
38433
|
+
"attribute": "label"
|
|
38434
|
+
},
|
|
38435
|
+
{
|
|
38436
|
+
"kind": "field",
|
|
38437
|
+
"name": "size",
|
|
38438
|
+
"type": {
|
|
38439
|
+
"text": "16 | 20 | 24 | 28 | undefined",
|
|
38440
|
+
"references": [
|
|
38441
|
+
{
|
|
38442
|
+
"name": "SwirlIconSize",
|
|
38443
|
+
"module": "../swirl-icon.types"
|
|
38444
|
+
}
|
|
38445
|
+
]
|
|
38446
|
+
},
|
|
38447
|
+
"default": "24",
|
|
38448
|
+
"readonly": true,
|
|
38449
|
+
"attribute": "size"
|
|
38450
|
+
}
|
|
38451
|
+
],
|
|
38452
|
+
"cssParts": [
|
|
38453
|
+
{
|
|
38454
|
+
"name": "icon"
|
|
38455
|
+
}
|
|
38456
|
+
]
|
|
38457
|
+
}
|
|
38458
|
+
],
|
|
38459
|
+
"exports": [
|
|
38460
|
+
{
|
|
38461
|
+
"kind": "js",
|
|
38462
|
+
"name": "SwirlIconTabMove",
|
|
38463
|
+
"declaration": {
|
|
38464
|
+
"name": "SwirlIconTabMove"
|
|
38465
|
+
}
|
|
38466
|
+
},
|
|
38467
|
+
{
|
|
38468
|
+
"kind": "custom-element-definition",
|
|
38469
|
+
"name": "swirl-icon-tab-move",
|
|
38470
|
+
"declaration": {
|
|
38471
|
+
"name": "SwirlIconTabMove"
|
|
38472
|
+
}
|
|
38473
|
+
}
|
|
38474
|
+
]
|
|
38475
|
+
},
|
|
38365
38476
|
{
|
|
38366
38477
|
"kind": "javascript-module",
|
|
38367
38478
|
"path": "src/components/swirl-icon/icons/swirl-icon-tasks.tsx",
|
|
@@ -48200,7 +48311,7 @@
|
|
|
48200
48311
|
{
|
|
48201
48312
|
"name": "via",
|
|
48202
48313
|
"type": {
|
|
48203
|
-
"text": "\"click\" | \"hover\" | \"programmatic\"",
|
|
48314
|
+
"text": "\"click\" | \"focus\" | \"hover\" | \"programmatic\"",
|
|
48204
48315
|
"references": [
|
|
48205
48316
|
{
|
|
48206
48317
|
"name": "Promise",
|
|
@@ -48263,7 +48374,7 @@
|
|
|
48263
48374
|
{
|
|
48264
48375
|
"name": "via",
|
|
48265
48376
|
"type": {
|
|
48266
|
-
"text": "\"click\" | \"hover\" | \"programmatic\"",
|
|
48377
|
+
"text": "\"click\" | \"focus\" | \"hover\" | \"programmatic\"",
|
|
48267
48378
|
"references": [
|
|
48268
48379
|
{
|
|
48269
48380
|
"name": "Promise",
|
|
@@ -48334,7 +48445,7 @@
|
|
|
48334
48445
|
"name": "popover__scroll-container"
|
|
48335
48446
|
}
|
|
48336
48447
|
],
|
|
48337
|
-
"description": "The SwirlPopover component is used to display small non-modal dialogs or menus.\n\nAccessibility\n\n### ARIA\n\n| ARIA | Usage |\n| --------------- | ------------------------------------------------------- |\n| `role=\"dialog\"` | The popover content has `role` set to `dialog`. |\n| `aria-label` | Describes the popover content. |\n| `aria-controls` | Associates the popover and its trigger. |\n| `aria-expanded` | Used on the trigger to convey the state of the popover. |\n| `aria-haspopup` | Set on the trigger to denote that it opens a popover. |\n\n### Keyboard\n\n| Key | Action |\n| ---------------- | -------------------------------------------- |\n| <kbd>ENTER</kbd> | Activates the trigger and opens the popover. |\n| <kbd>SPACE</kbd> | Activates the trigger and opens the popover. |\n| <kbd>ESC</kbd> | Closes the popover. |\n\n### Focus handling\n\n- Focus is moved to the popover content when opened.\n- After closing, the focus is returned to the trigger.\n- Moving focus outside the popover closes it."
|
|
48448
|
+
"description": "The SwirlPopover component is used to display small non-modal dialogs or menus.\n\nAccessibility\n\n### ARIA\n\n| ARIA | Usage |\n| --------------- | ------------------------------------------------------- |\n| `role=\"dialog\"` | The popover content has `role` set to `dialog`. |\n| `aria-label` | Describes the popover content. |\n| `aria-controls` | Associates the popover and its trigger. |\n| `aria-expanded` | Used on the trigger to convey the state of the popover. |\n| `aria-haspopup` | Set on the trigger to denote that it opens a popover. |\n\n### Keyboard\n\n| Key | Action |\n| ---------------- | -------------------------------------------- |\n| <kbd>ENTER</kbd> | Activates the trigger and opens the popover. |\n| <kbd>SPACE</kbd> | Activates the trigger and opens the popover. |\n| <kbd>ESC</kbd> | Closes the popover. |\n\n### Focus handling\n\n- Focus is moved to the popover content when opened.\n- After closing, the focus is returned to the trigger.\n- Moving focus outside the popover closes it.\n\n⚠️ **Hover/focus-triggered popovers behave differently:** when opened via\n[swirl-popover-trigger](?path=/docs/components-swirlpopovertrigger--docs)'s\n`\"hover\"` or `\"focus\"` trigger, focus is never moved into the popover content,\nand focus is never returned to the trigger on close."
|
|
48338
48449
|
}
|
|
48339
48450
|
],
|
|
48340
48451
|
"exports": [
|
|
@@ -48411,13 +48522,26 @@
|
|
|
48411
48522
|
},
|
|
48412
48523
|
"fieldName": "swirlPopover"
|
|
48413
48524
|
},
|
|
48525
|
+
{
|
|
48526
|
+
"name": "trigger",
|
|
48527
|
+
"type": {
|
|
48528
|
+
"text": "SwirlPopoverTriggerMethod[] | string | undefined",
|
|
48529
|
+
"references": [
|
|
48530
|
+
{
|
|
48531
|
+
"name": "SwirlPopoverTriggerMethod"
|
|
48532
|
+
}
|
|
48533
|
+
]
|
|
48534
|
+
},
|
|
48535
|
+
"fieldName": "trigger"
|
|
48536
|
+
},
|
|
48414
48537
|
{
|
|
48415
48538
|
"name": "trigger-on-click",
|
|
48416
48539
|
"type": {
|
|
48417
48540
|
"text": "boolean | undefined"
|
|
48418
48541
|
},
|
|
48419
48542
|
"default": "true",
|
|
48420
|
-
"fieldName": "triggerOnClick"
|
|
48543
|
+
"fieldName": "triggerOnClick",
|
|
48544
|
+
"deprecated": "Please use the \"trigger\" prop instead, e.g. trigger=\"click\"."
|
|
48421
48545
|
},
|
|
48422
48546
|
{
|
|
48423
48547
|
"name": "trigger-on-hover",
|
|
@@ -48425,7 +48549,8 @@
|
|
|
48425
48549
|
"text": "boolean | undefined"
|
|
48426
48550
|
},
|
|
48427
48551
|
"default": "false",
|
|
48428
|
-
"fieldName": "triggerOnHover"
|
|
48552
|
+
"fieldName": "triggerOnHover",
|
|
48553
|
+
"deprecated": "Please use the \"trigger\" prop instead, e.g. trigger=\"hover focus\"."
|
|
48429
48554
|
}
|
|
48430
48555
|
],
|
|
48431
48556
|
"members": [
|
|
@@ -48500,6 +48625,20 @@
|
|
|
48500
48625
|
"readonly": true,
|
|
48501
48626
|
"attribute": "swirl-popover"
|
|
48502
48627
|
},
|
|
48628
|
+
{
|
|
48629
|
+
"kind": "field",
|
|
48630
|
+
"name": "trigger",
|
|
48631
|
+
"type": {
|
|
48632
|
+
"text": "SwirlPopoverTriggerMethod[] | string | undefined",
|
|
48633
|
+
"references": [
|
|
48634
|
+
{
|
|
48635
|
+
"name": "SwirlPopoverTriggerMethod"
|
|
48636
|
+
}
|
|
48637
|
+
]
|
|
48638
|
+
},
|
|
48639
|
+
"readonly": true,
|
|
48640
|
+
"attribute": "trigger"
|
|
48641
|
+
},
|
|
48503
48642
|
{
|
|
48504
48643
|
"kind": "field",
|
|
48505
48644
|
"name": "triggerOnClick",
|
|
@@ -48507,6 +48646,7 @@
|
|
|
48507
48646
|
"text": "boolean | undefined"
|
|
48508
48647
|
},
|
|
48509
48648
|
"default": "true",
|
|
48649
|
+
"deprecated": "Please use the \"trigger\" prop instead, e.g. trigger=\"click\".",
|
|
48510
48650
|
"readonly": true,
|
|
48511
48651
|
"attribute": "trigger-on-click"
|
|
48512
48652
|
},
|
|
@@ -48517,6 +48657,7 @@
|
|
|
48517
48657
|
"text": "boolean | undefined"
|
|
48518
48658
|
},
|
|
48519
48659
|
"default": "false",
|
|
48660
|
+
"deprecated": "Please use the \"trigger\" prop instead, e.g. trigger=\"hover focus\".",
|
|
48520
48661
|
"readonly": true,
|
|
48521
48662
|
"attribute": "trigger-on-hover"
|
|
48522
48663
|
}
|
|
@@ -48527,7 +48668,7 @@
|
|
|
48527
48668
|
"description": "The trigger element (e.g. a button) that opens the popover."
|
|
48528
48669
|
}
|
|
48529
48670
|
],
|
|
48530
|
-
"description": "The SwirlPopoverTrigger component is used to position and open a referenced [SwirlPopover component](?path=/docs/components-swirlpopover--docs).\n\nAccessibility\n\n### ARIA\n\n| ARIA | Usage |\n| --------------- | -------------------------------------------------------------------- |\n| `aria-controls` | Set on the wrapped trigger element, referencing the popover element. |\n| `aria-expanded` | Set on the wrapped trigger element. |\n| `aria-haspopup` | Set to \"dialog\" on the wrapped trigger element. |\n\n### Keyboard\n\
|
|
48671
|
+
"description": "The SwirlPopoverTrigger component is used to position and open a referenced [SwirlPopover component](?path=/docs/components-swirlpopover--docs).\n\nAccessibility\n\n### ARIA\n\n| ARIA | Usage |\n| --------------- | -------------------------------------------------------------------- |\n| `aria-controls` | Set on the wrapped trigger element, referencing the popover element. |\n| `aria-expanded` | Set on the wrapped trigger element. |\n| `aria-haspopup` | Set to \"dialog\" on the wrapped trigger element. |\n\n### Keyboard\n\n| Key | Function |\n| --------------------------- | ---------------------------------------------------------------------------- |\n| <kbd>Tab</kbd> | Moves focus to the trigger, opening the popover when `\"focus\"` is active. |\n| <kbd>Escape</kbd> | Closes the popover while the trigger has focus. |\n| <kbd>Enter</kbd>/<kbd>Space</kbd> | Toggles the popover when `\"click\"` is active (native button behavior). |\n\nFurther keyboard behavior (moving focus within the popover, closing on\noutside click) is defined by the associated SwirlPopover."
|
|
48531
48672
|
}
|
|
48532
48673
|
],
|
|
48533
48674
|
"exports": [
|
|
@@ -112,6 +112,7 @@ export declare class SwirlModal {
|
|
|
112
112
|
private determineMainScrollStatus;
|
|
113
113
|
private determineSidebarScrollStatus;
|
|
114
114
|
private handleAutoFocus;
|
|
115
|
+
private focusIsInsideContent;
|
|
115
116
|
private lockBodyScroll;
|
|
116
117
|
private setupMutationObserver;
|
|
117
118
|
private unlockBodyScroll;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { ComputePositionReturn, Placement } from "@floating-ui/dom";
|
|
2
2
|
import { EventEmitter } from "../../stencil-public-runtime";
|
|
3
3
|
export type SwirlPopoverAnimation = "fade-in" | "scale-in-xy" | "scale-in-y";
|
|
4
|
-
export type SwirlPopoverControlMethod = "click" | "hover" | "programmatic";
|
|
4
|
+
export type SwirlPopoverControlMethod = "click" | "hover" | "focus" | "programmatic";
|
|
5
5
|
declare const swirlPopoverBorderRadiusTokens: readonly ["xs", "sm", "base", "l", "xl"];
|
|
6
6
|
export type SwirlPopoverBorderRadius = (typeof swirlPopoverBorderRadiusTokens)[number] | string;
|
|
7
7
|
/** Mirrors {@link https://floating-ui.com/docs/flip#fallbackaxissidedirection Floating UI `flip`}. */
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { SwirlPopover } from "../swirl-popover/swirl-popover";
|
|
2
|
+
export type SwirlPopoverTriggerMethod = "click" | "hover" | "focus";
|
|
2
3
|
/**
|
|
3
4
|
* @slot slot - The trigger element (e.g. a button) that opens the popover.
|
|
4
5
|
*/
|
|
@@ -8,7 +9,10 @@ export declare class SwirlPopoverTrigger {
|
|
|
8
9
|
parentScrollContainer?: HTMLElement;
|
|
9
10
|
setAriaAttributes?: boolean;
|
|
10
11
|
swirlPopover: string | HTMLSwirlPopoverElement | SwirlPopover;
|
|
12
|
+
trigger?: SwirlPopoverTriggerMethod[] | string;
|
|
13
|
+
/** @deprecated Please use the "trigger" prop instead, e.g. trigger="click". */
|
|
11
14
|
triggerOnClick?: boolean;
|
|
15
|
+
/** @deprecated Please use the "trigger" prop instead, e.g. trigger="hover focus". */
|
|
12
16
|
triggerOnHover?: boolean;
|
|
13
17
|
hoverLingerDuration?: number;
|
|
14
18
|
hoverDelay?: number;
|
|
@@ -18,11 +22,15 @@ export declare class SwirlPopoverTrigger {
|
|
|
18
22
|
private hoverDelayReference?;
|
|
19
23
|
private popoverElRef?;
|
|
20
24
|
private triggerIsActive;
|
|
25
|
+
private triggerMethods;
|
|
21
26
|
connectedCallback(): void;
|
|
27
|
+
componentWillLoad(): void;
|
|
22
28
|
componentDidLoad(): void;
|
|
23
29
|
disconnectedCallback(): void;
|
|
24
30
|
watchPopover(): void;
|
|
25
|
-
|
|
31
|
+
watchTrigger(): void;
|
|
32
|
+
private warnAboutDeprecatedProps;
|
|
33
|
+
private resolveTriggerMethods;
|
|
26
34
|
private getPopoverEl;
|
|
27
35
|
private getTriggerEl;
|
|
28
36
|
private setupIntersectionObserver;
|
|
@@ -32,13 +40,23 @@ export declare class SwirlPopoverTrigger {
|
|
|
32
40
|
popoverMouseEnter: () => void;
|
|
33
41
|
popoverMouseLeave: () => void;
|
|
34
42
|
private onMouseenter;
|
|
35
|
-
private mouseenterHandler;
|
|
36
43
|
private onMouseleave;
|
|
37
44
|
private mouseleaveHandler;
|
|
38
45
|
private startHoverLingerTimer;
|
|
39
46
|
private stopHoverLingerTimer;
|
|
40
47
|
private onClick;
|
|
48
|
+
private onFocusin;
|
|
49
|
+
private onFocusout;
|
|
50
|
+
private onKeyDown;
|
|
51
|
+
private focusStaysWithin;
|
|
52
|
+
private ariaOpenHandler;
|
|
53
|
+
private ariaCloseHandler;
|
|
54
|
+
private removeAriaSyncListeners;
|
|
55
|
+
private syncAriaOnNextTransition;
|
|
56
|
+
private openPopover;
|
|
57
|
+
private closePopover;
|
|
41
58
|
private updateTriggerElAriaAttributes;
|
|
59
|
+
private get opensWithoutActivation();
|
|
42
60
|
private isPopoverOpen;
|
|
43
61
|
render(): any;
|
|
44
62
|
}
|
|
@@ -7,6 +7,19 @@ declare const _default: {
|
|
|
7
7
|
type: string;
|
|
8
8
|
};
|
|
9
9
|
};
|
|
10
|
+
trigger: {
|
|
11
|
+
description: string;
|
|
12
|
+
control: {
|
|
13
|
+
type: string;
|
|
14
|
+
};
|
|
15
|
+
options: string[];
|
|
16
|
+
};
|
|
17
|
+
triggerOnClick: {
|
|
18
|
+
description: string;
|
|
19
|
+
};
|
|
20
|
+
triggerOnHover: {
|
|
21
|
+
description: string;
|
|
22
|
+
};
|
|
10
23
|
};
|
|
11
24
|
component: string;
|
|
12
25
|
tags: string[];
|
|
@@ -55,6 +55,7 @@ import { SwirlOptionListItemContext, SwirlOptionListItemRole } from "./component
|
|
|
55
55
|
import { SwirlPaginationVariant } from "./components/swirl-pagination/swirl-pagination";
|
|
56
56
|
import { SwirlPopoverAnimation, SwirlPopoverBorderRadius, SwirlPopoverControlMethod, SwirlPopoverFallbackAxisSideDirection } from "./components/swirl-popover/swirl-popover";
|
|
57
57
|
import { SwirlPopover } from "./components/swirl-popover/swirl-popover";
|
|
58
|
+
import { SwirlPopoverTriggerMethod } from "./components/swirl-popover-trigger/swirl-popover-trigger";
|
|
58
59
|
import { SwirlProgressIndicatorSize, SwirlProgressIndicatorVariant } from "./components/swirl-progress-indicator/swirl-progress-indicator";
|
|
59
60
|
import { SwirlRadioState, SwirlRadioVariant } from "./components/swirl-radio/swirl-radio";
|
|
60
61
|
import { SwirlBoxPadding as SwirlBoxPadding1, SwirlResourceListSemantics } from "./components/swirl-resource-list/swirl-resource-list";
|
|
@@ -139,6 +140,7 @@ export { SwirlOptionListItemContext, SwirlOptionListItemRole } from "./component
|
|
|
139
140
|
export { SwirlPaginationVariant } from "./components/swirl-pagination/swirl-pagination";
|
|
140
141
|
export { SwirlPopoverAnimation, SwirlPopoverBorderRadius, SwirlPopoverControlMethod, SwirlPopoverFallbackAxisSideDirection } from "./components/swirl-popover/swirl-popover";
|
|
141
142
|
export { SwirlPopover } from "./components/swirl-popover/swirl-popover";
|
|
143
|
+
export { SwirlPopoverTriggerMethod } from "./components/swirl-popover-trigger/swirl-popover-trigger";
|
|
142
144
|
export { SwirlProgressIndicatorSize, SwirlProgressIndicatorVariant } from "./components/swirl-progress-indicator/swirl-progress-indicator";
|
|
143
145
|
export { SwirlRadioState, SwirlRadioVariant } from "./components/swirl-radio/swirl-radio";
|
|
144
146
|
export { SwirlBoxPadding as SwirlBoxPadding1, SwirlResourceListSemantics } from "./components/swirl-resource-list/swirl-resource-list";
|
|
@@ -3258,6 +3260,14 @@ export namespace Components {
|
|
|
3258
3260
|
*/
|
|
3259
3261
|
"size": SwirlIconSize;
|
|
3260
3262
|
}
|
|
3263
|
+
interface SwirlIconTabMove {
|
|
3264
|
+
"color"?: SwirlIconColor1;
|
|
3265
|
+
"label"?: string;
|
|
3266
|
+
/**
|
|
3267
|
+
* @default 24
|
|
3268
|
+
*/
|
|
3269
|
+
"size": SwirlIconSize;
|
|
3270
|
+
}
|
|
3261
3271
|
interface SwirlIconTasks {
|
|
3262
3272
|
"color"?: SwirlIconColor1;
|
|
3263
3273
|
"label"?: string;
|
|
@@ -4200,11 +4210,14 @@ export namespace Components {
|
|
|
4200
4210
|
*/
|
|
4201
4211
|
"setAriaAttributes"?: boolean;
|
|
4202
4212
|
"swirlPopover": string | HTMLSwirlPopoverElement | SwirlPopover;
|
|
4213
|
+
"trigger"?: SwirlPopoverTriggerMethod[] | string;
|
|
4203
4214
|
/**
|
|
4215
|
+
* @deprecated Please use the "trigger" prop instead, e.g. trigger="click".
|
|
4204
4216
|
* @default true
|
|
4205
4217
|
*/
|
|
4206
4218
|
"triggerOnClick"?: boolean;
|
|
4207
4219
|
/**
|
|
4220
|
+
* @deprecated Please use the "trigger" prop instead, e.g. trigger="hover focus".
|
|
4208
4221
|
* @default false
|
|
4209
4222
|
*/
|
|
4210
4223
|
"triggerOnHover"?: boolean;
|
|
@@ -8240,6 +8253,12 @@ declare global {
|
|
|
8240
8253
|
prototype: HTMLSwirlIconSyncElement;
|
|
8241
8254
|
new (): HTMLSwirlIconSyncElement;
|
|
8242
8255
|
};
|
|
8256
|
+
interface HTMLSwirlIconTabMoveElement extends Components.SwirlIconTabMove, HTMLStencilElement {
|
|
8257
|
+
}
|
|
8258
|
+
var HTMLSwirlIconTabMoveElement: {
|
|
8259
|
+
prototype: HTMLSwirlIconTabMoveElement;
|
|
8260
|
+
new (): HTMLSwirlIconTabMoveElement;
|
|
8261
|
+
};
|
|
8243
8262
|
interface HTMLSwirlIconTasksElement extends Components.SwirlIconTasks, HTMLStencilElement {
|
|
8244
8263
|
}
|
|
8245
8264
|
var HTMLSwirlIconTasksElement: {
|
|
@@ -10464,6 +10483,7 @@ declare global {
|
|
|
10464
10483
|
"swirl-icon-sunny": HTMLSwirlIconSunnyElement;
|
|
10465
10484
|
"swirl-icon-swap-vert": HTMLSwirlIconSwapVertElement;
|
|
10466
10485
|
"swirl-icon-sync": HTMLSwirlIconSyncElement;
|
|
10486
|
+
"swirl-icon-tab-move": HTMLSwirlIconTabMoveElement;
|
|
10467
10487
|
"swirl-icon-tasks": HTMLSwirlIconTasksElement;
|
|
10468
10488
|
"swirl-icon-tasks-filled": HTMLSwirlIconTasksFilledElement;
|
|
10469
10489
|
"swirl-icon-terminal": HTMLSwirlIconTerminalElement;
|
|
@@ -13743,6 +13763,14 @@ declare namespace LocalJSX {
|
|
|
13743
13763
|
*/
|
|
13744
13764
|
"size"?: SwirlIconSize;
|
|
13745
13765
|
}
|
|
13766
|
+
interface SwirlIconTabMove {
|
|
13767
|
+
"color"?: SwirlIconColor1;
|
|
13768
|
+
"label"?: string;
|
|
13769
|
+
/**
|
|
13770
|
+
* @default 24
|
|
13771
|
+
*/
|
|
13772
|
+
"size"?: SwirlIconSize;
|
|
13773
|
+
}
|
|
13746
13774
|
interface SwirlIconTasks {
|
|
13747
13775
|
"color"?: SwirlIconColor1;
|
|
13748
13776
|
"label"?: string;
|
|
@@ -14606,11 +14634,14 @@ declare namespace LocalJSX {
|
|
|
14606
14634
|
*/
|
|
14607
14635
|
"setAriaAttributes"?: boolean;
|
|
14608
14636
|
"swirlPopover": string | HTMLSwirlPopoverElement | SwirlPopover;
|
|
14637
|
+
"trigger"?: SwirlPopoverTriggerMethod[] | string;
|
|
14609
14638
|
/**
|
|
14639
|
+
* @deprecated Please use the "trigger" prop instead, e.g. trigger="click".
|
|
14610
14640
|
* @default true
|
|
14611
14641
|
*/
|
|
14612
14642
|
"triggerOnClick"?: boolean;
|
|
14613
14643
|
/**
|
|
14644
|
+
* @deprecated Please use the "trigger" prop instead, e.g. trigger="hover focus".
|
|
14614
14645
|
* @default false
|
|
14615
14646
|
*/
|
|
14616
14647
|
"triggerOnHover"?: boolean;
|
|
@@ -18015,6 +18046,11 @@ declare namespace LocalJSX {
|
|
|
18015
18046
|
"label": string;
|
|
18016
18047
|
"size": SwirlIconSize;
|
|
18017
18048
|
}
|
|
18049
|
+
interface SwirlIconTabMoveAttributes {
|
|
18050
|
+
"color": SwirlIconColor;
|
|
18051
|
+
"label": string;
|
|
18052
|
+
"size": SwirlIconSize;
|
|
18053
|
+
}
|
|
18018
18054
|
interface SwirlIconTasksAttributes {
|
|
18019
18055
|
"color": SwirlIconColor;
|
|
18020
18056
|
"label": string;
|
|
@@ -18401,6 +18437,7 @@ declare namespace LocalJSX {
|
|
|
18401
18437
|
"hidePopoverWhenInvisible": boolean;
|
|
18402
18438
|
"setAriaAttributes": boolean;
|
|
18403
18439
|
"swirlPopover": string | HTMLSwirlPopoverElement | SwirlPopover;
|
|
18440
|
+
"trigger": SwirlPopoverTriggerMethod[] | string;
|
|
18404
18441
|
"triggerOnClick": boolean;
|
|
18405
18442
|
"triggerOnHover": boolean;
|
|
18406
18443
|
"hoverLingerDuration": number;
|
|
@@ -19504,6 +19541,7 @@ declare namespace LocalJSX {
|
|
|
19504
19541
|
"swirl-icon-sunny": Omit<SwirlIconSunny, keyof SwirlIconSunnyAttributes> & { [K in keyof SwirlIconSunny & keyof SwirlIconSunnyAttributes]?: SwirlIconSunny[K] } & { [K in keyof SwirlIconSunny & keyof SwirlIconSunnyAttributes as `attr:${K}`]?: SwirlIconSunnyAttributes[K] } & { [K in keyof SwirlIconSunny & keyof SwirlIconSunnyAttributes as `prop:${K}`]?: SwirlIconSunny[K] };
|
|
19505
19542
|
"swirl-icon-swap-vert": Omit<SwirlIconSwapVert, keyof SwirlIconSwapVertAttributes> & { [K in keyof SwirlIconSwapVert & keyof SwirlIconSwapVertAttributes]?: SwirlIconSwapVert[K] } & { [K in keyof SwirlIconSwapVert & keyof SwirlIconSwapVertAttributes as `attr:${K}`]?: SwirlIconSwapVertAttributes[K] } & { [K in keyof SwirlIconSwapVert & keyof SwirlIconSwapVertAttributes as `prop:${K}`]?: SwirlIconSwapVert[K] };
|
|
19506
19543
|
"swirl-icon-sync": Omit<SwirlIconSync, keyof SwirlIconSyncAttributes> & { [K in keyof SwirlIconSync & keyof SwirlIconSyncAttributes]?: SwirlIconSync[K] } & { [K in keyof SwirlIconSync & keyof SwirlIconSyncAttributes as `attr:${K}`]?: SwirlIconSyncAttributes[K] } & { [K in keyof SwirlIconSync & keyof SwirlIconSyncAttributes as `prop:${K}`]?: SwirlIconSync[K] };
|
|
19544
|
+
"swirl-icon-tab-move": Omit<SwirlIconTabMove, keyof SwirlIconTabMoveAttributes> & { [K in keyof SwirlIconTabMove & keyof SwirlIconTabMoveAttributes]?: SwirlIconTabMove[K] } & { [K in keyof SwirlIconTabMove & keyof SwirlIconTabMoveAttributes as `attr:${K}`]?: SwirlIconTabMoveAttributes[K] } & { [K in keyof SwirlIconTabMove & keyof SwirlIconTabMoveAttributes as `prop:${K}`]?: SwirlIconTabMove[K] };
|
|
19507
19545
|
"swirl-icon-tasks": Omit<SwirlIconTasks, keyof SwirlIconTasksAttributes> & { [K in keyof SwirlIconTasks & keyof SwirlIconTasksAttributes]?: SwirlIconTasks[K] } & { [K in keyof SwirlIconTasks & keyof SwirlIconTasksAttributes as `attr:${K}`]?: SwirlIconTasksAttributes[K] } & { [K in keyof SwirlIconTasks & keyof SwirlIconTasksAttributes as `prop:${K}`]?: SwirlIconTasks[K] };
|
|
19508
19546
|
"swirl-icon-tasks-filled": Omit<SwirlIconTasksFilled, keyof SwirlIconTasksFilledAttributes> & { [K in keyof SwirlIconTasksFilled & keyof SwirlIconTasksFilledAttributes]?: SwirlIconTasksFilled[K] } & { [K in keyof SwirlIconTasksFilled & keyof SwirlIconTasksFilledAttributes as `attr:${K}`]?: SwirlIconTasksFilledAttributes[K] } & { [K in keyof SwirlIconTasksFilled & keyof SwirlIconTasksFilledAttributes as `prop:${K}`]?: SwirlIconTasksFilled[K] };
|
|
19509
19547
|
"swirl-icon-terminal": Omit<SwirlIconTerminal, keyof SwirlIconTerminalAttributes> & { [K in keyof SwirlIconTerminal & keyof SwirlIconTerminalAttributes]?: SwirlIconTerminal[K] } & { [K in keyof SwirlIconTerminal & keyof SwirlIconTerminalAttributes as `attr:${K}`]?: SwirlIconTerminalAttributes[K] } & { [K in keyof SwirlIconTerminal & keyof SwirlIconTerminalAttributes as `prop:${K}`]?: SwirlIconTerminal[K] };
|
|
@@ -20062,6 +20100,7 @@ declare module "@stencil/core" {
|
|
|
20062
20100
|
"swirl-icon-sunny": LocalJSX.IntrinsicElements["swirl-icon-sunny"] & JSXBase.HTMLAttributes<HTMLSwirlIconSunnyElement>;
|
|
20063
20101
|
"swirl-icon-swap-vert": LocalJSX.IntrinsicElements["swirl-icon-swap-vert"] & JSXBase.HTMLAttributes<HTMLSwirlIconSwapVertElement>;
|
|
20064
20102
|
"swirl-icon-sync": LocalJSX.IntrinsicElements["swirl-icon-sync"] & JSXBase.HTMLAttributes<HTMLSwirlIconSyncElement>;
|
|
20103
|
+
"swirl-icon-tab-move": LocalJSX.IntrinsicElements["swirl-icon-tab-move"] & JSXBase.HTMLAttributes<HTMLSwirlIconTabMoveElement>;
|
|
20065
20104
|
"swirl-icon-tasks": LocalJSX.IntrinsicElements["swirl-icon-tasks"] & JSXBase.HTMLAttributes<HTMLSwirlIconTasksElement>;
|
|
20066
20105
|
"swirl-icon-tasks-filled": LocalJSX.IntrinsicElements["swirl-icon-tasks-filled"] & JSXBase.HTMLAttributes<HTMLSwirlIconTasksFilledElement>;
|
|
20067
20106
|
"swirl-icon-terminal": LocalJSX.IntrinsicElements["swirl-icon-terminal"] & JSXBase.HTMLAttributes<HTMLSwirlIconTerminalElement>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@getflip/swirl-ai",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.529.0",
|
|
4
4
|
"description": "Swirl Design System AI package with artifacts for AI agents",
|
|
5
5
|
"author": "Flip GmbH",
|
|
6
6
|
"repository": {
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"lint": "tsc --noEmit"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
|
-
"@getflip/swirl-components": "0.
|
|
29
|
+
"@getflip/swirl-components": "0.529.0",
|
|
30
30
|
"@getflip/swirl-tokens": "2.14.3",
|
|
31
31
|
"@types/node": "25.3.0",
|
|
32
32
|
"tsx": "^4.7.0",
|