@emuanalytics/flow-rdf-ui 0.0.49 → 0.0.50
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/custom-elements.json +9201 -9195
- package/dist/index.cjs +12006 -12282
- package/dist/index.d.cts +949 -979
- package/dist/index.d.mts +949 -979
- package/dist/index.d.ts +949 -979
- package/dist/index.mjs +12031 -12346
- package/dist/vscode.html-custom-data.json +545 -370
- package/package.json +17 -10
package/dist/index.d.mts
CHANGED
|
@@ -102,12 +102,10 @@ interface VirtualElement {
|
|
|
102
102
|
contextElement?: Element;
|
|
103
103
|
}
|
|
104
104
|
/**
|
|
105
|
+
* @tagname flow-ui-popup
|
|
105
106
|
* @summary Popup is a utility that lets you declaratively anchor "popup" containers to another element.
|
|
106
|
-
|
|
107
|
-
* @
|
|
108
|
-
* @since 2.0
|
|
109
|
-
*
|
|
110
|
-
* @event sl-reposition - Emitted when the popup is repositioned. This event can fire a lot, so avoid putting expensive
|
|
107
|
+
|
|
108
|
+
* @event flow-ui-reposition - Emitted when the popup is repositioned. This event can fire a lot, so avoid putting expensive
|
|
111
109
|
* operations in your listener or consider debouncing it.
|
|
112
110
|
*
|
|
113
111
|
* @slot - The popup's content.
|
|
@@ -122,7 +120,7 @@ interface VirtualElement {
|
|
|
122
120
|
*
|
|
123
121
|
* @cssproperty [--arrow-size=6px] - The size of the arrow. Note that an arrow won't be shown unless the `arrow`
|
|
124
122
|
* attribute is used.
|
|
125
|
-
* @cssproperty [--arrow-color=var(--
|
|
123
|
+
* @cssproperty [--arrow-color=var(--flow-ui-color-neutral-0)] - The color of the arrow.
|
|
126
124
|
* @cssproperty [--auto-size-available-width] - A read-only custom property that determines the amount of width the
|
|
127
125
|
* popup can be before overflowing. Useful for positioning child elements that need to overflow. This property is only
|
|
128
126
|
* available when using `auto-size`.
|
|
@@ -252,10 +250,8 @@ declare global {
|
|
|
252
250
|
}
|
|
253
251
|
|
|
254
252
|
/**
|
|
253
|
+
* @tagname flow-ui-tooltip
|
|
255
254
|
* @summary Tooltips display additional information based on a specific action.
|
|
256
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tooltip
|
|
257
|
-
* @status stable
|
|
258
|
-
* @since 2.0
|
|
259
255
|
*
|
|
260
256
|
* @dependency flow-ui-popup
|
|
261
257
|
*
|
|
@@ -332,6 +328,7 @@ declare class FlowTooltip extends FlowRdfElement {
|
|
|
332
328
|
hide(): Promise<void>;
|
|
333
329
|
render(): lit.TemplateResult<1>;
|
|
334
330
|
}
|
|
331
|
+
|
|
335
332
|
declare global {
|
|
336
333
|
interface HTMLElementTagNameMap {
|
|
337
334
|
'flow-ui-tooltip': FlowTooltip;
|
|
@@ -452,7 +449,7 @@ declare class FlowAlert extends FlowRdfElement {
|
|
|
452
449
|
private autoHideTimeout;
|
|
453
450
|
private readonly hasSlotController;
|
|
454
451
|
private readonly localize;
|
|
455
|
-
base
|
|
452
|
+
private base;
|
|
456
453
|
/**
|
|
457
454
|
* Indicates whether or not the alert is open. You can toggle this attribute to show and hide the alert, or you can
|
|
458
455
|
* use the `show()` and `hide()` methods and this attribute will reflect the alert's open state.
|
|
@@ -472,7 +469,9 @@ declare class FlowAlert extends FlowRdfElement {
|
|
|
472
469
|
private restartAutoHide;
|
|
473
470
|
private handleCloseClick;
|
|
474
471
|
private handleMouseMove;
|
|
472
|
+
/** @internal */
|
|
475
473
|
handleOpenChange(): Promise<void>;
|
|
474
|
+
/** @internal */
|
|
476
475
|
handleDurationChange(): void;
|
|
477
476
|
/** Shows the alert. */
|
|
478
477
|
show(): Promise<void>;
|
|
@@ -494,6 +493,7 @@ declare global {
|
|
|
494
493
|
}
|
|
495
494
|
|
|
496
495
|
/**
|
|
496
|
+
* @tagname flow-ui-animation
|
|
497
497
|
* @summary Animate elements declaratively with nearly 100 baked-in presets, or roll your own with custom keyframes. Powered by the [Web Animations API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API).
|
|
498
498
|
* @documentation https://shoelace.style/components/animation
|
|
499
499
|
* @status stable
|
|
@@ -510,7 +510,7 @@ declare class SlAnimation extends FlowRdfElement {
|
|
|
510
510
|
static styles: CSSResultGroup;
|
|
511
511
|
private animation?;
|
|
512
512
|
private hasStarted;
|
|
513
|
-
defaultSlot
|
|
513
|
+
private defaultSlot;
|
|
514
514
|
/** The name of the built-in animation to use. For custom animations, use the `keyframes` prop. */
|
|
515
515
|
name: string;
|
|
516
516
|
/**
|
|
@@ -575,11 +575,9 @@ declare global {
|
|
|
575
575
|
}
|
|
576
576
|
|
|
577
577
|
/**
|
|
578
|
+
* @tagname flow-ui-avatar
|
|
578
579
|
* @summary Avatars are used to represent a person or object.
|
|
579
|
-
|
|
580
|
-
* @status stable
|
|
581
|
-
* @since 2.0
|
|
582
|
-
*
|
|
580
|
+
|
|
583
581
|
* @dependency flow-ui-icon
|
|
584
582
|
*
|
|
585
583
|
* @slot icon - The default icon to use when no image or initials are present. Works best with `<flow-ui-icon>`.
|
|
@@ -604,9 +602,11 @@ declare class FlowAvatar extends FlowRdfElement {
|
|
|
604
602
|
loading: 'eager' | 'lazy';
|
|
605
603
|
/** The shape of the avatar. */
|
|
606
604
|
shape: 'circle' | 'square' | 'rounded';
|
|
605
|
+
/** @internal */
|
|
607
606
|
handleImageChange(): void;
|
|
608
607
|
render(): lit.TemplateResult<1>;
|
|
609
608
|
}
|
|
609
|
+
|
|
610
610
|
declare global {
|
|
611
611
|
interface HTMLElementTagNameMap {
|
|
612
612
|
'flow-ui-avatar': FlowAvatar;
|
|
@@ -614,10 +614,8 @@ declare global {
|
|
|
614
614
|
}
|
|
615
615
|
|
|
616
616
|
/**
|
|
617
|
+
* @tagname flow-ui-badge
|
|
617
618
|
* @summary Badges are used to draw attention and display statuses or counts.
|
|
618
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/badge
|
|
619
|
-
* @status stable
|
|
620
|
-
* @since 2.0
|
|
621
619
|
*
|
|
622
620
|
* @slot - The badge's content.
|
|
623
621
|
*
|
|
@@ -633,6 +631,7 @@ declare class FlowBadge extends FlowRdfElement {
|
|
|
633
631
|
pulse: boolean;
|
|
634
632
|
render(): lit.TemplateResult<1>;
|
|
635
633
|
}
|
|
634
|
+
|
|
636
635
|
declare global {
|
|
637
636
|
interface HTMLElementTagNameMap {
|
|
638
637
|
'flow-ui-badge': FlowBadge;
|
|
@@ -640,11 +639,9 @@ declare global {
|
|
|
640
639
|
}
|
|
641
640
|
|
|
642
641
|
/**
|
|
642
|
+
* @tagname flow-ui-breadcrumb-item
|
|
643
643
|
* @summary Breadcrumb Items are used inside [breadcrumbs](/components/breadcrumb) to represent different links.
|
|
644
|
-
|
|
645
|
-
* @status stable
|
|
646
|
-
* @since 2.0
|
|
647
|
-
*
|
|
644
|
+
|
|
648
645
|
* @slot - The breadcrumb item's label.
|
|
649
646
|
* @slot prefix - An optional prefix, usually an icon or icon button.
|
|
650
647
|
* @slot suffix - An optional suffix, usually an icon or icon button.
|
|
@@ -671,6 +668,7 @@ declare class FlowBreadcrumbItem extends FlowRdfElement {
|
|
|
671
668
|
rel: string;
|
|
672
669
|
render(): lit.TemplateResult<1>;
|
|
673
670
|
}
|
|
671
|
+
|
|
674
672
|
declare global {
|
|
675
673
|
interface HTMLElementTagNameMap {
|
|
676
674
|
'flow-ui-breadcrumb-item': FlowBreadcrumbItem;
|
|
@@ -678,10 +676,8 @@ declare global {
|
|
|
678
676
|
}
|
|
679
677
|
|
|
680
678
|
/**
|
|
679
|
+
* @tagname flow-ui-breadcrumb
|
|
681
680
|
* @summary Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.
|
|
682
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/breadcrumb
|
|
683
|
-
* @status stable
|
|
684
|
-
* @since 2.0
|
|
685
681
|
*
|
|
686
682
|
* @slot - One or more breadcrumb items to display.
|
|
687
683
|
* @slot separator - The separator to use between breadcrumb items. Works best with `<flow-ui-icon>`.
|
|
@@ -694,8 +690,8 @@ declare class FlowBreadcrumb extends FlowRdfElement {
|
|
|
694
690
|
static styles: CSSResultGroup;
|
|
695
691
|
private readonly localize;
|
|
696
692
|
private separatorDir;
|
|
697
|
-
defaultSlot
|
|
698
|
-
separatorSlot
|
|
693
|
+
private defaultSlot;
|
|
694
|
+
private separatorSlot;
|
|
699
695
|
/**
|
|
700
696
|
* The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by
|
|
701
697
|
* screen readers and other assistive devices to provide more context for users.
|
|
@@ -705,6 +701,7 @@ declare class FlowBreadcrumb extends FlowRdfElement {
|
|
|
705
701
|
private handleSlotChange;
|
|
706
702
|
render(): lit.TemplateResult<1>;
|
|
707
703
|
}
|
|
704
|
+
|
|
708
705
|
declare global {
|
|
709
706
|
interface HTMLElementTagNameMap {
|
|
710
707
|
'flow-ui-breadcrumb': FlowBreadcrumb;
|
|
@@ -712,10 +709,8 @@ declare global {
|
|
|
712
709
|
}
|
|
713
710
|
|
|
714
711
|
/**
|
|
712
|
+
* @tagname flow-ui-button-group
|
|
715
713
|
* @summary Button groups can be used to group related buttons into sections.
|
|
716
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/button-group
|
|
717
|
-
* @status stable
|
|
718
|
-
* @since 2.0
|
|
719
714
|
*
|
|
720
715
|
* @slot - One or more `<flow-ui-button>` elements to display in the button group.
|
|
721
716
|
*
|
|
@@ -723,13 +718,16 @@ declare global {
|
|
|
723
718
|
*/
|
|
724
719
|
declare class FlowButtonGroup extends FlowRdfElement {
|
|
725
720
|
static styles: CSSResultGroup;
|
|
721
|
+
/** @internal */
|
|
726
722
|
defaultSlot: HTMLSlotElement;
|
|
723
|
+
/** @internal */
|
|
727
724
|
disableRole: boolean;
|
|
728
725
|
label: string;
|
|
729
726
|
/**
|
|
730
727
|
* Use vertical layout for the button group.
|
|
731
728
|
*/
|
|
732
729
|
vertical: boolean;
|
|
730
|
+
/** @internal */
|
|
733
731
|
handleVerticalChange(): Promise<void>;
|
|
734
732
|
private handleFocus;
|
|
735
733
|
private handleBlur;
|
|
@@ -738,6 +736,7 @@ declare class FlowButtonGroup extends FlowRdfElement {
|
|
|
738
736
|
private handleSlotChange;
|
|
739
737
|
render(): lit.TemplateResult<1>;
|
|
740
738
|
}
|
|
739
|
+
|
|
741
740
|
declare global {
|
|
742
741
|
interface HTMLElementTagNameMap {
|
|
743
742
|
'flow-ui-button-group': FlowButtonGroup;
|
|
@@ -745,10 +744,8 @@ declare global {
|
|
|
745
744
|
}
|
|
746
745
|
|
|
747
746
|
/**
|
|
747
|
+
* @tagname flow-ui-spinner
|
|
748
748
|
* @summary Spinners are used to show the progress of an indeterminate operation.
|
|
749
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/spinner
|
|
750
|
-
* @status stable
|
|
751
|
-
* @since 2.0
|
|
752
749
|
*
|
|
753
750
|
* @csspart base - The component's base wrapper.
|
|
754
751
|
*
|
|
@@ -762,6 +759,7 @@ declare class FlowSpinner extends FlowRdfElement {
|
|
|
762
759
|
private readonly localize;
|
|
763
760
|
render(): lit.TemplateResult<1>;
|
|
764
761
|
}
|
|
762
|
+
|
|
765
763
|
declare global {
|
|
766
764
|
interface HTMLElementTagNameMap {
|
|
767
765
|
'flow-ui-spinner': FlowSpinner;
|
|
@@ -794,9 +792,9 @@ declare class FlowButton extends FlowRdfElement implements FlowRdfFormControl {
|
|
|
794
792
|
private readonly formControlController;
|
|
795
793
|
private readonly hasSlotController;
|
|
796
794
|
private readonly localize;
|
|
795
|
+
/** @internal */
|
|
797
796
|
button: HTMLButtonElement | HTMLLinkElement;
|
|
798
797
|
private hasFocus;
|
|
799
|
-
invalid: boolean;
|
|
800
798
|
title: string;
|
|
801
799
|
/** The button's theme variant. */
|
|
802
800
|
variant: 'default' | 'primary' | 'secondary' | 'success' | 'neutral' | 'warning' | 'danger' | 'text';
|
|
@@ -879,6 +877,7 @@ declare class FlowButton extends FlowRdfElement implements FlowRdfFormControl {
|
|
|
879
877
|
private handleInvalid;
|
|
880
878
|
private isButton;
|
|
881
879
|
private isLink;
|
|
880
|
+
/** @internal */
|
|
882
881
|
handleDisabledChange(): void;
|
|
883
882
|
/** Simulates a click on the button. */
|
|
884
883
|
click(): void;
|
|
@@ -921,7 +920,9 @@ declare class FlowCalendar extends FlowRdfElement {
|
|
|
921
920
|
size: 'small' | 'medium' | 'large';
|
|
922
921
|
connectedCallback(): void;
|
|
923
922
|
disconnectedCallback(): void;
|
|
923
|
+
/** @internal */
|
|
924
924
|
handleValueChange(): void;
|
|
925
|
+
/** @internal */
|
|
925
926
|
handleTimezoneChange(): void;
|
|
926
927
|
private dateClicked;
|
|
927
928
|
private stepDisplayDate;
|
|
@@ -947,10 +948,9 @@ declare global {
|
|
|
947
948
|
}
|
|
948
949
|
|
|
949
950
|
/**
|
|
951
|
+
* @tagname flow-ui-card
|
|
950
952
|
* @summary Cards can be used to group related subjects in a container.
|
|
951
|
-
|
|
952
|
-
* @status stable
|
|
953
|
-
* @since 2.0
|
|
953
|
+
|
|
954
954
|
*
|
|
955
955
|
* @slot - The card's main content.
|
|
956
956
|
* @slot header - An optional header for the card.
|
|
@@ -973,6 +973,7 @@ declare class FlowCard extends FlowRdfElement {
|
|
|
973
973
|
private readonly hasSlotController;
|
|
974
974
|
render(): lit.TemplateResult<1>;
|
|
975
975
|
}
|
|
976
|
+
|
|
976
977
|
declare global {
|
|
977
978
|
interface HTMLElementTagNameMap {
|
|
978
979
|
'flow-ui-card': FlowCard;
|
|
@@ -980,6 +981,7 @@ declare global {
|
|
|
980
981
|
}
|
|
981
982
|
|
|
982
983
|
/**
|
|
984
|
+
* @tagname flow-ui-carousel-item
|
|
983
985
|
* @summary A carousel item represent a slide within a [carousel](/components/carousel).
|
|
984
986
|
*
|
|
985
987
|
* @since 2.0
|
|
@@ -996,6 +998,7 @@ declare class FlowCarouselItem extends FlowRdfElement {
|
|
|
996
998
|
connectedCallback(): void;
|
|
997
999
|
render(): lit.TemplateResult<1>;
|
|
998
1000
|
}
|
|
1001
|
+
|
|
999
1002
|
declare global {
|
|
1000
1003
|
interface HTMLElementTagNameMap {
|
|
1001
1004
|
'flow-ui-carousel-item': FlowCarouselItem;
|
|
@@ -1003,6 +1006,7 @@ declare global {
|
|
|
1003
1006
|
}
|
|
1004
1007
|
|
|
1005
1008
|
/**
|
|
1009
|
+
* @tagname flow-ui-carousel
|
|
1006
1010
|
* @summary Carousels display an arbitrary number of content slides along a horizontal or vertical axis.
|
|
1007
1011
|
*
|
|
1008
1012
|
* @since 2.2
|
|
@@ -1100,6 +1104,7 @@ declare class FlowCarousel extends FlowRdfElement {
|
|
|
1100
1104
|
goToSlide(index: number, behavior?: ScrollBehavior): void;
|
|
1101
1105
|
render(): lit.TemplateResult<1>;
|
|
1102
1106
|
}
|
|
1107
|
+
|
|
1103
1108
|
declare global {
|
|
1104
1109
|
interface HTMLElementTagNameMap {
|
|
1105
1110
|
'flow-ui-carousel': FlowCarousel;
|
|
@@ -1165,11 +1170,9 @@ declare global {
|
|
|
1165
1170
|
}
|
|
1166
1171
|
|
|
1167
1172
|
/**
|
|
1173
|
+
* @tagname flow-ui-checkbox
|
|
1168
1174
|
* @summary Checkboxes allow the user to toggle an option on or off.
|
|
1169
|
-
|
|
1170
|
-
* @status stable
|
|
1171
|
-
* @since 2.0
|
|
1172
|
-
*
|
|
1175
|
+
|
|
1173
1176
|
* @dependency flow-ui-icon
|
|
1174
1177
|
*
|
|
1175
1178
|
* @slot - The checkbox's label.
|
|
@@ -1192,7 +1195,7 @@ declare class FlowCheckbox extends FlowRdfElement implements FlowRdfFormControl
|
|
|
1192
1195
|
static styles: CSSResultGroup;
|
|
1193
1196
|
private readonly hasSlotController;
|
|
1194
1197
|
private readonly formControlController;
|
|
1195
|
-
input
|
|
1198
|
+
private input;
|
|
1196
1199
|
private hasFocus;
|
|
1197
1200
|
title: string;
|
|
1198
1201
|
/** The name of the checkbox, submitted as a name/value pair with form data. */
|
|
@@ -1230,7 +1233,9 @@ declare class FlowCheckbox extends FlowRdfElement implements FlowRdfFormControl
|
|
|
1230
1233
|
private handleInput;
|
|
1231
1234
|
private handleInvalid;
|
|
1232
1235
|
private handleFocus;
|
|
1236
|
+
/** @internal */
|
|
1233
1237
|
handleDisabledChange(): void;
|
|
1238
|
+
/** @internal */
|
|
1234
1239
|
handleStateChange(): void;
|
|
1235
1240
|
/** Simulates a click on the checkbox. */
|
|
1236
1241
|
click(): void;
|
|
@@ -1251,6 +1256,7 @@ declare class FlowCheckbox extends FlowRdfElement implements FlowRdfFormControl
|
|
|
1251
1256
|
setCustomValidity(message: string): void;
|
|
1252
1257
|
render(): lit.TemplateResult<1>;
|
|
1253
1258
|
}
|
|
1259
|
+
|
|
1254
1260
|
declare global {
|
|
1255
1261
|
interface HTMLElementTagNameMap {
|
|
1256
1262
|
'flow-ui-checkbox': FlowCheckbox;
|
|
@@ -1258,10 +1264,8 @@ declare global {
|
|
|
1258
1264
|
}
|
|
1259
1265
|
|
|
1260
1266
|
/**
|
|
1267
|
+
* @tagname flow-ui-menu-item
|
|
1261
1268
|
* @summary Menu items provide options for the user to pick from in a menu.
|
|
1262
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/menu-item
|
|
1263
|
-
* @status stable
|
|
1264
|
-
* @since 2.0
|
|
1265
1269
|
*
|
|
1266
1270
|
* @dependency flow-ui-icon
|
|
1267
1271
|
*
|
|
@@ -1300,6 +1304,7 @@ declare class FlowMenuItem extends FlowRdfElement {
|
|
|
1300
1304
|
getTextLabel(): string;
|
|
1301
1305
|
render(): lit.TemplateResult<1>;
|
|
1302
1306
|
}
|
|
1307
|
+
|
|
1303
1308
|
declare global {
|
|
1304
1309
|
interface HTMLElementTagNameMap {
|
|
1305
1310
|
'flow-ui-menu-item': FlowMenuItem;
|
|
@@ -1307,11 +1312,9 @@ declare global {
|
|
|
1307
1312
|
}
|
|
1308
1313
|
|
|
1309
1314
|
/**
|
|
1315
|
+
* @tagname flow-ui-menu
|
|
1310
1316
|
* @summary Menus provide a list of options for the user to choose from.
|
|
1311
|
-
|
|
1312
|
-
* @status stable
|
|
1313
|
-
* @since 2.0
|
|
1314
|
-
*
|
|
1317
|
+
|
|
1315
1318
|
* @slot - The menu's content, including menu items, menu labels, and dividers.
|
|
1316
1319
|
*
|
|
1317
1320
|
* @event {{ item: FlowMenuItem }} flow-ui-select - Emitted when a menu item is selected.
|
|
@@ -1339,6 +1342,7 @@ declare class FlowMenu extends FlowRdfElement {
|
|
|
1339
1342
|
setCurrentItem(item: FlowMenuItem): void;
|
|
1340
1343
|
render(): lit.TemplateResult<1>;
|
|
1341
1344
|
}
|
|
1345
|
+
|
|
1342
1346
|
declare global {
|
|
1343
1347
|
interface HTMLElementTagNameMap {
|
|
1344
1348
|
'flow-ui-menu': FlowMenu;
|
|
@@ -1348,9 +1352,6 @@ declare global {
|
|
|
1348
1352
|
/**
|
|
1349
1353
|
* @tagname flow-ui-dropdown
|
|
1350
1354
|
* @summary Dropdowns expose additional content that "drops down" in a panel.
|
|
1351
|
-
* @documentation https://shoelace.style/components/dropdown
|
|
1352
|
-
* @status stable
|
|
1353
|
-
* @since 2.0
|
|
1354
1355
|
*
|
|
1355
1356
|
* @dependency flow-ui-popup
|
|
1356
1357
|
*
|
|
@@ -1411,6 +1412,23 @@ declare class SlDropdown extends FlowRdfElement {
|
|
|
1411
1412
|
* `overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.
|
|
1412
1413
|
*/
|
|
1413
1414
|
hoist: boolean;
|
|
1415
|
+
/**
|
|
1416
|
+
* Attaches an arrow to the popup. The arrow's size and color can be customized using the `--arrow-size` and
|
|
1417
|
+
* `--arrow-color` custom properties. For additional customizations, you can also target the arrow using
|
|
1418
|
+
* `::part(arrow)` in your stylesheet.
|
|
1419
|
+
*/
|
|
1420
|
+
arrow: boolean;
|
|
1421
|
+
/**
|
|
1422
|
+
* The placement of the arrow. The default is `anchor`, which will align the arrow as close to the center of the
|
|
1423
|
+
* anchor as possible, considering available space and `arrow-padding`. A value of `start`, `end`, or `center` will
|
|
1424
|
+
* align the arrow to the start, end, or center of the popover instead.
|
|
1425
|
+
*/
|
|
1426
|
+
arrowPlacement: 'start' | 'end' | 'center' | 'anchor';
|
|
1427
|
+
/**
|
|
1428
|
+
* The amount of padding between the arrow and the edges of the popup. If the popup has a border-radius, for example,
|
|
1429
|
+
* this will prevent it from overflowing the corners.
|
|
1430
|
+
*/
|
|
1431
|
+
arrowPadding: number;
|
|
1414
1432
|
/**
|
|
1415
1433
|
* Syncs the popup width or height to that of the trigger element.
|
|
1416
1434
|
*/
|
|
@@ -1490,6 +1508,7 @@ declare class FlowInput extends FlowRdfElement implements FlowRdfFormControl {
|
|
|
1490
1508
|
private readonly formControlController;
|
|
1491
1509
|
private readonly hasSlotController;
|
|
1492
1510
|
private readonly localize;
|
|
1511
|
+
private _numberFormatter;
|
|
1493
1512
|
input: HTMLInputElement;
|
|
1494
1513
|
private hasFocus;
|
|
1495
1514
|
title: string;
|
|
@@ -1520,6 +1539,8 @@ declare class FlowInput extends FlowRdfElement implements FlowRdfFormControl {
|
|
|
1520
1539
|
disabled: boolean;
|
|
1521
1540
|
/** Placeholder text to show as a hint when the input is empty. */
|
|
1522
1541
|
placeholder: string;
|
|
1542
|
+
/** Number format to use for input controls with `type="number"`. (D3 format string) */
|
|
1543
|
+
format: string;
|
|
1523
1544
|
/** Makes the input readonly. */
|
|
1524
1545
|
readonly: boolean;
|
|
1525
1546
|
/** Adds a button to toggle the password's visibility. Only applies to password types. */
|
|
@@ -1571,6 +1592,7 @@ declare class FlowInput extends FlowRdfElement implements FlowRdfFormControl {
|
|
|
1571
1592
|
* keyboard on supportive devices.
|
|
1572
1593
|
*/
|
|
1573
1594
|
inputmode: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
|
|
1595
|
+
handleFormatChange(): void;
|
|
1574
1596
|
/** Gets or sets the current value as a `Date` object. Returns `null` if the value can't be converted. */
|
|
1575
1597
|
get valueAsDate(): Date | null;
|
|
1576
1598
|
set valueAsDate(newValue: Date | null);
|
|
@@ -1617,6 +1639,9 @@ declare class FlowInput extends FlowRdfElement implements FlowRdfFormControl {
|
|
|
1617
1639
|
reportValidity(): boolean;
|
|
1618
1640
|
/** Sets a custom validation message. Pass an empty string to restore validity. */
|
|
1619
1641
|
setCustomValidity(message: string): void;
|
|
1642
|
+
private fromDisplayValue;
|
|
1643
|
+
private toDisplayValue;
|
|
1644
|
+
private clampValue;
|
|
1620
1645
|
render(): lit.TemplateResult<1>;
|
|
1621
1646
|
}
|
|
1622
1647
|
|
|
@@ -1627,29 +1652,9 @@ declare global {
|
|
|
1627
1652
|
}
|
|
1628
1653
|
|
|
1629
1654
|
/**
|
|
1630
|
-
* @
|
|
1631
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/visually-hidden
|
|
1632
|
-
* @status stable
|
|
1633
|
-
* @since 2.0
|
|
1634
|
-
*
|
|
1635
|
-
* @slot - The content to be visually hidden.
|
|
1636
|
-
*/
|
|
1637
|
-
declare class FlowVisuallyHidden extends FlowRdfElement {
|
|
1638
|
-
static styles: CSSResultGroup;
|
|
1639
|
-
render(): lit.TemplateResult<1>;
|
|
1640
|
-
}
|
|
1641
|
-
declare global {
|
|
1642
|
-
interface HTMLElementTagNameMap {
|
|
1643
|
-
'flow-ui-visually-hidden': FlowVisuallyHidden;
|
|
1644
|
-
}
|
|
1645
|
-
}
|
|
1646
|
-
|
|
1647
|
-
/**
|
|
1655
|
+
* @tag flow-ui-color-picker
|
|
1648
1656
|
* @summary Color pickers allow the user to select a color.
|
|
1649
|
-
|
|
1650
|
-
* @status stable
|
|
1651
|
-
* @since 2.0
|
|
1652
|
-
*
|
|
1657
|
+
|
|
1653
1658
|
* @dependency flow-ui-button
|
|
1654
1659
|
* @dependency flow-ui-button-group
|
|
1655
1660
|
* @dependency flow-ui-dropdown
|
|
@@ -1703,11 +1708,11 @@ declare class FlowColorPicker extends FlowRdfElement implements FlowRdfFormContr
|
|
|
1703
1708
|
private readonly formControlController;
|
|
1704
1709
|
private isSafeValue;
|
|
1705
1710
|
private readonly localize;
|
|
1706
|
-
base
|
|
1707
|
-
input
|
|
1708
|
-
dropdown
|
|
1709
|
-
previewButton
|
|
1710
|
-
trigger
|
|
1711
|
+
private base;
|
|
1712
|
+
private input;
|
|
1713
|
+
private dropdown;
|
|
1714
|
+
private previewButton;
|
|
1715
|
+
private trigger;
|
|
1711
1716
|
private hasFocus;
|
|
1712
1717
|
private isDraggingGridHandle;
|
|
1713
1718
|
private isEmpty;
|
|
@@ -1808,8 +1813,11 @@ declare class FlowColorPicker extends FlowRdfElement implements FlowRdfFormContr
|
|
|
1808
1813
|
/** Generates a hex string from HSV values. Hue must be 0-360. All other arguments must be 0-100. */
|
|
1809
1814
|
private getHexString;
|
|
1810
1815
|
private stopNestedEventPropagation;
|
|
1816
|
+
/** @internal */
|
|
1811
1817
|
handleFormatChange(): void;
|
|
1818
|
+
/** @internal */
|
|
1812
1819
|
handleOpacityChange(): void;
|
|
1820
|
+
/** @internal */
|
|
1813
1821
|
handleValueChange(oldValue: string | undefined, newValue: string): void;
|
|
1814
1822
|
/** Sets focus on the color picker. */
|
|
1815
1823
|
focus(options?: FocusOptions): void;
|
|
@@ -1827,109 +1835,700 @@ declare class FlowColorPicker extends FlowRdfElement implements FlowRdfFormContr
|
|
|
1827
1835
|
setCustomValidity(message: string): void;
|
|
1828
1836
|
render(): lit.TemplateResult<1>;
|
|
1829
1837
|
}
|
|
1838
|
+
|
|
1830
1839
|
declare global {
|
|
1831
1840
|
interface HTMLElementTagNameMap {
|
|
1832
1841
|
'flow-ui-color-picker': FlowColorPicker;
|
|
1833
1842
|
}
|
|
1834
1843
|
}
|
|
1835
1844
|
|
|
1836
|
-
|
|
1837
|
-
|
|
1838
|
-
|
|
1839
|
-
|
|
1840
|
-
|
|
1841
|
-
|
|
1842
|
-
|
|
1843
|
-
|
|
1844
|
-
|
|
1845
|
-
|
|
1846
|
-
|
|
1847
|
-
|
|
1848
|
-
|
|
1849
|
-
|
|
1850
|
-
|
|
1851
|
-
|
|
1852
|
-
|
|
1853
|
-
|
|
1854
|
-
|
|
1855
|
-
|
|
1856
|
-
|
|
1845
|
+
interface StringColorStopOptions {
|
|
1846
|
+
type: 'string';
|
|
1847
|
+
}
|
|
1848
|
+
interface NumberColorStopOptions {
|
|
1849
|
+
type: 'number';
|
|
1850
|
+
min?: number;
|
|
1851
|
+
max?: number;
|
|
1852
|
+
step?: number;
|
|
1853
|
+
units?: string;
|
|
1854
|
+
}
|
|
1855
|
+
interface SelectColorStopOptions {
|
|
1856
|
+
type: 'select';
|
|
1857
|
+
options: Array<string | {
|
|
1858
|
+
value: string;
|
|
1859
|
+
name?: string;
|
|
1860
|
+
}>;
|
|
1861
|
+
}
|
|
1862
|
+
type ColorStopOptions = StringColorStopOptions | NumberColorStopOptions | SelectColorStopOptions;
|
|
1863
|
+
interface ColorStopValue {
|
|
1864
|
+
value: string | number;
|
|
1865
|
+
color: string;
|
|
1866
|
+
options?: {
|
|
1867
|
+
regex: boolean;
|
|
1868
|
+
caseSensitive: boolean;
|
|
1857
1869
|
};
|
|
1858
|
-
private readonly localize;
|
|
1859
|
-
/** The tag's theme variant. */
|
|
1860
|
-
variant: 'primary' | 'success' | 'neutral' | 'warning' | 'danger' | 'text';
|
|
1861
|
-
/** The tag's size. */
|
|
1862
|
-
size: 'small' | 'medium' | 'large';
|
|
1863
|
-
/** Draws a pill-style tag with rounded edges. */
|
|
1864
|
-
pill: boolean;
|
|
1865
|
-
/** Makes the tag removable and shows a remove button. */
|
|
1866
|
-
removable: boolean;
|
|
1867
|
-
private handleRemoveClick;
|
|
1868
|
-
render(): lit.TemplateResult<1>;
|
|
1869
1870
|
}
|
|
1870
|
-
|
|
1871
|
-
|
|
1872
|
-
|
|
1873
|
-
|
|
1874
|
-
|
|
1871
|
+
interface BaseColorMapperField {
|
|
1872
|
+
name?: string;
|
|
1873
|
+
field: string;
|
|
1874
|
+
}
|
|
1875
|
+
interface StringColorMapperField extends StringColorStopOptions, BaseColorMapperField {
|
|
1876
|
+
type: 'string';
|
|
1877
|
+
}
|
|
1878
|
+
interface NumberColorMapperField extends NumberColorStopOptions, BaseColorMapperField {
|
|
1879
|
+
type: 'number';
|
|
1880
|
+
}
|
|
1881
|
+
interface SelectColorMapperField extends SelectColorStopOptions, BaseColorMapperField {
|
|
1882
|
+
type: 'select';
|
|
1883
|
+
}
|
|
1884
|
+
type ColorMapperField = StringColorMapperField | NumberColorMapperField | SelectColorMapperField;
|
|
1885
|
+
interface ColorMapperOptions {
|
|
1886
|
+
fields: Record<string, ColorMapperField>;
|
|
1887
|
+
}
|
|
1888
|
+
interface ColorMapperValue {
|
|
1889
|
+
mode: 'fixed' | 'data-driven';
|
|
1890
|
+
field: string | undefined;
|
|
1891
|
+
type?: 'string' | 'number' | 'select';
|
|
1892
|
+
defaultColor?: string;
|
|
1893
|
+
colorStops: ColorStopValue[];
|
|
1875
1894
|
}
|
|
1876
1895
|
|
|
1877
|
-
|
|
1878
|
-
|
|
1879
|
-
|
|
1880
|
-
|
|
1881
|
-
|
|
1882
|
-
|
|
1883
|
-
|
|
1884
|
-
|
|
1885
|
-
|
|
1886
|
-
|
|
1887
|
-
|
|
1888
|
-
displayLabel: string;
|
|
1889
|
-
/** The name of the select, submitted as a name/value pair with form data. */
|
|
1890
|
-
name: string;
|
|
1891
|
-
value: string;
|
|
1892
|
-
displayMode: 'date' | 'time' | 'datetime';
|
|
1893
|
-
format: string;
|
|
1894
|
-
timezone?: string;
|
|
1895
|
-
locale?: string;
|
|
1896
|
-
/** The default value of the form control. Primarily used for resetting the form control. */
|
|
1897
|
-
defaultValue: string;
|
|
1898
|
-
/** The select's size. */
|
|
1899
|
-
size: 'small' | 'medium' | 'large';
|
|
1900
|
-
/** Placeholder text to show as a hint when the select is empty. */
|
|
1901
|
-
placeholder: string;
|
|
1902
|
-
/** Disables the select control. */
|
|
1903
|
-
disabled: boolean;
|
|
1904
|
-
/** Adds a clear button when the select is not empty. */
|
|
1905
|
-
clearable: boolean;
|
|
1906
|
-
/**
|
|
1907
|
-
* Indicates whether or not the select is open. You can toggle this attribute to show and hide the menu, or you can
|
|
1908
|
-
* use the `show()` and `hide()` methods and this attribute will reflect the select's open state.
|
|
1909
|
-
*/
|
|
1910
|
-
open: boolean;
|
|
1911
|
-
/**
|
|
1912
|
-
* Enable this option to prevent the listbox from being clipped when the component is placed inside a container with
|
|
1913
|
-
* `overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.
|
|
1914
|
-
*/
|
|
1915
|
-
hoist: boolean;
|
|
1916
|
-
/** Draws a filled select. */
|
|
1917
|
-
filled: boolean;
|
|
1918
|
-
/** Draws a pill-style select with rounded edges. */
|
|
1919
|
-
pill: boolean;
|
|
1920
|
-
/** The select's label. If you need to display HTML, use the `label` slot instead. */
|
|
1921
|
-
label: string;
|
|
1896
|
+
interface FormControlControllerOptions {
|
|
1897
|
+
/** A function that returns the form containing the form control. */
|
|
1898
|
+
form: (input: FlowRdfFormControl) => HTMLFormElement | null;
|
|
1899
|
+
/** A function that returns the form control's name, which will be submitted with the form data. */
|
|
1900
|
+
name: (input: FlowRdfFormControl) => string;
|
|
1901
|
+
/** A function that returns the form control's current value. */
|
|
1902
|
+
value: (input: FlowRdfFormControl) => unknown | unknown[];
|
|
1903
|
+
/** A function that returns the form control's default value. */
|
|
1904
|
+
defaultValue: (input: FlowRdfFormControl) => unknown | unknown[];
|
|
1905
|
+
/** A function that returns the form control's current disabled state. If disabled, the value won't be submitted. */
|
|
1906
|
+
disabled: (input: FlowRdfFormControl) => boolean;
|
|
1922
1907
|
/**
|
|
1923
|
-
*
|
|
1924
|
-
*
|
|
1908
|
+
* A function that maps to the form control's reportValidity() function. When the control is invalid, this will
|
|
1909
|
+
* prevent submission and trigger the browser's constraint violation warning.
|
|
1925
1910
|
*/
|
|
1926
|
-
|
|
1927
|
-
/**
|
|
1928
|
-
|
|
1911
|
+
reportValidity: (input: FlowRdfFormControl) => boolean;
|
|
1912
|
+
/** A function that sets the form control's value */
|
|
1913
|
+
setValue: (input: FlowRdfFormControl, value: unknown) => void;
|
|
1929
1914
|
/**
|
|
1930
|
-
*
|
|
1931
|
-
*
|
|
1932
|
-
|
|
1915
|
+
* An array of event names to listen to. When all events in the list are emitted, the control will receive validity
|
|
1916
|
+
* states such as user-valid and user-invalid.user interacted validity states. */
|
|
1917
|
+
assumeInteractionOn: string[];
|
|
1918
|
+
}
|
|
1919
|
+
/** A reactive controller to allow form controls to participate in form submission, validation, etc. */
|
|
1920
|
+
declare class FormControlController implements ReactiveController {
|
|
1921
|
+
host: FlowRdfFormControl & ReactiveControllerHost;
|
|
1922
|
+
form?: HTMLFormElement | null;
|
|
1923
|
+
options: FormControlControllerOptions;
|
|
1924
|
+
constructor(host: ReactiveControllerHost & FlowRdfFormControl, options?: Partial<FormControlControllerOptions>);
|
|
1925
|
+
hostConnected(): void;
|
|
1926
|
+
hostDisconnected(): void;
|
|
1927
|
+
hostUpdated(): void;
|
|
1928
|
+
private attachForm;
|
|
1929
|
+
private detachForm;
|
|
1930
|
+
private handleFormData;
|
|
1931
|
+
private handleFormSubmit;
|
|
1932
|
+
private handleFormReset;
|
|
1933
|
+
private handleInteraction;
|
|
1934
|
+
private reportFormValidity;
|
|
1935
|
+
private setUserInteracted;
|
|
1936
|
+
private doAction;
|
|
1937
|
+
/** Returns the associated `<form>` element, if one exists. */
|
|
1938
|
+
getForm(): HTMLFormElement | null;
|
|
1939
|
+
/** Resets the form, restoring all the control to their default value */
|
|
1940
|
+
reset(submitter?: HTMLInputElement | FlowButton): void;
|
|
1941
|
+
/** Submits the form, triggering validation and form data injection. */
|
|
1942
|
+
submit(submitter?: HTMLInputElement | FlowButton): void;
|
|
1943
|
+
/**
|
|
1944
|
+
* Synchronously sets the form control's validity. Call this when you know the future validity but need to update
|
|
1945
|
+
* the host element immediately, i.e. before Lit updates the component in the next update.
|
|
1946
|
+
*/
|
|
1947
|
+
setValidity(isValid: boolean): void;
|
|
1948
|
+
/**
|
|
1949
|
+
* Updates the form control's validity based on the current value of `host.validity.valid`. Call this when anything
|
|
1950
|
+
* that affects constraint validation changes so the component receives the correct validity states.
|
|
1951
|
+
*/
|
|
1952
|
+
updateValidity(): void;
|
|
1953
|
+
/**
|
|
1954
|
+
* Dispatches a non-bubbling, cancelable custom event of type `flow-ui-invalid`.
|
|
1955
|
+
* If the `flow-ui-invalid` event will be cancelled then the original `invalid`
|
|
1956
|
+
* event (which may have been passed as argument) will also be cancelled.
|
|
1957
|
+
* If no original `invalid` event has been passed then the `flow-ui-invalid`
|
|
1958
|
+
* event will be cancelled before being dispatched.
|
|
1959
|
+
*/
|
|
1960
|
+
emitInvalidEvent(originalInvalidEvent?: Event): void;
|
|
1961
|
+
}
|
|
1962
|
+
|
|
1963
|
+
/**
|
|
1964
|
+
* @tagname flow-ui-radio-group
|
|
1965
|
+
* @summary Radio groups are used to group multiple [radios](/components/radio) or [radio buttons](/components/radio-button) so they function as a single form control.
|
|
1966
|
+
*
|
|
1967
|
+
* @dependency flow-ui-button-group
|
|
1968
|
+
*
|
|
1969
|
+
* @slot - The default slot where `<flow-ui-radio>` or `<flow-ui-tool-button>` elements are placed.
|
|
1970
|
+
* @slot label - The radio group's label. Required for proper accessibility. Alternatively, you can use the `label`
|
|
1971
|
+
* attribute.
|
|
1972
|
+
*
|
|
1973
|
+
* @event flow-ui-change - Emitted when the radio group's selected value changes.
|
|
1974
|
+
* @event flow-ui-input - Emitted when the radio group receives user input.
|
|
1975
|
+
* @event flow-ui-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.
|
|
1976
|
+
*
|
|
1977
|
+
* @csspart form-control - The form control that wraps the label, input, and help text.
|
|
1978
|
+
* @csspart form-control-label - The label's wrapper.
|
|
1979
|
+
* @csspart form-control-input - The input's wrapper.
|
|
1980
|
+
* @csspart form-control-help-text - The help text's wrapper.
|
|
1981
|
+
* @csspart button-group - The button group that wraps radio buttons.
|
|
1982
|
+
* @csspart button-group__base - The button group's `base` part.
|
|
1983
|
+
*/
|
|
1984
|
+
declare class FlowRadioGroup extends FlowRdfElement implements FlowRdfFormControl {
|
|
1985
|
+
static styles: CSSResultGroup;
|
|
1986
|
+
protected readonly formControlController: FormControlController;
|
|
1987
|
+
private readonly hasSlotController;
|
|
1988
|
+
private customValidityMessage;
|
|
1989
|
+
private validationTimeout;
|
|
1990
|
+
defaultSlot: HTMLSlotElement;
|
|
1991
|
+
validationInput: HTMLInputElement;
|
|
1992
|
+
private errorMessage;
|
|
1993
|
+
defaultValue: string;
|
|
1994
|
+
/**
|
|
1995
|
+
* The radio group's label. Required for proper accessibility. If you need to display HTML, use the `label` slot
|
|
1996
|
+
* instead.
|
|
1997
|
+
*/
|
|
1998
|
+
label: string;
|
|
1999
|
+
/** The radio groups's help text. If you need to display HTML, use the `help-text` slot instead. */
|
|
2000
|
+
helpText: string;
|
|
2001
|
+
/** The name of the radio group, submitted as a name/value pair with form data. */
|
|
2002
|
+
name: string;
|
|
2003
|
+
/** The current value of the radio group, submitted as a name/value pair with form data. */
|
|
2004
|
+
value: string;
|
|
2005
|
+
/** The radio group's size. This size will be applied to all child radios and radio buttons. */
|
|
2006
|
+
size: 'small' | 'medium' | 'large';
|
|
2007
|
+
/**
|
|
2008
|
+
* By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you
|
|
2009
|
+
* to place the form control outside of a form and associate it with the form that has this `id`. The form must be in
|
|
2010
|
+
* the same document or shadow root for this to work.
|
|
2011
|
+
*/
|
|
2012
|
+
form: string;
|
|
2013
|
+
/** Ensures a child radio is checked before allowing the containing form to submit. */
|
|
2014
|
+
required: boolean;
|
|
2015
|
+
/**
|
|
2016
|
+
* Use vertical layout for the radio group.
|
|
2017
|
+
*/
|
|
2018
|
+
vertical: boolean;
|
|
2019
|
+
/** Gets the validity state object */
|
|
2020
|
+
get validity(): ValidityState;
|
|
2021
|
+
/** Gets the validation message */
|
|
2022
|
+
get validationMessage(): string;
|
|
2023
|
+
connectedCallback(): void;
|
|
2024
|
+
firstUpdated(): void;
|
|
2025
|
+
private getAllRadios;
|
|
2026
|
+
private handleRadioClick;
|
|
2027
|
+
private handleKeyDown;
|
|
2028
|
+
private handleLabelClick;
|
|
2029
|
+
private handleInvalid;
|
|
2030
|
+
private syncRadios;
|
|
2031
|
+
private updateCheckedRadio;
|
|
2032
|
+
handleSizeChange(): void;
|
|
2033
|
+
handleValueChange(): void;
|
|
2034
|
+
/** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */
|
|
2035
|
+
checkValidity(): boolean;
|
|
2036
|
+
/** Gets the associated form, if one exists. */
|
|
2037
|
+
getForm(): HTMLFormElement | null;
|
|
2038
|
+
/** Checks for validity and shows the browser's validation message if the control is invalid. */
|
|
2039
|
+
reportValidity(): boolean;
|
|
2040
|
+
/** Sets a custom validation message. Pass an empty string to restore validity. */
|
|
2041
|
+
setCustomValidity(message?: string): void;
|
|
2042
|
+
render(): lit.TemplateResult<1>;
|
|
2043
|
+
}
|
|
2044
|
+
|
|
2045
|
+
declare global {
|
|
2046
|
+
interface HTMLElementTagNameMap {
|
|
2047
|
+
'flow-ui-radio-group': FlowRadioGroup;
|
|
2048
|
+
}
|
|
2049
|
+
}
|
|
2050
|
+
|
|
2051
|
+
/**
|
|
2052
|
+
*
|
|
2053
|
+
* @tagname flow-ui-radio
|
|
2054
|
+
* @summary Radios allow the user to select a single option from a group.
|
|
2055
|
+
*
|
|
2056
|
+
* @dependency flow-ui-icon
|
|
2057
|
+
*
|
|
2058
|
+
* @slot - The radio's label.
|
|
2059
|
+
*
|
|
2060
|
+
* @event flow-ui-blur - Emitted when the control loses focus.
|
|
2061
|
+
* @event flow-ui-focus - Emitted when the control gains focus.
|
|
2062
|
+
*
|
|
2063
|
+
* @csspart base - The component's base wrapper.
|
|
2064
|
+
* @csspart control - The circular container that wraps the radio's checked state.
|
|
2065
|
+
* @csspart control--checked - The radio control when the radio is checked.
|
|
2066
|
+
* @csspart checked-icon - The checked icon, an `<flow-ui-icon>` element.
|
|
2067
|
+
* @csspart label - The container that wraps the radio's label.
|
|
2068
|
+
*/
|
|
2069
|
+
declare class FlowRadio extends FlowRdfElement {
|
|
2070
|
+
static styles: CSSResultGroup;
|
|
2071
|
+
checked: boolean;
|
|
2072
|
+
protected hasFocus: boolean;
|
|
2073
|
+
/** The radio's value. When selected, the radio group will receive this value. */
|
|
2074
|
+
value: string;
|
|
2075
|
+
/**
|
|
2076
|
+
* The radio's size. When used inside a radio group, the size will be determined by the radio group's size so this
|
|
2077
|
+
* attribute can typically be omitted.
|
|
2078
|
+
*/
|
|
2079
|
+
size: 'small' | 'medium' | 'large';
|
|
2080
|
+
/** Disables the radio. */
|
|
2081
|
+
disabled: boolean;
|
|
2082
|
+
connectedCallback(): void;
|
|
2083
|
+
disconnectedCallback(): void;
|
|
2084
|
+
private addEventListeners;
|
|
2085
|
+
private removeEventListeners;
|
|
2086
|
+
private handleBlur;
|
|
2087
|
+
private handleClick;
|
|
2088
|
+
private handleFocus;
|
|
2089
|
+
private setInitialAttributes;
|
|
2090
|
+
handleCheckedChange(): void;
|
|
2091
|
+
handleDisabledChange(): void;
|
|
2092
|
+
render(): lit.TemplateResult<1>;
|
|
2093
|
+
}
|
|
2094
|
+
|
|
2095
|
+
declare global {
|
|
2096
|
+
interface HTMLElementTagNameMap {
|
|
2097
|
+
'flow-ui-radio': FlowRadio;
|
|
2098
|
+
}
|
|
2099
|
+
}
|
|
2100
|
+
|
|
2101
|
+
/**
|
|
2102
|
+
* @tagname flow-ui-option
|
|
2103
|
+
* @summary Options define the selectable items within various form controls such as [select](/components/select).
|
|
2104
|
+
*
|
|
2105
|
+
* @dependency flow-ui-icon
|
|
2106
|
+
*
|
|
2107
|
+
* @slot - The option's label.
|
|
2108
|
+
* @slot prefix - Used to prepend an icon or similar element to the menu item.
|
|
2109
|
+
* @slot suffix - Used to append an icon or similar element to the menu item.
|
|
2110
|
+
*
|
|
2111
|
+
* @csspart checked-icon - The checked icon, a `<flow-ui-icon>` element.
|
|
2112
|
+
* @csspart base - The component's base wrapper.
|
|
2113
|
+
* @csspart label - The option's label.
|
|
2114
|
+
* @csspart prefix - The container that wraps the prefix.
|
|
2115
|
+
* @csspart suffix - The container that wraps the suffix.
|
|
2116
|
+
*/
|
|
2117
|
+
declare class FlowOption extends FlowRdfElement {
|
|
2118
|
+
static styles: CSSResultGroup;
|
|
2119
|
+
static dependencies: {
|
|
2120
|
+
'flow-ui-icon': typeof FlowIcon;
|
|
2121
|
+
};
|
|
2122
|
+
private cachedTextLabel;
|
|
2123
|
+
private readonly localize;
|
|
2124
|
+
defaultSlot: HTMLSlotElement;
|
|
2125
|
+
current: boolean;
|
|
2126
|
+
selected: boolean;
|
|
2127
|
+
hasHover: boolean;
|
|
2128
|
+
/**
|
|
2129
|
+
* The option's value. When selected, the containing form control will receive this value. The value must be unique
|
|
2130
|
+
* from other options in the same group. Values may not contain spaces, as spaces are used as delimiters when listing
|
|
2131
|
+
* multiple values.
|
|
2132
|
+
*/
|
|
2133
|
+
value: string;
|
|
2134
|
+
/** Draws the option in a disabled state, preventing selection. */
|
|
2135
|
+
disabled: boolean;
|
|
2136
|
+
connectedCallback(): void;
|
|
2137
|
+
private handleDefaultSlotChange;
|
|
2138
|
+
private handleMouseEnter;
|
|
2139
|
+
private handleMouseLeave;
|
|
2140
|
+
handleDisabledChange(): void;
|
|
2141
|
+
handleSelectedChange(): void;
|
|
2142
|
+
handleValueChange(): void;
|
|
2143
|
+
/** Returns a plain text label based on the option's content. */
|
|
2144
|
+
getTextLabel(): string;
|
|
2145
|
+
render(): lit.TemplateResult<1>;
|
|
2146
|
+
}
|
|
2147
|
+
|
|
2148
|
+
/**
|
|
2149
|
+
* @summary Tags are used as labels to organize things or to indicate a selection.
|
|
2150
|
+
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tag
|
|
2151
|
+
* @status stable
|
|
2152
|
+
* @since 2.0
|
|
2153
|
+
*
|
|
2154
|
+
* @dependency flow-ui-icon-button
|
|
2155
|
+
*
|
|
2156
|
+
* @slot - The tag's content.
|
|
2157
|
+
*
|
|
2158
|
+
* @event flow-ui-remove - Emitted when the remove button is activated.
|
|
2159
|
+
*
|
|
2160
|
+
* @csspart base - The component's base wrapper.
|
|
2161
|
+
* @csspart content - The tag's content.
|
|
2162
|
+
* @csspart remove-button - The tag's remove button, an `<flow-ui-icon-button>`.
|
|
2163
|
+
* @csspart remove-button__base - The remove button's exported `base` part.
|
|
2164
|
+
*/
|
|
2165
|
+
declare class FlowTag extends FlowRdfElement {
|
|
2166
|
+
static styles: CSSResultGroup;
|
|
2167
|
+
static dependencies: {
|
|
2168
|
+
'flow-icon-button': typeof FlowIconButton;
|
|
2169
|
+
};
|
|
2170
|
+
private readonly localize;
|
|
2171
|
+
/** The tag's theme variant. */
|
|
2172
|
+
variant: 'primary' | 'success' | 'neutral' | 'warning' | 'danger' | 'text';
|
|
2173
|
+
/** The tag's size. */
|
|
2174
|
+
size: 'small' | 'medium' | 'large';
|
|
2175
|
+
/** Draws a pill-style tag with rounded edges. */
|
|
2176
|
+
pill: boolean;
|
|
2177
|
+
/** Makes the tag removable and shows a remove button. */
|
|
2178
|
+
removable: boolean;
|
|
2179
|
+
private handleRemoveClick;
|
|
2180
|
+
render(): lit.TemplateResult<1>;
|
|
2181
|
+
}
|
|
2182
|
+
|
|
2183
|
+
/**
|
|
2184
|
+
* @summary Selects allow you to choose items from a menu of predefined options.
|
|
2185
|
+
* @documentation https://shoelace.style/components/select
|
|
2186
|
+
* @status stable
|
|
2187
|
+
* @since 2.0
|
|
2188
|
+
*
|
|
2189
|
+
* @dependency flow-icon
|
|
2190
|
+
* @dependency flow-popup
|
|
2191
|
+
* @dependency flow-tag
|
|
2192
|
+
*
|
|
2193
|
+
* @slot - The listbox options. Must be `<flow-option>` elements. You can use `<flow-divider>` to group items visually.
|
|
2194
|
+
* @slot label - The input's label. Alternatively, you can use the `label` attribute.
|
|
2195
|
+
* @slot prefix - Used to prepend a presentational icon or similar element to the combobox.
|
|
2196
|
+
* @slot suffix - Used to append a presentational icon or similar element to the combobox.
|
|
2197
|
+
* @slot clear-icon - An icon to use in lieu of the default clear icon.
|
|
2198
|
+
* @slot expand-icon - The icon to show when the control is expanded and collapsed. Rotates on open and close.
|
|
2199
|
+
* @slot help-text - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.
|
|
2200
|
+
*
|
|
2201
|
+
* @event flow-ui-change - Emitted when the control's value changes.
|
|
2202
|
+
* @event flow-ui-clear - Emitted when the control's value is cleared.
|
|
2203
|
+
* @event flow-ui-input - Emitted when the control receives input.
|
|
2204
|
+
* @event flow-ui-focus - Emitted when the control gains focus.
|
|
2205
|
+
* @event flow-ui-blur - Emitted when the control loses focus.
|
|
2206
|
+
* @event flow-ui-show - Emitted when the select's menu opens.
|
|
2207
|
+
* @event flow-ui-after-show - Emitted after the select's menu opens and all animations are complete.
|
|
2208
|
+
* @event flow-ui-hide - Emitted when the select's menu closes.
|
|
2209
|
+
* @event flow-ui-after-hide - Emitted after the select's menu closes and all animations are complete.
|
|
2210
|
+
* @event flow-ui-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.
|
|
2211
|
+
*
|
|
2212
|
+
* @csspart form-control - The form control that wraps the label, input, and help text.
|
|
2213
|
+
* @csspart form-control-label - The label's wrapper.
|
|
2214
|
+
* @csspart form-control-input - The select's wrapper.
|
|
2215
|
+
* @csspart form-control-help-text - The help text's wrapper.
|
|
2216
|
+
* @csspart combobox - The container the wraps the prefix, suffix, combobox, clear icon, and expand button.
|
|
2217
|
+
* @csspart prefix - The container that wraps the prefix slot.
|
|
2218
|
+
* @csspart suffix - The container that wraps the suffix slot.
|
|
2219
|
+
* @csspart display-input - The element that displays the selected option's label, an `<input>` element.
|
|
2220
|
+
* @csspart listbox - The listbox container where options are slotted.
|
|
2221
|
+
* @csspart tags - The container that houses option tags when `multiselect` is used.
|
|
2222
|
+
* @csspart tag - The individual tags that represent each multiselect option.
|
|
2223
|
+
* @csspart tag__base - The tag's base part.
|
|
2224
|
+
* @csspart tag__content - The tag's content part.
|
|
2225
|
+
* @csspart tag__remove-button - The tag's remove button.
|
|
2226
|
+
* @csspart tag__remove-button__base - The tag's remove button base part.
|
|
2227
|
+
* @csspart clear-button - The clear button.
|
|
2228
|
+
* @csspart expand-icon - The container that wraps the expand icon.
|
|
2229
|
+
*/
|
|
2230
|
+
declare class FlowSelect extends FlowRdfElement implements FlowRdfFormControl {
|
|
2231
|
+
static styles: CSSResultGroup;
|
|
2232
|
+
static dependencies: {
|
|
2233
|
+
'flow-icon': typeof FlowIcon;
|
|
2234
|
+
'flow-popup': typeof SlPopup;
|
|
2235
|
+
'flow-tag': typeof FlowTag;
|
|
2236
|
+
};
|
|
2237
|
+
private readonly formControlController;
|
|
2238
|
+
private readonly hasSlotController;
|
|
2239
|
+
private readonly localize;
|
|
2240
|
+
private typeToSelectString;
|
|
2241
|
+
private typeToSelectTimeout;
|
|
2242
|
+
private closeWatcher;
|
|
2243
|
+
private mutationObserver;
|
|
2244
|
+
popup: SlPopup;
|
|
2245
|
+
combobox: HTMLSlotElement;
|
|
2246
|
+
displayInput: HTMLInputElement;
|
|
2247
|
+
valueInput: HTMLInputElement;
|
|
2248
|
+
listbox: HTMLSlotElement;
|
|
2249
|
+
private hasFocus;
|
|
2250
|
+
displayLabel: string;
|
|
2251
|
+
currentOption: FlowOption;
|
|
2252
|
+
selectedOptions: FlowOption[];
|
|
2253
|
+
/** The name of the select, submitted as a name/value pair with form data. */
|
|
2254
|
+
name: string;
|
|
2255
|
+
/**
|
|
2256
|
+
* The current value of the select, submitted as a name/value pair with form data. When `multiple` is enabled, the
|
|
2257
|
+
* value attribute will be a space-delimited list of values based on the options selected, and the value property will
|
|
2258
|
+
* be an array. **For this reason, values must not contain spaces.**
|
|
2259
|
+
*/
|
|
2260
|
+
value: string | string[];
|
|
2261
|
+
/** The default value of the form control. Primarily used for resetting the form control. */
|
|
2262
|
+
defaultValue: string | string[];
|
|
2263
|
+
/** The select's size. */
|
|
2264
|
+
size: 'small' | 'medium' | 'large';
|
|
2265
|
+
/** Placeholder text to show as a hint when the select is empty. */
|
|
2266
|
+
placeholder: string;
|
|
2267
|
+
/** Allows more than one option to be selected. */
|
|
2268
|
+
multiple: boolean;
|
|
2269
|
+
/**
|
|
2270
|
+
* The maximum number of selected options to show when `multiple` is true. After the maximum, "+n" will be shown to
|
|
2271
|
+
* indicate the number of additional items that are selected. Set to 0 to remove the limit.
|
|
2272
|
+
*/
|
|
2273
|
+
maxOptionsVisible: number;
|
|
2274
|
+
/** Disables the select control. */
|
|
2275
|
+
disabled: boolean;
|
|
2276
|
+
/** Adds a clear button when the select is not empty. */
|
|
2277
|
+
clearable: boolean;
|
|
2278
|
+
/**
|
|
2279
|
+
* Indicates whether or not the select is open. You can toggle this attribute to show and hide the menu, or you can
|
|
2280
|
+
* use the `show()` and `hide()` methods and this attribute will reflect the select's open state.
|
|
2281
|
+
*/
|
|
2282
|
+
open: boolean;
|
|
2283
|
+
/**
|
|
2284
|
+
* Enable this option to prevent the listbox from being clipped when the component is placed inside a container with
|
|
2285
|
+
* `overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.
|
|
2286
|
+
*/
|
|
2287
|
+
hoist: boolean;
|
|
2288
|
+
/** Draws a filled select. */
|
|
2289
|
+
filled: boolean;
|
|
2290
|
+
/** Draws a pill-style select with rounded edges. */
|
|
2291
|
+
pill: boolean;
|
|
2292
|
+
/** The select's label. If you need to display HTML, use the `label` slot instead. */
|
|
2293
|
+
label: string;
|
|
2294
|
+
/**
|
|
2295
|
+
* The preferred placement of the select's menu. Note that the actual placement may vary as needed to keep the listbox
|
|
2296
|
+
* inside of the viewport.
|
|
2297
|
+
*/
|
|
2298
|
+
placement: 'top' | 'bottom';
|
|
2299
|
+
/** The select's help text. If you need to display HTML, use the `help-text` slot instead. */
|
|
2300
|
+
helpText: string;
|
|
2301
|
+
/**
|
|
2302
|
+
* By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you
|
|
2303
|
+
* to place the form control outside of a form and associate it with the form that has this `id`. The form must be in
|
|
2304
|
+
* the same document or shadow root for this to work.
|
|
2305
|
+
*/
|
|
2306
|
+
form: string;
|
|
2307
|
+
/** The select's required attribute. */
|
|
2308
|
+
required: boolean;
|
|
2309
|
+
/**
|
|
2310
|
+
* A function that customizes the tags to be rendered when multiple=true. The first argument is the option, the second
|
|
2311
|
+
* is the current tag's index. The function should return either a Lit TemplateResult or a string containing trusted HTML of the symbol to render at
|
|
2312
|
+
* the specified value.
|
|
2313
|
+
*/
|
|
2314
|
+
getTag: (option: FlowOption, index: number) => TemplateResult | string | HTMLElement;
|
|
2315
|
+
/** Gets the validity state object */
|
|
2316
|
+
get validity(): ValidityState;
|
|
2317
|
+
/** Gets the validation message */
|
|
2318
|
+
get validationMessage(): string;
|
|
2319
|
+
connectedCallback(): void;
|
|
2320
|
+
disconnectedCallback(): void;
|
|
2321
|
+
private addOpenListeners;
|
|
2322
|
+
private removeOpenListeners;
|
|
2323
|
+
private handleFocus;
|
|
2324
|
+
private handleBlur;
|
|
2325
|
+
private handleDocumentFocusIn;
|
|
2326
|
+
private handleDocumentKeyDown;
|
|
2327
|
+
private handleDocumentMouseDown;
|
|
2328
|
+
private handleLabelClick;
|
|
2329
|
+
private handleComboboxMouseDown;
|
|
2330
|
+
private handleComboboxKeyDown;
|
|
2331
|
+
private handleClearClick;
|
|
2332
|
+
private handleClearMouseDown;
|
|
2333
|
+
private handleOptionClick;
|
|
2334
|
+
private handleDefaultSlotChange;
|
|
2335
|
+
private handleTagRemove;
|
|
2336
|
+
private getAllOptions;
|
|
2337
|
+
private getFirstOption;
|
|
2338
|
+
private setCurrentOption;
|
|
2339
|
+
private setSelectedOptions;
|
|
2340
|
+
private toggleOptionSelection;
|
|
2341
|
+
private selectionChanged;
|
|
2342
|
+
protected get tags(): TemplateResult<1>[];
|
|
2343
|
+
private handleInvalid;
|
|
2344
|
+
handleDisabledChange(): void;
|
|
2345
|
+
handleValueChange(): void;
|
|
2346
|
+
handleOpenChange(): Promise<void>;
|
|
2347
|
+
/** Shows the listbox. */
|
|
2348
|
+
show(): Promise<void>;
|
|
2349
|
+
/** Hides the listbox. */
|
|
2350
|
+
hide(): Promise<void>;
|
|
2351
|
+
/** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */
|
|
2352
|
+
checkValidity(): boolean;
|
|
2353
|
+
/** Gets the associated form, if one exists. */
|
|
2354
|
+
getForm(): HTMLFormElement | null;
|
|
2355
|
+
/** Checks for validity and shows the browser's validation message if the control is invalid. */
|
|
2356
|
+
reportValidity(): boolean;
|
|
2357
|
+
/** Sets a custom validation message. Pass an empty string to restore validity. */
|
|
2358
|
+
setCustomValidity(message: string): void;
|
|
2359
|
+
/** Sets focus on the control. */
|
|
2360
|
+
focus(options?: FocusOptions): void;
|
|
2361
|
+
/** Removes focus from the control. */
|
|
2362
|
+
blur(): void;
|
|
2363
|
+
render(): TemplateResult<1>;
|
|
2364
|
+
}
|
|
2365
|
+
|
|
2366
|
+
declare global {
|
|
2367
|
+
interface HTMLElementTagNameMap {
|
|
2368
|
+
'flow-ui-select': FlowSelect;
|
|
2369
|
+
}
|
|
2370
|
+
}
|
|
2371
|
+
|
|
2372
|
+
/**
|
|
2373
|
+
* @tagname flow-ui-color-mapper
|
|
2374
|
+
* @summary A component for defining mappings between data values and colors.
|
|
2375
|
+
*
|
|
2376
|
+
*/
|
|
2377
|
+
declare class FlowColorMapper extends FlowRdfElement {
|
|
2378
|
+
static styles: CSSResultGroup;
|
|
2379
|
+
private currentField?;
|
|
2380
|
+
private readonly hasSlotController;
|
|
2381
|
+
private modeRadioGroup;
|
|
2382
|
+
private fixedColorPicker;
|
|
2383
|
+
private fieldSelect;
|
|
2384
|
+
private infoDialog;
|
|
2385
|
+
field: string;
|
|
2386
|
+
options: ColorMapperOptions;
|
|
2387
|
+
value: ColorMapperValue;
|
|
2388
|
+
size: 'small' | 'medium' | 'large';
|
|
2389
|
+
defaultColorStop: boolean;
|
|
2390
|
+
/**
|
|
2391
|
+
* One or more predefined color swatches to display as presets in the color picker. Can include any format the color
|
|
2392
|
+
* picker can parse, including HEX(A), RGB(A), HSL(A), HSV(A), and CSS color names. Each color must be separated by a
|
|
2393
|
+
* semicolon (`;`). Alternatively, you can pass an array of color values to this property using JavaScript.
|
|
2394
|
+
*/
|
|
2395
|
+
swatches: string | string[];
|
|
2396
|
+
private handleFixedPickerClick;
|
|
2397
|
+
private handleChange;
|
|
2398
|
+
private emitChange;
|
|
2399
|
+
private handleColorStopRemove;
|
|
2400
|
+
private getAllColorStops;
|
|
2401
|
+
private getColorStopPlaceholder;
|
|
2402
|
+
private fixedColorTemplate;
|
|
2403
|
+
private dataDrivenColorTemplate;
|
|
2404
|
+
private colorStopsTemplate;
|
|
2405
|
+
private infoDialogTemplate;
|
|
2406
|
+
render(): lit.TemplateResult<1>;
|
|
2407
|
+
}
|
|
2408
|
+
|
|
2409
|
+
declare global {
|
|
2410
|
+
interface HTMLElementTagNameMap {
|
|
2411
|
+
'flow-ui-color-mapper': FlowColorMapper;
|
|
2412
|
+
}
|
|
2413
|
+
}
|
|
2414
|
+
|
|
2415
|
+
/**
|
|
2416
|
+
* @tagname flow-ui-color-stop
|
|
2417
|
+
* @summary A single color stop used by the `flow-ui-color-mapper` component.
|
|
2418
|
+
*
|
|
2419
|
+
*/
|
|
2420
|
+
declare class FlowColorStopComponent extends FlowRdfElement implements FlowRdfFormControl {
|
|
2421
|
+
static styles: CSSResultGroup;
|
|
2422
|
+
private readonly formControlController;
|
|
2423
|
+
private input;
|
|
2424
|
+
private picker;
|
|
2425
|
+
private textOptions;
|
|
2426
|
+
/** The name of the color stop, submitted as a name/value pair with form data. */
|
|
2427
|
+
name: string;
|
|
2428
|
+
/**
|
|
2429
|
+
* By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you
|
|
2430
|
+
* to place the form control outside of a form and associate it with the form that has this `id`. The form must be in
|
|
2431
|
+
* the same document or shadow root for this to work.
|
|
2432
|
+
*/
|
|
2433
|
+
form: string;
|
|
2434
|
+
/** Makes the color stop as a required field. */
|
|
2435
|
+
required: boolean;
|
|
2436
|
+
options: ColorStopOptions;
|
|
2437
|
+
value: ColorStopValue;
|
|
2438
|
+
size: 'small' | 'medium' | 'large';
|
|
2439
|
+
placeholder: boolean;
|
|
2440
|
+
fixed?: string;
|
|
2441
|
+
/**
|
|
2442
|
+
* One or more predefined color swatches to display as presets in the color picker. Can include any format the color
|
|
2443
|
+
* picker can parse, including HEX(A), RGB(A), HSL(A), HSV(A), and CSS color names. Each color must be separated by a
|
|
2444
|
+
* semicolon (`;`). Alternatively, you can pass an array of color values to this property using JavaScript.
|
|
2445
|
+
*/
|
|
2446
|
+
swatches: string | string[];
|
|
2447
|
+
get validity(): ValidityState;
|
|
2448
|
+
get validationMessage(): "" | "Invalid regular expression";
|
|
2449
|
+
checkValidity(): boolean;
|
|
2450
|
+
getForm(): HTMLFormElement | null;
|
|
2451
|
+
reportValidity(): boolean;
|
|
2452
|
+
setCustomValidity(message: string): void;
|
|
2453
|
+
private handleRemove;
|
|
2454
|
+
private handleChange;
|
|
2455
|
+
private emitChange;
|
|
2456
|
+
private validate;
|
|
2457
|
+
private textInputTemplate;
|
|
2458
|
+
private numberInputTemplate;
|
|
2459
|
+
private fixedInputTemplate;
|
|
2460
|
+
private selectInputTemplate;
|
|
2461
|
+
render(): lit.TemplateResult<1>;
|
|
2462
|
+
}
|
|
2463
|
+
|
|
2464
|
+
declare global {
|
|
2465
|
+
interface HTMLElementTagNameMap {
|
|
2466
|
+
'flow-ui-color-stop': FlowColorStopComponent;
|
|
2467
|
+
}
|
|
2468
|
+
}
|
|
2469
|
+
|
|
2470
|
+
declare global {
|
|
2471
|
+
interface HTMLElementTagNameMap {
|
|
2472
|
+
'flow-ui-tag': FlowTag;
|
|
2473
|
+
}
|
|
2474
|
+
}
|
|
2475
|
+
|
|
2476
|
+
declare class FlowDatetimePicker extends FlowRdfElement implements FlowRdfFormControl {
|
|
2477
|
+
static styles: CSSResultGroup;
|
|
2478
|
+
private readonly formControlController;
|
|
2479
|
+
private readonly hasSlotController;
|
|
2480
|
+
private readonly localize;
|
|
2481
|
+
popup: SlPopup;
|
|
2482
|
+
combobox: HTMLSlotElement;
|
|
2483
|
+
displayInput: HTMLInputElement;
|
|
2484
|
+
valueInput: HTMLInputElement;
|
|
2485
|
+
calendarContainer: HTMLDivElement;
|
|
2486
|
+
private hasFocus;
|
|
2487
|
+
displayLabel: string;
|
|
2488
|
+
/** The name of the select, submitted as a name/value pair with form data. */
|
|
2489
|
+
name: string;
|
|
2490
|
+
value: string;
|
|
2491
|
+
displayMode: 'date' | 'time' | 'datetime';
|
|
2492
|
+
format: string;
|
|
2493
|
+
timezone?: string;
|
|
2494
|
+
locale?: string;
|
|
2495
|
+
/** The default value of the form control. Primarily used for resetting the form control. */
|
|
2496
|
+
defaultValue: string;
|
|
2497
|
+
/** The select's size. */
|
|
2498
|
+
size: 'small' | 'medium' | 'large';
|
|
2499
|
+
/** Placeholder text to show as a hint when the select is empty. */
|
|
2500
|
+
placeholder: string;
|
|
2501
|
+
/** Disables the select control. */
|
|
2502
|
+
disabled: boolean;
|
|
2503
|
+
/** Adds a clear button when the select is not empty. */
|
|
2504
|
+
clearable: boolean;
|
|
2505
|
+
/**
|
|
2506
|
+
* Indicates whether or not the select is open. You can toggle this attribute to show and hide the menu, or you can
|
|
2507
|
+
* use the `show()` and `hide()` methods and this attribute will reflect the select's open state.
|
|
2508
|
+
*/
|
|
2509
|
+
open: boolean;
|
|
2510
|
+
/**
|
|
2511
|
+
* Enable this option to prevent the listbox from being clipped when the component is placed inside a container with
|
|
2512
|
+
* `overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.
|
|
2513
|
+
*/
|
|
2514
|
+
hoist: boolean;
|
|
2515
|
+
/** Draws a filled select. */
|
|
2516
|
+
filled: boolean;
|
|
2517
|
+
/** Draws a pill-style select with rounded edges. */
|
|
2518
|
+
pill: boolean;
|
|
2519
|
+
/** The select's label. If you need to display HTML, use the `label` slot instead. */
|
|
2520
|
+
label: string;
|
|
2521
|
+
/**
|
|
2522
|
+
* The preferred placement of the select's menu. Note that the actual placement may vary as needed to keep the listbox
|
|
2523
|
+
* inside of the viewport.
|
|
2524
|
+
*/
|
|
2525
|
+
placement: 'top' | 'top-end' | 'top-start' | 'bottom' | 'bottom-end' | 'bottom-start';
|
|
2526
|
+
/** The select's help text. If you need to display HTML, use the `help-text` slot instead. */
|
|
2527
|
+
helpText: string;
|
|
2528
|
+
/**
|
|
2529
|
+
* By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you
|
|
2530
|
+
* to place the form control outside of a form and associate it with the form that has this `id`. The form must be in
|
|
2531
|
+
* the same document or shadow root for this to work.
|
|
1933
2532
|
*/
|
|
1934
2533
|
form: string;
|
|
1935
2534
|
/** The select's required attribute. */
|
|
@@ -1983,11 +2582,9 @@ declare global {
|
|
|
1983
2582
|
}
|
|
1984
2583
|
|
|
1985
2584
|
/**
|
|
2585
|
+
* @tag flow-ui-details
|
|
1986
2586
|
* @summary Details show a brief summary and expand to show additional content.
|
|
1987
|
-
|
|
1988
|
-
* @status stable
|
|
1989
|
-
* @since 2.0
|
|
1990
|
-
*
|
|
2587
|
+
|
|
1991
2588
|
* @dependency flow-ui-icon
|
|
1992
2589
|
*
|
|
1993
2590
|
* @slot - The details' main content.
|
|
@@ -2035,6 +2632,7 @@ declare class FlowDetails extends FlowRdfElement {
|
|
|
2035
2632
|
hide(): Promise<void>;
|
|
2036
2633
|
render(): lit.TemplateResult<1>;
|
|
2037
2634
|
}
|
|
2635
|
+
|
|
2038
2636
|
declare global {
|
|
2039
2637
|
interface HTMLElementTagNameMap {
|
|
2040
2638
|
'flow-ui-details': FlowDetails;
|
|
@@ -2042,11 +2640,9 @@ declare global {
|
|
|
2042
2640
|
}
|
|
2043
2641
|
|
|
2044
2642
|
/**
|
|
2643
|
+
* @tagname flow-ui-dialog
|
|
2045
2644
|
* @summary Dialogs, sometimes called "modals", appear above the page and require the user's immediate attention.
|
|
2046
|
-
|
|
2047
|
-
* @status stable
|
|
2048
|
-
* @since 2.0
|
|
2049
|
-
*
|
|
2645
|
+
|
|
2050
2646
|
* @dependency flow-ui-icon-button
|
|
2051
2647
|
*
|
|
2052
2648
|
* @slot - The dialog's main content.
|
|
@@ -2125,6 +2721,7 @@ declare class FlowDialog extends FlowRdfElement {
|
|
|
2125
2721
|
hide(): Promise<void>;
|
|
2126
2722
|
render(): lit.TemplateResult<1>;
|
|
2127
2723
|
}
|
|
2724
|
+
|
|
2128
2725
|
declare global {
|
|
2129
2726
|
interface HTMLElementTagNameMap {
|
|
2130
2727
|
'flow-ui-dialog': FlowDialog;
|
|
@@ -2132,10 +2729,8 @@ declare global {
|
|
|
2132
2729
|
}
|
|
2133
2730
|
|
|
2134
2731
|
/**
|
|
2732
|
+
* @tagname flow-ui-divider
|
|
2135
2733
|
* @summary Dividers are used to visually separate or group elements.
|
|
2136
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/divider
|
|
2137
|
-
* @status stable
|
|
2138
|
-
* @since 2.0
|
|
2139
2734
|
*
|
|
2140
2735
|
* @cssproperty --color - The color of the divider.
|
|
2141
2736
|
* @cssproperty --width - The width of the divider.
|
|
@@ -2148,6 +2743,7 @@ declare class FlowDivider extends FlowRdfElement {
|
|
|
2148
2743
|
connectedCallback(): void;
|
|
2149
2744
|
handleVerticalChange(): void;
|
|
2150
2745
|
}
|
|
2746
|
+
|
|
2151
2747
|
declare global {
|
|
2152
2748
|
interface HTMLElementTagNameMap {
|
|
2153
2749
|
'flow-ui-divider': FlowDivider;
|
|
@@ -2155,10 +2751,8 @@ declare global {
|
|
|
2155
2751
|
}
|
|
2156
2752
|
|
|
2157
2753
|
/**
|
|
2754
|
+
* @tagname flow-ui-drawer
|
|
2158
2755
|
* @summary Drawers slide in from a container to expose additional options and information.
|
|
2159
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/drawer
|
|
2160
|
-
* @status stable
|
|
2161
|
-
* @since 2.0
|
|
2162
2756
|
*
|
|
2163
2757
|
* @dependency flow-ui-icon-button
|
|
2164
2758
|
*
|
|
@@ -2253,6 +2847,7 @@ declare class FlowDrawer extends FlowRdfElement {
|
|
|
2253
2847
|
hide(): Promise<void>;
|
|
2254
2848
|
render(): lit.TemplateResult<1>;
|
|
2255
2849
|
}
|
|
2850
|
+
|
|
2256
2851
|
declare global {
|
|
2257
2852
|
interface HTMLElementTagNameMap {
|
|
2258
2853
|
'flow-ui-drawer': FlowDrawer;
|
|
@@ -2409,10 +3004,8 @@ declare global {
|
|
|
2409
3004
|
}
|
|
2410
3005
|
|
|
2411
3006
|
/**
|
|
3007
|
+
* @tagname flow-ui-menu-label
|
|
2412
3008
|
* @summary Menu labels are used to describe a group of menu items.
|
|
2413
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/menu-label
|
|
2414
|
-
* @status stable
|
|
2415
|
-
* @since 2.0
|
|
2416
3009
|
*
|
|
2417
3010
|
* @slot - The menu label's content.
|
|
2418
3011
|
*
|
|
@@ -2422,6 +3015,7 @@ declare class FlowMenuLabel extends FlowRdfElement {
|
|
|
2422
3015
|
static styles: CSSResultGroup;
|
|
2423
3016
|
render(): lit.TemplateResult<1>;
|
|
2424
3017
|
}
|
|
3018
|
+
|
|
2425
3019
|
declare global {
|
|
2426
3020
|
interface HTMLElementTagNameMap {
|
|
2427
3021
|
'flow-ui-menu-label': FlowMenuLabel;
|
|
@@ -2429,145 +3023,47 @@ declare global {
|
|
|
2429
3023
|
}
|
|
2430
3024
|
|
|
2431
3025
|
/**
|
|
3026
|
+
* @tagname flow-ui-mutation-observer
|
|
2432
3027
|
* @summary The Mutation Observer component offers a thin, declarative interface to the [`MutationObserver API`](https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver).
|
|
2433
|
-
*
|
|
2434
|
-
* @
|
|
2435
|
-
*
|
|
2436
|
-
*
|
|
2437
|
-
|
|
2438
|
-
|
|
2439
|
-
|
|
2440
|
-
|
|
2441
|
-
declare class FlowMutationObserver extends FlowRdfElement {
|
|
2442
|
-
static styles: CSSResultGroup;
|
|
2443
|
-
private mutationObserver;
|
|
2444
|
-
/**
|
|
2445
|
-
* Watches for changes to attributes. To watch only specific attributes, separate them by a space, e.g.
|
|
2446
|
-
* `attr="class id title"`. To watch all attributes, use `*`.
|
|
2447
|
-
*/
|
|
2448
|
-
attr: string;
|
|
2449
|
-
/** Indicates whether or not the attribute's previous value should be recorded when monitoring changes. */
|
|
2450
|
-
attrOldValue: boolean;
|
|
2451
|
-
/** Watches for changes to the character data contained within the node. */
|
|
2452
|
-
charData: boolean;
|
|
2453
|
-
/** Indicates whether or not the previous value of the node's text should be recorded. */
|
|
2454
|
-
charDataOldValue: boolean;
|
|
2455
|
-
/** Watches for the addition or removal of new child nodes. */
|
|
2456
|
-
childList: boolean;
|
|
2457
|
-
/** Disables the observer. */
|
|
2458
|
-
disabled: boolean;
|
|
2459
|
-
connectedCallback(): void;
|
|
2460
|
-
disconnectedCallback(): void;
|
|
2461
|
-
private handleMutation;
|
|
2462
|
-
private startObserver;
|
|
2463
|
-
private stopObserver;
|
|
2464
|
-
handleDisabledChange(): void;
|
|
2465
|
-
handleChange(): void;
|
|
2466
|
-
render(): lit.TemplateResult<1>;
|
|
2467
|
-
}
|
|
2468
|
-
declare global {
|
|
2469
|
-
interface HTMLElementTagNameMap {
|
|
2470
|
-
'flow-ui-mutation-observer': FlowMutationObserver;
|
|
2471
|
-
}
|
|
2472
|
-
}
|
|
2473
|
-
|
|
2474
|
-
/**
|
|
2475
|
-
* @tagname flow-ui-number-stepper
|
|
2476
|
-
* @summary Number steppers are specialized input fields for selecting numbers.
|
|
2477
|
-
*/
|
|
2478
|
-
declare class FlowNumberStepper extends FlowRdfElement implements FlowRdfFormControl {
|
|
2479
|
-
static styles: CSSResultGroup;
|
|
2480
|
-
private readonly formControlController;
|
|
2481
|
-
private _input;
|
|
2482
|
-
private _formatter;
|
|
2483
|
-
/** The name of the input, submitted as a name/value pair with form data. */
|
|
2484
|
-
name: string;
|
|
2485
|
-
value: number | '';
|
|
2486
|
-
step: number;
|
|
2487
|
-
min: number;
|
|
2488
|
-
max: number;
|
|
2489
|
-
format: string;
|
|
2490
|
-
size: 'small' | 'medium' | 'large';
|
|
2491
|
-
placeholder: string;
|
|
2492
|
-
/** Gets the validity state object */
|
|
2493
|
-
get validity(): ValidityState;
|
|
2494
|
-
/** Gets the validation message */
|
|
2495
|
-
get validationMessage(): string;
|
|
2496
|
-
/** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */
|
|
2497
|
-
checkValidity(): boolean;
|
|
2498
|
-
/** Gets the associated form, if one exists. */
|
|
2499
|
-
getForm(): HTMLFormElement | null;
|
|
2500
|
-
/** Checks for validity and shows the browser's validation message if the control is invalid. */
|
|
2501
|
-
reportValidity(): boolean;
|
|
2502
|
-
/** Sets a custom validation message. Pass an empty string to restore validity. */
|
|
2503
|
-
setCustomValidity(message: string): void;
|
|
2504
|
-
firstUpdated(): void;
|
|
2505
|
-
connectedCallback(): void;
|
|
2506
|
-
disconnectedCallback(): void;
|
|
2507
|
-
stepUp(emitEvent?: boolean): void;
|
|
2508
|
-
stepDown(emitEvent?: boolean): void;
|
|
2509
|
-
handleValueChange(): Promise<void>;
|
|
2510
|
-
handleFormatChange(): void;
|
|
2511
|
-
private handleInputChange;
|
|
2512
|
-
private clampValue;
|
|
2513
|
-
render(): lit.TemplateResult<1>;
|
|
2514
|
-
}
|
|
2515
|
-
|
|
2516
|
-
declare global {
|
|
2517
|
-
interface HTMLElementTagNameMap {
|
|
2518
|
-
'flow-ui-number-stepper': FlowNumberStepper;
|
|
2519
|
-
}
|
|
2520
|
-
}
|
|
2521
|
-
|
|
2522
|
-
/**
|
|
2523
|
-
* @summary Options define the selectable items within various form controls such as [select](/components/select).
|
|
2524
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/option
|
|
2525
|
-
* @status stable
|
|
2526
|
-
* @since 2.0
|
|
2527
|
-
*
|
|
2528
|
-
* @dependency flow-ui-icon
|
|
2529
|
-
*
|
|
2530
|
-
* @slot - The option's label.
|
|
2531
|
-
* @slot prefix - Used to prepend an icon or similar element to the menu item.
|
|
2532
|
-
* @slot suffix - Used to append an icon or similar element to the menu item.
|
|
2533
|
-
*
|
|
2534
|
-
* @csspart checked-icon - The checked icon, a `<flow-ui-icon>` element.
|
|
2535
|
-
* @csspart base - The component's base wrapper.
|
|
2536
|
-
* @csspart label - The option's label.
|
|
2537
|
-
* @csspart prefix - The container that wraps the prefix.
|
|
2538
|
-
* @csspart suffix - The container that wraps the suffix.
|
|
2539
|
-
*/
|
|
2540
|
-
declare class FlowOption extends FlowRdfElement {
|
|
2541
|
-
static styles: CSSResultGroup;
|
|
2542
|
-
static dependencies: {
|
|
2543
|
-
'flow-ui-icon': typeof FlowIcon;
|
|
2544
|
-
};
|
|
2545
|
-
private cachedTextLabel;
|
|
2546
|
-
private readonly localize;
|
|
2547
|
-
defaultSlot: HTMLSlotElement;
|
|
2548
|
-
current: boolean;
|
|
2549
|
-
selected: boolean;
|
|
2550
|
-
hasHover: boolean;
|
|
3028
|
+
*
|
|
3029
|
+
* @event {{ mutationList: MutationRecord[] }} flow-ui-mutation - Emitted when a mutation occurs.
|
|
3030
|
+
*
|
|
3031
|
+
* @slot - The content to watch for mutations.
|
|
3032
|
+
*/
|
|
3033
|
+
declare class FlowMutationObserver extends FlowRdfElement {
|
|
3034
|
+
static styles: CSSResultGroup;
|
|
3035
|
+
private mutationObserver;
|
|
2551
3036
|
/**
|
|
2552
|
-
*
|
|
2553
|
-
*
|
|
2554
|
-
* multiple values.
|
|
3037
|
+
* Watches for changes to attributes. To watch only specific attributes, separate them by a space, e.g.
|
|
3038
|
+
* `attr="class id title"`. To watch all attributes, use `*`.
|
|
2555
3039
|
*/
|
|
2556
|
-
|
|
2557
|
-
/**
|
|
3040
|
+
attr: string;
|
|
3041
|
+
/** Indicates whether or not the attribute's previous value should be recorded when monitoring changes. */
|
|
3042
|
+
attrOldValue: boolean;
|
|
3043
|
+
/** Watches for changes to the character data contained within the node. */
|
|
3044
|
+
charData: boolean;
|
|
3045
|
+
/** Indicates whether or not the previous value of the node's text should be recorded. */
|
|
3046
|
+
charDataOldValue: boolean;
|
|
3047
|
+
/** Watches for the addition or removal of new child nodes. */
|
|
3048
|
+
childList: boolean;
|
|
3049
|
+
/** Disables the observer. */
|
|
2558
3050
|
disabled: boolean;
|
|
2559
3051
|
connectedCallback(): void;
|
|
2560
|
-
|
|
2561
|
-
private
|
|
2562
|
-
private
|
|
3052
|
+
disconnectedCallback(): void;
|
|
3053
|
+
private handleMutation;
|
|
3054
|
+
private startObserver;
|
|
3055
|
+
private stopObserver;
|
|
2563
3056
|
handleDisabledChange(): void;
|
|
2564
|
-
|
|
2565
|
-
handleValueChange(): void;
|
|
2566
|
-
/** Returns a plain text label based on the option's content. */
|
|
2567
|
-
getTextLabel(): string;
|
|
3057
|
+
handleChange(): void;
|
|
2568
3058
|
render(): lit.TemplateResult<1>;
|
|
2569
3059
|
}
|
|
2570
3060
|
|
|
3061
|
+
declare global {
|
|
3062
|
+
interface HTMLElementTagNameMap {
|
|
3063
|
+
'flow-ui-mutation-observer': FlowMutationObserver;
|
|
3064
|
+
}
|
|
3065
|
+
}
|
|
3066
|
+
|
|
2571
3067
|
declare global {
|
|
2572
3068
|
interface HTMLElementTagNameMap {
|
|
2573
3069
|
'flow-ui-option': FlowOption;
|
|
@@ -2656,10 +3152,8 @@ declare global {
|
|
|
2656
3152
|
}
|
|
2657
3153
|
|
|
2658
3154
|
/**
|
|
3155
|
+
* @tagname flow-ui-progress-bar
|
|
2659
3156
|
* @summary Progress bars are used to show the status of an ongoing operation.
|
|
2660
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/progress-bar
|
|
2661
|
-
* @status stable
|
|
2662
|
-
* @since 2.0
|
|
2663
3157
|
*
|
|
2664
3158
|
* @slot - A label to show inside the progress indicator.
|
|
2665
3159
|
*
|
|
@@ -2683,6 +3177,7 @@ declare class FlowProgressBar extends FlowRdfElement {
|
|
|
2683
3177
|
label: string;
|
|
2684
3178
|
render(): lit.TemplateResult<1>;
|
|
2685
3179
|
}
|
|
3180
|
+
|
|
2686
3181
|
declare global {
|
|
2687
3182
|
interface HTMLElementTagNameMap {
|
|
2688
3183
|
'flow-ui-progress-bar': FlowProgressBar;
|
|
@@ -2690,10 +3185,8 @@ declare global {
|
|
|
2690
3185
|
}
|
|
2691
3186
|
|
|
2692
3187
|
/**
|
|
3188
|
+
* @tagname flow-ui-progress-ring
|
|
2693
3189
|
* @summary Progress rings are used to show the progress of a determinate operation in a circular fashion.
|
|
2694
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/progress-ring
|
|
2695
|
-
* @status stable
|
|
2696
|
-
* @since 2.0
|
|
2697
3190
|
*
|
|
2698
3191
|
* @slot - A label to show inside the ring.
|
|
2699
3192
|
*
|
|
@@ -2719,6 +3212,7 @@ declare class FlowProgressRing extends FlowRdfElement {
|
|
|
2719
3212
|
updated(changedProps: Map<string, unknown>): void;
|
|
2720
3213
|
render(): lit.TemplateResult<1>;
|
|
2721
3214
|
}
|
|
3215
|
+
|
|
2722
3216
|
declare global {
|
|
2723
3217
|
interface HTMLElementTagNameMap {
|
|
2724
3218
|
'flow-ui-progress-ring': FlowProgressRing;
|
|
@@ -2837,9 +3331,12 @@ declare class FlowQueryBuilder extends FlowRdfElement {
|
|
|
2837
3331
|
*/
|
|
2838
3332
|
static registerFieldDefinition<T extends FlowQueryBuilderFieldType>(type: T, fieldDefinition: FlowQueryBuilderFieldDefinition<NoUnion<T>>): void;
|
|
2839
3333
|
/**
|
|
2840
|
-
*
|
|
3334
|
+
* Static helper method to convert a `FlowQueryBuilderRuleSet` to a set of
|
|
3335
|
+
* `where` clauses for inclusion in a Flo.w query definition.
|
|
3336
|
+
|
|
3337
|
+
* @param value A value to test
|
|
2841
3338
|
*/
|
|
2842
|
-
static convertToFlowQuery:
|
|
3339
|
+
static convertToFlowQuery(ruleset: FlowQueryBuilderRuleSet, config: FlowQueryBuilderConfig, options?: FlowQueryBuilderConverterOptions): any;
|
|
2843
3340
|
/**
|
|
2844
3341
|
* Static helper method to determine if supplied argument is
|
|
2845
3342
|
* a `FlowQueryBuilderRule`.
|
|
@@ -2852,7 +3349,6 @@ declare class FlowQueryBuilder extends FlowRdfElement {
|
|
|
2852
3349
|
* a `FlowQueryBuilderRuleSet`.
|
|
2853
3350
|
*
|
|
2854
3351
|
* @param value A value to test
|
|
2855
|
-
* @returns `true` if supplied value is a FlowQueryBuilderRuleSet
|
|
2856
3352
|
*/
|
|
2857
3353
|
static isRuleSet(value: unknown): value is FlowQueryBuilderRuleSet;
|
|
2858
3354
|
/**
|
|
@@ -2862,9 +3358,8 @@ declare class FlowQueryBuilder extends FlowRdfElement {
|
|
|
2862
3358
|
*
|
|
2863
3359
|
* @param ruleset Rule set to filter
|
|
2864
3360
|
* @param options Fields to include or exclude
|
|
2865
|
-
* @returns The filtered rule set
|
|
2866
3361
|
*/
|
|
2867
|
-
static filterRuleSet(
|
|
3362
|
+
static filterRuleSet(ruleSet: FlowQueryBuilderRuleSet, options: {
|
|
2868
3363
|
excludeFields?: string[];
|
|
2869
3364
|
includeFields?: string[];
|
|
2870
3365
|
}): FlowQueryBuilderRuleSet;
|
|
@@ -2873,9 +3368,8 @@ declare class FlowQueryBuilder extends FlowRdfElement {
|
|
|
2873
3368
|
*
|
|
2874
3369
|
* @param ruleSet A `FlowQueryBuilderRuleSet` to rename.
|
|
2875
3370
|
* @param replacements Mapping of string to string for renaming fields.
|
|
2876
|
-
* @returns The renamed rule set.
|
|
2877
3371
|
*/
|
|
2878
|
-
static renameRuleSetFields(
|
|
3372
|
+
static renameRuleSetFields(ruleSet: FlowQueryBuilderRuleSet, replacements: Record<string, string>): FlowQueryBuilderRuleSet;
|
|
2879
3373
|
/**
|
|
2880
3374
|
* Static helper method to recursively apply a transform function to each rule
|
|
2881
3375
|
* in a `FlowQueryBuilderRuleSet`.
|
|
@@ -2889,7 +3383,6 @@ declare class FlowQueryBuilder extends FlowRdfElement {
|
|
|
2889
3383
|
*
|
|
2890
3384
|
* @param ruleSet query builder rule set
|
|
2891
3385
|
* @param transformFn transform function
|
|
2892
|
-
* @returns The modified rule set
|
|
2893
3386
|
*/
|
|
2894
3387
|
static transformRuleSet(ruleSet: FlowQueryBuilderRuleSet, transformFn: (rule: FlowQueryBuilderRule) => FlowQueryBuilderRule | undefined): FlowQueryBuilderRuleSet;
|
|
2895
3388
|
private readonly hasSlotController;
|
|
@@ -2942,219 +3435,9 @@ declare global {
|
|
|
2942
3435
|
}
|
|
2943
3436
|
}
|
|
2944
3437
|
|
|
2945
|
-
interface FormControlControllerOptions {
|
|
2946
|
-
/** A function that returns the form containing the form control. */
|
|
2947
|
-
form: (input: FlowRdfFormControl) => HTMLFormElement | null;
|
|
2948
|
-
/** A function that returns the form control's name, which will be submitted with the form data. */
|
|
2949
|
-
name: (input: FlowRdfFormControl) => string;
|
|
2950
|
-
/** A function that returns the form control's current value. */
|
|
2951
|
-
value: (input: FlowRdfFormControl) => unknown | unknown[];
|
|
2952
|
-
/** A function that returns the form control's default value. */
|
|
2953
|
-
defaultValue: (input: FlowRdfFormControl) => unknown | unknown[];
|
|
2954
|
-
/** A function that returns the form control's current disabled state. If disabled, the value won't be submitted. */
|
|
2955
|
-
disabled: (input: FlowRdfFormControl) => boolean;
|
|
2956
|
-
/**
|
|
2957
|
-
* A function that maps to the form control's reportValidity() function. When the control is invalid, this will
|
|
2958
|
-
* prevent submission and trigger the browser's constraint violation warning.
|
|
2959
|
-
*/
|
|
2960
|
-
reportValidity: (input: FlowRdfFormControl) => boolean;
|
|
2961
|
-
/** A function that sets the form control's value */
|
|
2962
|
-
setValue: (input: FlowRdfFormControl, value: unknown) => void;
|
|
2963
|
-
/**
|
|
2964
|
-
* An array of event names to listen to. When all events in the list are emitted, the control will receive validity
|
|
2965
|
-
* states such as user-valid and user-invalid.user interacted validity states. */
|
|
2966
|
-
assumeInteractionOn: string[];
|
|
2967
|
-
}
|
|
2968
|
-
/** A reactive controller to allow form controls to participate in form submission, validation, etc. */
|
|
2969
|
-
declare class FormControlController implements ReactiveController {
|
|
2970
|
-
host: FlowRdfFormControl & ReactiveControllerHost;
|
|
2971
|
-
form?: HTMLFormElement | null;
|
|
2972
|
-
options: FormControlControllerOptions;
|
|
2973
|
-
constructor(host: ReactiveControllerHost & FlowRdfFormControl, options?: Partial<FormControlControllerOptions>);
|
|
2974
|
-
hostConnected(): void;
|
|
2975
|
-
hostDisconnected(): void;
|
|
2976
|
-
hostUpdated(): void;
|
|
2977
|
-
private attachForm;
|
|
2978
|
-
private detachForm;
|
|
2979
|
-
private handleFormData;
|
|
2980
|
-
private handleFormSubmit;
|
|
2981
|
-
private handleFormReset;
|
|
2982
|
-
private handleInteraction;
|
|
2983
|
-
private reportFormValidity;
|
|
2984
|
-
private setUserInteracted;
|
|
2985
|
-
private doAction;
|
|
2986
|
-
/** Returns the associated `<form>` element, if one exists. */
|
|
2987
|
-
getForm(): HTMLFormElement | null;
|
|
2988
|
-
/** Resets the form, restoring all the control to their default value */
|
|
2989
|
-
reset(submitter?: HTMLInputElement | FlowButton): void;
|
|
2990
|
-
/** Submits the form, triggering validation and form data injection. */
|
|
2991
|
-
submit(submitter?: HTMLInputElement | FlowButton): void;
|
|
2992
|
-
/**
|
|
2993
|
-
* Synchronously sets the form control's validity. Call this when you know the future validity but need to update
|
|
2994
|
-
* the host element immediately, i.e. before Lit updates the component in the next update.
|
|
2995
|
-
*/
|
|
2996
|
-
setValidity(isValid: boolean): void;
|
|
2997
|
-
/**
|
|
2998
|
-
* Updates the form control's validity based on the current value of `host.validity.valid`. Call this when anything
|
|
2999
|
-
* that affects constraint validation changes so the component receives the correct validity states.
|
|
3000
|
-
*/
|
|
3001
|
-
updateValidity(): void;
|
|
3002
|
-
/**
|
|
3003
|
-
* Dispatches a non-bubbling, cancelable custom event of type `flow-ui-invalid`.
|
|
3004
|
-
* If the `flow-ui-invalid` event will be cancelled then the original `invalid`
|
|
3005
|
-
* event (which may have been passed as argument) will also be cancelled.
|
|
3006
|
-
* If no original `invalid` event has been passed then the `flow-ui-invalid`
|
|
3007
|
-
* event will be cancelled before being dispatched.
|
|
3008
|
-
*/
|
|
3009
|
-
emitInvalidEvent(originalInvalidEvent?: Event): void;
|
|
3010
|
-
}
|
|
3011
|
-
|
|
3012
|
-
/**
|
|
3013
|
-
* @summary Radio groups are used to group multiple [radios](/components/radio) or [radio buttons](/components/radio-button) so they function as a single form control.
|
|
3014
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/radio-group
|
|
3015
|
-
* @status stable
|
|
3016
|
-
* @since 2.0
|
|
3017
|
-
*
|
|
3018
|
-
* @dependency flow-ui-button-group
|
|
3019
|
-
*
|
|
3020
|
-
* @slot - The default slot where `<flow-ui-radio>` or `<flow-ui-tool-button>` elements are placed.
|
|
3021
|
-
* @slot label - The radio group's label. Required for proper accessibility. Alternatively, you can use the `label`
|
|
3022
|
-
* attribute.
|
|
3023
|
-
*
|
|
3024
|
-
* @event flow-ui-change - Emitted when the radio group's selected value changes.
|
|
3025
|
-
* @event flow-ui-input - Emitted when the radio group receives user input.
|
|
3026
|
-
* @event flow-ui-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.
|
|
3027
|
-
*
|
|
3028
|
-
* @csspart form-control - The form control that wraps the label, input, and help text.
|
|
3029
|
-
* @csspart form-control-label - The label's wrapper.
|
|
3030
|
-
* @csspart form-control-input - The input's wrapper.
|
|
3031
|
-
* @csspart form-control-help-text - The help text's wrapper.
|
|
3032
|
-
* @csspart button-group - The button group that wraps radio buttons.
|
|
3033
|
-
* @csspart button-group__base - The button group's `base` part.
|
|
3034
|
-
*/
|
|
3035
|
-
declare class FlowRadioGroup extends FlowRdfElement implements FlowRdfFormControl {
|
|
3036
|
-
static styles: CSSResultGroup;
|
|
3037
|
-
protected readonly formControlController: FormControlController;
|
|
3038
|
-
private readonly hasSlotController;
|
|
3039
|
-
private customValidityMessage;
|
|
3040
|
-
private validationTimeout;
|
|
3041
|
-
defaultSlot: HTMLSlotElement;
|
|
3042
|
-
validationInput: HTMLInputElement;
|
|
3043
|
-
private errorMessage;
|
|
3044
|
-
defaultValue: string;
|
|
3045
|
-
/**
|
|
3046
|
-
* The radio group's label. Required for proper accessibility. If you need to display HTML, use the `label` slot
|
|
3047
|
-
* instead.
|
|
3048
|
-
*/
|
|
3049
|
-
label: string;
|
|
3050
|
-
/** The radio groups's help text. If you need to display HTML, use the `help-text` slot instead. */
|
|
3051
|
-
helpText: string;
|
|
3052
|
-
/** The name of the radio group, submitted as a name/value pair with form data. */
|
|
3053
|
-
name: string;
|
|
3054
|
-
/** The current value of the radio group, submitted as a name/value pair with form data. */
|
|
3055
|
-
value: string;
|
|
3056
|
-
/** The radio group's size. This size will be applied to all child radios and radio buttons. */
|
|
3057
|
-
size: 'small' | 'medium' | 'large';
|
|
3058
|
-
/**
|
|
3059
|
-
* By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you
|
|
3060
|
-
* to place the form control outside of a form and associate it with the form that has this `id`. The form must be in
|
|
3061
|
-
* the same document or shadow root for this to work.
|
|
3062
|
-
*/
|
|
3063
|
-
form: string;
|
|
3064
|
-
/** Ensures a child radio is checked before allowing the containing form to submit. */
|
|
3065
|
-
required: boolean;
|
|
3066
|
-
/**
|
|
3067
|
-
* Use vertical layout for the radio group.
|
|
3068
|
-
*/
|
|
3069
|
-
vertical: boolean;
|
|
3070
|
-
/** Gets the validity state object */
|
|
3071
|
-
get validity(): ValidityState;
|
|
3072
|
-
/** Gets the validation message */
|
|
3073
|
-
get validationMessage(): string;
|
|
3074
|
-
connectedCallback(): void;
|
|
3075
|
-
firstUpdated(): void;
|
|
3076
|
-
private getAllRadios;
|
|
3077
|
-
private handleRadioClick;
|
|
3078
|
-
private handleKeyDown;
|
|
3079
|
-
private handleLabelClick;
|
|
3080
|
-
private handleInvalid;
|
|
3081
|
-
private syncRadios;
|
|
3082
|
-
private updateCheckedRadio;
|
|
3083
|
-
handleSizeChange(): void;
|
|
3084
|
-
handleValueChange(): void;
|
|
3085
|
-
/** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */
|
|
3086
|
-
checkValidity(): boolean;
|
|
3087
|
-
/** Gets the associated form, if one exists. */
|
|
3088
|
-
getForm(): HTMLFormElement | null;
|
|
3089
|
-
/** Checks for validity and shows the browser's validation message if the control is invalid. */
|
|
3090
|
-
reportValidity(): boolean;
|
|
3091
|
-
/** Sets a custom validation message. Pass an empty string to restore validity. */
|
|
3092
|
-
setCustomValidity(message?: string): void;
|
|
3093
|
-
render(): lit.TemplateResult<1>;
|
|
3094
|
-
}
|
|
3095
|
-
declare global {
|
|
3096
|
-
interface HTMLElementTagNameMap {
|
|
3097
|
-
'flow-ui-radio-group': FlowRadioGroup;
|
|
3098
|
-
}
|
|
3099
|
-
}
|
|
3100
|
-
|
|
3101
|
-
/**
|
|
3102
|
-
* fdfd
|
|
3103
|
-
*
|
|
3104
|
-
* @summary Radios allow the user to select a single option from a group.
|
|
3105
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/radio
|
|
3106
|
-
* @status stable
|
|
3107
|
-
* @since 2.0
|
|
3108
|
-
*
|
|
3109
|
-
* @dependency flow-ui-icon
|
|
3110
|
-
*
|
|
3111
|
-
* @slot - The radio's label.
|
|
3112
|
-
*
|
|
3113
|
-
* @event flow-ui-blur - Emitted when the control loses focus.
|
|
3114
|
-
* @event flow-ui-focus - Emitted when the control gains focus.
|
|
3115
|
-
*
|
|
3116
|
-
* @csspart base - The component's base wrapper.
|
|
3117
|
-
* @csspart control - The circular container that wraps the radio's checked state.
|
|
3118
|
-
* @csspart control--checked - The radio control when the radio is checked.
|
|
3119
|
-
* @csspart checked-icon - The checked icon, an `<flow-ui-icon>` element.
|
|
3120
|
-
* @csspart label - The container that wraps the radio's label.
|
|
3121
|
-
*/
|
|
3122
|
-
declare class FlowRadio extends FlowRdfElement {
|
|
3123
|
-
static styles: CSSResultGroup;
|
|
3124
|
-
checked: boolean;
|
|
3125
|
-
protected hasFocus: boolean;
|
|
3126
|
-
/** The radio's value. When selected, the radio group will receive this value. */
|
|
3127
|
-
value: string;
|
|
3128
|
-
/**
|
|
3129
|
-
* The radio's size. When used inside a radio group, the size will be determined by the radio group's size so this
|
|
3130
|
-
* attribute can typically be omitted.
|
|
3131
|
-
*/
|
|
3132
|
-
size: 'small' | 'medium' | 'large';
|
|
3133
|
-
/** Disables the radio. */
|
|
3134
|
-
disabled: boolean;
|
|
3135
|
-
connectedCallback(): void;
|
|
3136
|
-
disconnectedCallback(): void;
|
|
3137
|
-
private addEventListeners;
|
|
3138
|
-
private removeEventListeners;
|
|
3139
|
-
private handleBlur;
|
|
3140
|
-
private handleClick;
|
|
3141
|
-
private handleFocus;
|
|
3142
|
-
private setInitialAttributes;
|
|
3143
|
-
handleCheckedChange(): void;
|
|
3144
|
-
handleDisabledChange(): void;
|
|
3145
|
-
render(): lit.TemplateResult<1>;
|
|
3146
|
-
}
|
|
3147
|
-
declare global {
|
|
3148
|
-
interface HTMLElementTagNameMap {
|
|
3149
|
-
'flow-ui-radio': FlowRadio;
|
|
3150
|
-
}
|
|
3151
|
-
}
|
|
3152
|
-
|
|
3153
3438
|
/**
|
|
3439
|
+
* @tagname flow-ui-range
|
|
3154
3440
|
* @summary Ranges allow the user to select a single value within a given range using a slider.
|
|
3155
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/range
|
|
3156
|
-
* @status stable
|
|
3157
|
-
* @since 2.0
|
|
3158
3441
|
*
|
|
3159
3442
|
* @slot label - The range's label. Alternatively, you can use the `label` attribute.
|
|
3160
3443
|
* @slot help-text - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.
|
|
@@ -3242,261 +3525,12 @@ declare class FlowRange extends FlowRdfElement implements FlowRdfFormControl {
|
|
|
3242
3525
|
private handleInvalid;
|
|
3243
3526
|
/** Sets focus on the range. */
|
|
3244
3527
|
focus(options?: FocusOptions): void;
|
|
3245
|
-
/** Removes focus from the range. */
|
|
3246
|
-
blur(): void;
|
|
3247
|
-
/** Increments the value of the range by the value of the step attribute. */
|
|
3248
|
-
stepUp(): void;
|
|
3249
|
-
/** Decrements the value of the range by the value of the step attribute. */
|
|
3250
|
-
stepDown(): void;
|
|
3251
|
-
/** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */
|
|
3252
|
-
checkValidity(): boolean;
|
|
3253
|
-
/** Gets the associated form, if one exists. */
|
|
3254
|
-
getForm(): HTMLFormElement | null;
|
|
3255
|
-
/** Checks for validity and shows the browser's validation message if the control is invalid. */
|
|
3256
|
-
reportValidity(): boolean;
|
|
3257
|
-
/** Sets a custom validation message. Pass an empty string to restore validity. */
|
|
3258
|
-
setCustomValidity(message: string): void;
|
|
3259
|
-
render(): lit.TemplateResult<1>;
|
|
3260
|
-
}
|
|
3261
|
-
declare global {
|
|
3262
|
-
interface HTMLElementTagNameMap {
|
|
3263
|
-
'flow-ui-range': FlowRange;
|
|
3264
|
-
}
|
|
3265
|
-
}
|
|
3266
|
-
|
|
3267
|
-
/**
|
|
3268
|
-
* @summary The Resize Observer component offers a thin, declarative interface to the [`ResizeObserver API`](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver).
|
|
3269
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/resize-observer
|
|
3270
|
-
* @status stable
|
|
3271
|
-
* @since 2.0
|
|
3272
|
-
*
|
|
3273
|
-
* @slot - One or more elements to watch for resizing.
|
|
3274
|
-
*
|
|
3275
|
-
* @event {{ entries: ResizeObserverEntry[] }} flow-ui-resize - Emitted when the element is resized.
|
|
3276
|
-
*/
|
|
3277
|
-
declare class FlowResizeObserver extends FlowRdfElement {
|
|
3278
|
-
static styles: CSSResultGroup;
|
|
3279
|
-
private resizeObserver;
|
|
3280
|
-
private observedElements;
|
|
3281
|
-
/** Disables the observer. */
|
|
3282
|
-
disabled: boolean;
|
|
3283
|
-
connectedCallback(): void;
|
|
3284
|
-
disconnectedCallback(): void;
|
|
3285
|
-
private handleSlotChange;
|
|
3286
|
-
private startObserver;
|
|
3287
|
-
private stopObserver;
|
|
3288
|
-
handleDisabledChange(): void;
|
|
3289
|
-
render(): lit.TemplateResult<1>;
|
|
3290
|
-
}
|
|
3291
|
-
declare global {
|
|
3292
|
-
interface HTMLElementTagNameMap {
|
|
3293
|
-
'flow-ui-resize-observer': FlowResizeObserver;
|
|
3294
|
-
}
|
|
3295
|
-
}
|
|
3296
|
-
|
|
3297
|
-
/**
|
|
3298
|
-
* @tagname flow-ui-scroll-view
|
|
3299
|
-
* @summary Scroll views provide a scrollable area for content.
|
|
3300
|
-
*/
|
|
3301
|
-
declare class FlowScrollView extends FlowRdfElement {
|
|
3302
|
-
static styles: CSSResultGroup;
|
|
3303
|
-
private _scrollHost;
|
|
3304
|
-
private _scrollViewport;
|
|
3305
|
-
private _overlayScrollbars?;
|
|
3306
|
-
private readonly _componentId;
|
|
3307
|
-
mode?: 'native' | 'overlay';
|
|
3308
|
-
overflowX?: 'hidden' | 'scroll' | 'visible' | 'visible-hidden' | 'visible-scroll';
|
|
3309
|
-
overflowY?: 'hidden' | 'scroll' | 'visible' | 'visible-hidden' | 'visible-scroll';
|
|
3310
|
-
autoHide?: 'never' | 'scroll' | 'leave' | 'move';
|
|
3311
|
-
autoHideDelay?: number;
|
|
3312
|
-
autoHideSuspend?: boolean;
|
|
3313
|
-
connectedCallback(): void;
|
|
3314
|
-
firstUpdated(): void;
|
|
3315
|
-
updateScrollBars(): void;
|
|
3316
|
-
updated(_changedProperties: Map<string, unknown>): void;
|
|
3317
|
-
disconnectedCallback(): void;
|
|
3318
|
-
render(): lit.TemplateResult<1>;
|
|
3319
|
-
}
|
|
3320
|
-
declare global {
|
|
3321
|
-
interface HTMLElementTagNameMap {
|
|
3322
|
-
'flow-ui-scroll-view': FlowScrollView;
|
|
3323
|
-
}
|
|
3324
|
-
}
|
|
3325
|
-
|
|
3326
|
-
declare global {
|
|
3327
|
-
interface HTMLElementTagNameMap {
|
|
3328
|
-
'flow-ui-scroll-view': FlowScrollView;
|
|
3329
|
-
}
|
|
3330
|
-
}
|
|
3331
|
-
|
|
3332
|
-
/**
|
|
3333
|
-
* @summary Selects allow you to choose items from a menu of predefined options.
|
|
3334
|
-
* @documentation https://shoelace.style/components/select
|
|
3335
|
-
* @status stable
|
|
3336
|
-
* @since 2.0
|
|
3337
|
-
*
|
|
3338
|
-
* @dependency flow-icon
|
|
3339
|
-
* @dependency flow-popup
|
|
3340
|
-
* @dependency flow-tag
|
|
3341
|
-
*
|
|
3342
|
-
* @slot - The listbox options. Must be `<flow-option>` elements. You can use `<flow-divider>` to group items visually.
|
|
3343
|
-
* @slot label - The input's label. Alternatively, you can use the `label` attribute.
|
|
3344
|
-
* @slot prefix - Used to prepend a presentational icon or similar element to the combobox.
|
|
3345
|
-
* @slot suffix - Used to append a presentational icon or similar element to the combobox.
|
|
3346
|
-
* @slot clear-icon - An icon to use in lieu of the default clear icon.
|
|
3347
|
-
* @slot expand-icon - The icon to show when the control is expanded and collapsed. Rotates on open and close.
|
|
3348
|
-
* @slot help-text - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.
|
|
3349
|
-
*
|
|
3350
|
-
* @event flow-ui-change - Emitted when the control's value changes.
|
|
3351
|
-
* @event flow-ui-clear - Emitted when the control's value is cleared.
|
|
3352
|
-
* @event flow-ui-input - Emitted when the control receives input.
|
|
3353
|
-
* @event flow-ui-focus - Emitted when the control gains focus.
|
|
3354
|
-
* @event flow-ui-blur - Emitted when the control loses focus.
|
|
3355
|
-
* @event flow-ui-show - Emitted when the select's menu opens.
|
|
3356
|
-
* @event flow-ui-after-show - Emitted after the select's menu opens and all animations are complete.
|
|
3357
|
-
* @event flow-ui-hide - Emitted when the select's menu closes.
|
|
3358
|
-
* @event flow-ui-after-hide - Emitted after the select's menu closes and all animations are complete.
|
|
3359
|
-
* @event flow-ui-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.
|
|
3360
|
-
*
|
|
3361
|
-
* @csspart form-control - The form control that wraps the label, input, and help text.
|
|
3362
|
-
* @csspart form-control-label - The label's wrapper.
|
|
3363
|
-
* @csspart form-control-input - The select's wrapper.
|
|
3364
|
-
* @csspart form-control-help-text - The help text's wrapper.
|
|
3365
|
-
* @csspart combobox - The container the wraps the prefix, suffix, combobox, clear icon, and expand button.
|
|
3366
|
-
* @csspart prefix - The container that wraps the prefix slot.
|
|
3367
|
-
* @csspart suffix - The container that wraps the suffix slot.
|
|
3368
|
-
* @csspart display-input - The element that displays the selected option's label, an `<input>` element.
|
|
3369
|
-
* @csspart listbox - The listbox container where options are slotted.
|
|
3370
|
-
* @csspart tags - The container that houses option tags when `multiselect` is used.
|
|
3371
|
-
* @csspart tag - The individual tags that represent each multiselect option.
|
|
3372
|
-
* @csspart tag__base - The tag's base part.
|
|
3373
|
-
* @csspart tag__content - The tag's content part.
|
|
3374
|
-
* @csspart tag__remove-button - The tag's remove button.
|
|
3375
|
-
* @csspart tag__remove-button__base - The tag's remove button base part.
|
|
3376
|
-
* @csspart clear-button - The clear button.
|
|
3377
|
-
* @csspart expand-icon - The container that wraps the expand icon.
|
|
3378
|
-
*/
|
|
3379
|
-
declare class FlowSelect extends FlowRdfElement implements FlowRdfFormControl {
|
|
3380
|
-
static styles: CSSResultGroup;
|
|
3381
|
-
static dependencies: {
|
|
3382
|
-
'flow-icon': typeof FlowIcon;
|
|
3383
|
-
'flow-popup': typeof SlPopup;
|
|
3384
|
-
'flow-tag': typeof FlowTag;
|
|
3385
|
-
};
|
|
3386
|
-
private readonly formControlController;
|
|
3387
|
-
private readonly hasSlotController;
|
|
3388
|
-
private readonly localize;
|
|
3389
|
-
private typeToSelectString;
|
|
3390
|
-
private typeToSelectTimeout;
|
|
3391
|
-
private closeWatcher;
|
|
3392
|
-
private mutationObserver;
|
|
3393
|
-
popup: SlPopup;
|
|
3394
|
-
combobox: HTMLSlotElement;
|
|
3395
|
-
displayInput: HTMLInputElement;
|
|
3396
|
-
valueInput: HTMLInputElement;
|
|
3397
|
-
listbox: HTMLSlotElement;
|
|
3398
|
-
private hasFocus;
|
|
3399
|
-
displayLabel: string;
|
|
3400
|
-
currentOption: FlowOption;
|
|
3401
|
-
selectedOptions: FlowOption[];
|
|
3402
|
-
/** The name of the select, submitted as a name/value pair with form data. */
|
|
3403
|
-
name: string;
|
|
3404
|
-
/**
|
|
3405
|
-
* The current value of the select, submitted as a name/value pair with form data. When `multiple` is enabled, the
|
|
3406
|
-
* value attribute will be a space-delimited list of values based on the options selected, and the value property will
|
|
3407
|
-
* be an array. **For this reason, values must not contain spaces.**
|
|
3408
|
-
*/
|
|
3409
|
-
value: string | string[];
|
|
3410
|
-
/** The default value of the form control. Primarily used for resetting the form control. */
|
|
3411
|
-
defaultValue: string | string[];
|
|
3412
|
-
/** The select's size. */
|
|
3413
|
-
size: 'small' | 'medium' | 'large';
|
|
3414
|
-
/** Placeholder text to show as a hint when the select is empty. */
|
|
3415
|
-
placeholder: string;
|
|
3416
|
-
/** Allows more than one option to be selected. */
|
|
3417
|
-
multiple: boolean;
|
|
3418
|
-
/**
|
|
3419
|
-
* The maximum number of selected options to show when `multiple` is true. After the maximum, "+n" will be shown to
|
|
3420
|
-
* indicate the number of additional items that are selected. Set to 0 to remove the limit.
|
|
3421
|
-
*/
|
|
3422
|
-
maxOptionsVisible: number;
|
|
3423
|
-
/** Disables the select control. */
|
|
3424
|
-
disabled: boolean;
|
|
3425
|
-
/** Adds a clear button when the select is not empty. */
|
|
3426
|
-
clearable: boolean;
|
|
3427
|
-
/**
|
|
3428
|
-
* Indicates whether or not the select is open. You can toggle this attribute to show and hide the menu, or you can
|
|
3429
|
-
* use the `show()` and `hide()` methods and this attribute will reflect the select's open state.
|
|
3430
|
-
*/
|
|
3431
|
-
open: boolean;
|
|
3432
|
-
/**
|
|
3433
|
-
* Enable this option to prevent the listbox from being clipped when the component is placed inside a container with
|
|
3434
|
-
* `overflow: auto|scroll`. Hoisting uses a fixed positioning strategy that works in many, but not all, scenarios.
|
|
3435
|
-
*/
|
|
3436
|
-
hoist: boolean;
|
|
3437
|
-
/** Draws a filled select. */
|
|
3438
|
-
filled: boolean;
|
|
3439
|
-
/** Draws a pill-style select with rounded edges. */
|
|
3440
|
-
pill: boolean;
|
|
3441
|
-
/** The select's label. If you need to display HTML, use the `label` slot instead. */
|
|
3442
|
-
label: string;
|
|
3443
|
-
/**
|
|
3444
|
-
* The preferred placement of the select's menu. Note that the actual placement may vary as needed to keep the listbox
|
|
3445
|
-
* inside of the viewport.
|
|
3446
|
-
*/
|
|
3447
|
-
placement: 'top' | 'bottom';
|
|
3448
|
-
/** The select's help text. If you need to display HTML, use the `help-text` slot instead. */
|
|
3449
|
-
helpText: string;
|
|
3450
|
-
/**
|
|
3451
|
-
* By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you
|
|
3452
|
-
* to place the form control outside of a form and associate it with the form that has this `id`. The form must be in
|
|
3453
|
-
* the same document or shadow root for this to work.
|
|
3454
|
-
*/
|
|
3455
|
-
form: string;
|
|
3456
|
-
/** The select's required attribute. */
|
|
3457
|
-
required: boolean;
|
|
3458
|
-
/**
|
|
3459
|
-
* A function that customizes the tags to be rendered when multiple=true. The first argument is the option, the second
|
|
3460
|
-
* is the current tag's index. The function should return either a Lit TemplateResult or a string containing trusted HTML of the symbol to render at
|
|
3461
|
-
* the specified value.
|
|
3462
|
-
*/
|
|
3463
|
-
getTag: (option: FlowOption, index: number) => TemplateResult | string | HTMLElement;
|
|
3464
|
-
/** Gets the validity state object */
|
|
3465
|
-
get validity(): ValidityState;
|
|
3466
|
-
/** Gets the validation message */
|
|
3467
|
-
get validationMessage(): string;
|
|
3468
|
-
connectedCallback(): void;
|
|
3469
|
-
disconnectedCallback(): void;
|
|
3470
|
-
private addOpenListeners;
|
|
3471
|
-
private removeOpenListeners;
|
|
3472
|
-
private handleFocus;
|
|
3473
|
-
private handleBlur;
|
|
3474
|
-
private handleDocumentFocusIn;
|
|
3475
|
-
private handleDocumentKeyDown;
|
|
3476
|
-
private handleDocumentMouseDown;
|
|
3477
|
-
private handleLabelClick;
|
|
3478
|
-
private handleComboboxMouseDown;
|
|
3479
|
-
private handleComboboxKeyDown;
|
|
3480
|
-
private handleClearClick;
|
|
3481
|
-
private handleClearMouseDown;
|
|
3482
|
-
private handleOptionClick;
|
|
3483
|
-
private handleDefaultSlotChange;
|
|
3484
|
-
private handleTagRemove;
|
|
3485
|
-
private getAllOptions;
|
|
3486
|
-
private getFirstOption;
|
|
3487
|
-
private setCurrentOption;
|
|
3488
|
-
private setSelectedOptions;
|
|
3489
|
-
private toggleOptionSelection;
|
|
3490
|
-
private selectionChanged;
|
|
3491
|
-
protected get tags(): TemplateResult<1>[];
|
|
3492
|
-
private handleInvalid;
|
|
3493
|
-
handleDisabledChange(): void;
|
|
3494
|
-
handleValueChange(): void;
|
|
3495
|
-
handleOpenChange(): Promise<void>;
|
|
3496
|
-
/** Shows the listbox. */
|
|
3497
|
-
show(): Promise<void>;
|
|
3498
|
-
/** Hides the listbox. */
|
|
3499
|
-
hide(): Promise<void>;
|
|
3528
|
+
/** Removes focus from the range. */
|
|
3529
|
+
blur(): void;
|
|
3530
|
+
/** Increments the value of the range by the value of the step attribute. */
|
|
3531
|
+
stepUp(): void;
|
|
3532
|
+
/** Decrements the value of the range by the value of the step attribute. */
|
|
3533
|
+
stepDown(): void;
|
|
3500
3534
|
/** Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid. */
|
|
3501
3535
|
checkValidity(): boolean;
|
|
3502
3536
|
/** Gets the associated form, if one exists. */
|
|
@@ -3505,16 +3539,76 @@ declare class FlowSelect extends FlowRdfElement implements FlowRdfFormControl {
|
|
|
3505
3539
|
reportValidity(): boolean;
|
|
3506
3540
|
/** Sets a custom validation message. Pass an empty string to restore validity. */
|
|
3507
3541
|
setCustomValidity(message: string): void;
|
|
3508
|
-
|
|
3509
|
-
focus(options?: FocusOptions): void;
|
|
3510
|
-
/** Removes focus from the control. */
|
|
3511
|
-
blur(): void;
|
|
3512
|
-
render(): TemplateResult<1>;
|
|
3542
|
+
render(): lit.TemplateResult<1>;
|
|
3513
3543
|
}
|
|
3514
3544
|
|
|
3515
3545
|
declare global {
|
|
3516
3546
|
interface HTMLElementTagNameMap {
|
|
3517
|
-
'flow-ui-
|
|
3547
|
+
'flow-ui-range': FlowRange;
|
|
3548
|
+
}
|
|
3549
|
+
}
|
|
3550
|
+
|
|
3551
|
+
/**
|
|
3552
|
+
* @tagname flow-ui-resize-observer
|
|
3553
|
+
* @summary The Resize Observer component offers a thin, declarative interface to the [`ResizeObserver API`](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver).
|
|
3554
|
+
*
|
|
3555
|
+
* @slot - One or more elements to watch for resizing.
|
|
3556
|
+
*
|
|
3557
|
+
* @event {{ entries: ResizeObserverEntry[] }} flow-ui-resize - Emitted when the element is resized.
|
|
3558
|
+
*/
|
|
3559
|
+
declare class FlowResizeObserver extends FlowRdfElement {
|
|
3560
|
+
static styles: CSSResultGroup;
|
|
3561
|
+
private resizeObserver;
|
|
3562
|
+
private observedElements;
|
|
3563
|
+
/** Disables the observer. */
|
|
3564
|
+
disabled: boolean;
|
|
3565
|
+
connectedCallback(): void;
|
|
3566
|
+
disconnectedCallback(): void;
|
|
3567
|
+
private handleSlotChange;
|
|
3568
|
+
private startObserver;
|
|
3569
|
+
private stopObserver;
|
|
3570
|
+
handleDisabledChange(): void;
|
|
3571
|
+
render(): lit.TemplateResult<1>;
|
|
3572
|
+
}
|
|
3573
|
+
|
|
3574
|
+
declare global {
|
|
3575
|
+
interface HTMLElementTagNameMap {
|
|
3576
|
+
'flow-ui-resize-observer': FlowResizeObserver;
|
|
3577
|
+
}
|
|
3578
|
+
}
|
|
3579
|
+
|
|
3580
|
+
/**
|
|
3581
|
+
* @tagname flow-ui-scroll-view
|
|
3582
|
+
* @summary Scroll views provide a scrollable area for content.
|
|
3583
|
+
*/
|
|
3584
|
+
declare class FlowScrollView extends FlowRdfElement {
|
|
3585
|
+
static styles: CSSResultGroup;
|
|
3586
|
+
private _scrollHost;
|
|
3587
|
+
private _scrollViewport;
|
|
3588
|
+
private _overlayScrollbars?;
|
|
3589
|
+
private readonly _componentId;
|
|
3590
|
+
mode?: 'native' | 'overlay';
|
|
3591
|
+
overflowX?: 'hidden' | 'scroll' | 'visible' | 'visible-hidden' | 'visible-scroll';
|
|
3592
|
+
overflowY?: 'hidden' | 'scroll' | 'visible' | 'visible-hidden' | 'visible-scroll';
|
|
3593
|
+
autoHide?: 'never' | 'scroll' | 'leave' | 'move';
|
|
3594
|
+
autoHideDelay?: number;
|
|
3595
|
+
autoHideSuspend?: boolean;
|
|
3596
|
+
connectedCallback(): void;
|
|
3597
|
+
firstUpdated(): void;
|
|
3598
|
+
updateScrollBars(): void;
|
|
3599
|
+
updated(_changedProperties: Map<string, unknown>): void;
|
|
3600
|
+
disconnectedCallback(): void;
|
|
3601
|
+
render(): lit.TemplateResult<1>;
|
|
3602
|
+
}
|
|
3603
|
+
declare global {
|
|
3604
|
+
interface HTMLElementTagNameMap {
|
|
3605
|
+
'flow-ui-scroll-view': FlowScrollView;
|
|
3606
|
+
}
|
|
3607
|
+
}
|
|
3608
|
+
|
|
3609
|
+
declare global {
|
|
3610
|
+
interface HTMLElementTagNameMap {
|
|
3611
|
+
'flow-ui-scroll-view': FlowScrollView;
|
|
3518
3612
|
}
|
|
3519
3613
|
}
|
|
3520
3614
|
|
|
@@ -3641,7 +3735,6 @@ declare class FlowSplitView extends FlowRdfElement {
|
|
|
3641
3735
|
* @param caOpen whether panels can be opened to grow space
|
|
3642
3736
|
* @param amount Number of pixels to grow by
|
|
3643
3737
|
* @param dryRun if true, don't actually row panels, just calculate the amount that can be grown
|
|
3644
|
-
* @returns number of pixels actually grown
|
|
3645
3738
|
*/
|
|
3646
3739
|
private growPanels;
|
|
3647
3740
|
private handleCollapseExpand;
|
|
@@ -3649,7 +3742,7 @@ declare class FlowSplitView extends FlowRdfElement {
|
|
|
3649
3742
|
* This is called repeatedly as the user drags a panel divider.
|
|
3650
3743
|
*
|
|
3651
3744
|
* @param event
|
|
3652
|
-
*
|
|
3745
|
+
*
|
|
3653
3746
|
*/
|
|
3654
3747
|
private handleDrag;
|
|
3655
3748
|
private handleDragEnd;
|
|
@@ -3668,7 +3761,6 @@ declare class FlowSplitView extends FlowRdfElement {
|
|
|
3668
3761
|
* @param canClose whether panels can be closed to make space
|
|
3669
3762
|
* @param amount Number of pixels to shrink by
|
|
3670
3763
|
* @param dryRun if true, don't actually shrink panels, just calculate the amount that can be shrunk
|
|
3671
|
-
* @returns number of pixels actually shrunk
|
|
3672
3764
|
*/
|
|
3673
3765
|
private shrinkPanels;
|
|
3674
3766
|
private sizeToPixels;
|
|
@@ -3742,11 +3834,8 @@ declare global {
|
|
|
3742
3834
|
}
|
|
3743
3835
|
|
|
3744
3836
|
/**
|
|
3837
|
+
* @tagname flow-ui-switch
|
|
3745
3838
|
* @summary Switches allow the user to toggle an option on or off.
|
|
3746
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/switch
|
|
3747
|
-
* @status stable
|
|
3748
|
-
* @since 2.0
|
|
3749
|
-
*
|
|
3750
3839
|
* @slot - The switch's label.
|
|
3751
3840
|
*
|
|
3752
3841
|
* @event flow-ui-blur - Emitted when the control loses focus.
|
|
@@ -3819,6 +3908,7 @@ declare class FlowSwitch extends FlowRdfElement implements FlowRdfFormControl {
|
|
|
3819
3908
|
setCustomValidity(message: string): void;
|
|
3820
3909
|
render(): lit.TemplateResult<1>;
|
|
3821
3910
|
}
|
|
3911
|
+
|
|
3822
3912
|
declare global {
|
|
3823
3913
|
interface HTMLElementTagNameMap {
|
|
3824
3914
|
'flow-ui-switch': FlowSwitch;
|
|
@@ -3826,10 +3916,8 @@ declare global {
|
|
|
3826
3916
|
}
|
|
3827
3917
|
|
|
3828
3918
|
/**
|
|
3919
|
+
* @tagname flow-ui-tab-group
|
|
3829
3920
|
* @summary Tab groups organize content into a container that shows one section at a time.
|
|
3830
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tab-group
|
|
3831
|
-
* @status stable
|
|
3832
|
-
* @since 2.0
|
|
3833
3921
|
*
|
|
3834
3922
|
* @dependency flow-ui-icon-button
|
|
3835
3923
|
*
|
|
@@ -3898,6 +3986,7 @@ declare class FlowTabGroup extends FlowRdfElement {
|
|
|
3898
3986
|
show(panel: string): void;
|
|
3899
3987
|
render(): lit.TemplateResult<1>;
|
|
3900
3988
|
}
|
|
3989
|
+
|
|
3901
3990
|
declare global {
|
|
3902
3991
|
interface HTMLElementTagNameMap {
|
|
3903
3992
|
'flow-ui-tab-group': FlowTabGroup;
|
|
@@ -3905,10 +3994,9 @@ declare global {
|
|
|
3905
3994
|
}
|
|
3906
3995
|
|
|
3907
3996
|
/**
|
|
3997
|
+
* @tagname flow-ui-tab-panel
|
|
3908
3998
|
* @summary Tab panels are used inside [tab groups](/components/tab-group) to display tabbed content.
|
|
3909
|
-
|
|
3910
|
-
* @status stable
|
|
3911
|
-
* @since 2.0
|
|
3999
|
+
|
|
3912
4000
|
*
|
|
3913
4001
|
* @slot - The tab panel's content.
|
|
3914
4002
|
*
|
|
@@ -3932,6 +4020,7 @@ declare class FlowTabPanel extends FlowRdfElement {
|
|
|
3932
4020
|
handleActiveChange(): void;
|
|
3933
4021
|
render(): lit.TemplateResult<1>;
|
|
3934
4022
|
}
|
|
4023
|
+
|
|
3935
4024
|
declare global {
|
|
3936
4025
|
interface HTMLElementTagNameMap {
|
|
3937
4026
|
'flow-ui-tab-panel': FlowTabPanel;
|
|
@@ -3939,10 +4028,8 @@ declare global {
|
|
|
3939
4028
|
}
|
|
3940
4029
|
|
|
3941
4030
|
/**
|
|
4031
|
+
* @tagname flow-ui-tab
|
|
3942
4032
|
* @summary Tabs are used inside [tab groups](/components/tab-group) to represent and activate [tab panels](/components/tab-panel).
|
|
3943
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tab
|
|
3944
|
-
* @status stable
|
|
3945
|
-
* @since 2.0
|
|
3946
4033
|
*
|
|
3947
4034
|
* @dependency flow-ui-icon-button
|
|
3948
4035
|
*
|
|
@@ -3990,6 +4077,7 @@ declare class FlowTab extends FlowRdfElement {
|
|
|
3990
4077
|
blur(): void;
|
|
3991
4078
|
render(): lit.TemplateResult<1>;
|
|
3992
4079
|
}
|
|
4080
|
+
|
|
3993
4081
|
declare global {
|
|
3994
4082
|
interface HTMLElementTagNameMap {
|
|
3995
4083
|
'flow-ui-tab': FlowTab;
|
|
@@ -3997,10 +4085,8 @@ declare global {
|
|
|
3997
4085
|
}
|
|
3998
4086
|
|
|
3999
4087
|
/**
|
|
4088
|
+
* @tagname flow-ui-textarea
|
|
4000
4089
|
* @summary Textareas collect data from the user and allow multiple lines of text.
|
|
4001
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/textarea
|
|
4002
|
-
* @status stable
|
|
4003
|
-
* @since 2.0
|
|
4004
4090
|
*
|
|
4005
4091
|
* @slot label - The textarea's label. Alternatively, you can use the `label` attribute.
|
|
4006
4092
|
* @slot help-text - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.
|
|
@@ -4126,6 +4212,7 @@ declare class FlowTextarea extends FlowRdfElement implements FlowRdfFormControl
|
|
|
4126
4212
|
setCustomValidity(message: string): void;
|
|
4127
4213
|
render(): lit.TemplateResult<1>;
|
|
4128
4214
|
}
|
|
4215
|
+
|
|
4129
4216
|
declare global {
|
|
4130
4217
|
interface HTMLElementTagNameMap {
|
|
4131
4218
|
'flow-ui-textarea': FlowTextarea;
|
|
@@ -4208,9 +4295,6 @@ declare global {
|
|
|
4208
4295
|
|
|
4209
4296
|
/**
|
|
4210
4297
|
* @summary A tree item serves as a hierarchical node that lives inside a [tree](/components/tree).
|
|
4211
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tree-item
|
|
4212
|
-
* @status stable
|
|
4213
|
-
* @since 2.0
|
|
4214
4298
|
*
|
|
4215
4299
|
* @dependency flow-ui-checkbox
|
|
4216
4300
|
* @dependency flow-ui-icon
|
|
@@ -4288,6 +4372,7 @@ declare class FlowTreeItem extends FlowRdfElement {
|
|
|
4288
4372
|
}): FlowTreeItem[];
|
|
4289
4373
|
render(): lit.TemplateResult<1>;
|
|
4290
4374
|
}
|
|
4375
|
+
|
|
4291
4376
|
declare global {
|
|
4292
4377
|
interface HTMLElementTagNameMap {
|
|
4293
4378
|
'flow-ui-tree-item': FlowTreeItem;
|
|
@@ -4295,10 +4380,8 @@ declare global {
|
|
|
4295
4380
|
}
|
|
4296
4381
|
|
|
4297
4382
|
/**
|
|
4383
|
+
* @tagname flow-ui-tree
|
|
4298
4384
|
* @summary Trees allow you to display a hierarchical list of selectable [tree items](/components/tree-item). Items with children can be expanded and collapsed as desired by the user.
|
|
4299
|
-
* @documentation https://developer.emu-analytics.net/docs/flow-ui-rdf/components/tree
|
|
4300
|
-
* @status stable
|
|
4301
|
-
* @since 2.0
|
|
4302
4385
|
*
|
|
4303
4386
|
* @event {{ selection: FlowTreeItem[] }} flow-ui-selection-change - Emitted when a tree item is selected or deselected.
|
|
4304
4387
|
*
|
|
@@ -4351,163 +4434,13 @@ declare class FlowTree extends FlowRdfElement {
|
|
|
4351
4434
|
getFocusableItems(): FlowTreeItem[];
|
|
4352
4435
|
render(): lit.TemplateResult<1>;
|
|
4353
4436
|
}
|
|
4354
|
-
declare global {
|
|
4355
|
-
interface HTMLElementTagNameMap {
|
|
4356
|
-
'flow-ui-tree': FlowTree;
|
|
4357
|
-
}
|
|
4358
|
-
}
|
|
4359
|
-
|
|
4360
|
-
interface BaseColorStopOptions {
|
|
4361
|
-
type: string;
|
|
4362
|
-
label?: string;
|
|
4363
|
-
}
|
|
4364
|
-
interface StringColorStopOptions {
|
|
4365
|
-
type: 'string';
|
|
4366
|
-
}
|
|
4367
|
-
interface NumberColorStopOptions {
|
|
4368
|
-
type: 'number';
|
|
4369
|
-
min?: number;
|
|
4370
|
-
max?: number;
|
|
4371
|
-
step?: number;
|
|
4372
|
-
units?: string;
|
|
4373
|
-
}
|
|
4374
|
-
interface SelectColorStopOptions {
|
|
4375
|
-
type: 'select';
|
|
4376
|
-
options: Array<string | {
|
|
4377
|
-
value: string;
|
|
4378
|
-
name?: string;
|
|
4379
|
-
}>;
|
|
4380
|
-
}
|
|
4381
|
-
type ColorStopOptions = StringColorStopOptions | NumberColorStopOptions | SelectColorStopOptions;
|
|
4382
|
-
interface ColorStopValue {
|
|
4383
|
-
value: string | number;
|
|
4384
|
-
color: string;
|
|
4385
|
-
options?: {
|
|
4386
|
-
regex: boolean;
|
|
4387
|
-
caseSensitive: boolean;
|
|
4388
|
-
};
|
|
4389
|
-
}
|
|
4390
|
-
interface BaseColorMapperField {
|
|
4391
|
-
name?: string;
|
|
4392
|
-
field: string;
|
|
4393
|
-
}
|
|
4394
|
-
interface StringColorMapperField extends StringColorStopOptions, BaseColorMapperField {
|
|
4395
|
-
type: 'string';
|
|
4396
|
-
}
|
|
4397
|
-
interface NumberColorMapperField extends NumberColorStopOptions, BaseColorMapperField {
|
|
4398
|
-
type: 'number';
|
|
4399
|
-
}
|
|
4400
|
-
interface SelectColorMapperField extends SelectColorStopOptions, BaseColorMapperField {
|
|
4401
|
-
type: 'select';
|
|
4402
|
-
}
|
|
4403
|
-
type ColorMapperField = StringColorMapperField | NumberColorMapperField | SelectColorMapperField;
|
|
4404
|
-
interface ColorMapperOptions {
|
|
4405
|
-
fields: Record<string, ColorMapperField>;
|
|
4406
|
-
}
|
|
4407
|
-
interface ColorMapperValue {
|
|
4408
|
-
mode: 'fixed' | 'data-driven';
|
|
4409
|
-
field: string | undefined;
|
|
4410
|
-
type?: 'string' | 'number' | 'select';
|
|
4411
|
-
defaultColor?: string;
|
|
4412
|
-
colorStops: ColorStopValue[];
|
|
4413
|
-
}
|
|
4414
|
-
|
|
4415
|
-
/**
|
|
4416
|
-
* @tagname flow-ui-color-mapper
|
|
4417
|
-
* @summary A component for defining mappings between data values and colors.
|
|
4418
|
-
*
|
|
4419
|
-
*/
|
|
4420
|
-
declare class FlowColorMapper extends FlowRdfElement {
|
|
4421
|
-
static styles: CSSResultGroup;
|
|
4422
|
-
private currentField?;
|
|
4423
|
-
private readonly hasSlotController;
|
|
4424
|
-
modeRadioGroup: FlowRadioGroup;
|
|
4425
|
-
fixedColorPicker: FlowColorPicker;
|
|
4426
|
-
fieldSelect: FlowSelect;
|
|
4427
|
-
infoDialog: FlowDialog;
|
|
4428
|
-
field: string;
|
|
4429
|
-
options: ColorMapperOptions;
|
|
4430
|
-
value: ColorMapperValue;
|
|
4431
|
-
size: 'small' | 'medium' | 'large';
|
|
4432
|
-
defaultColorStop: boolean;
|
|
4433
|
-
/**
|
|
4434
|
-
* One or more predefined color swatches to display as presets in the color picker. Can include any format the color
|
|
4435
|
-
* picker can parse, including HEX(A), RGB(A), HSL(A), HSV(A), and CSS color names. Each color must be separated by a
|
|
4436
|
-
* semicolon (`;`). Alternatively, you can pass an array of color values to this property using JavaScript.
|
|
4437
|
-
*/
|
|
4438
|
-
swatches: string | string[];
|
|
4439
|
-
private handleFixedPickerClick;
|
|
4440
|
-
private handleChange;
|
|
4441
|
-
private emitChange;
|
|
4442
|
-
private handleColorStopRemove;
|
|
4443
|
-
handleInfoClick(): void;
|
|
4444
|
-
private getAllColorStops;
|
|
4445
|
-
private getColorStopPlaceholder;
|
|
4446
|
-
private fixedColorTemplate;
|
|
4447
|
-
private dataDrivenColorTemplate;
|
|
4448
|
-
private colorStopsTemplate;
|
|
4449
|
-
private infoDialogTemplate;
|
|
4450
|
-
render(): lit.TemplateResult<1>;
|
|
4451
|
-
}
|
|
4452
4437
|
|
|
4453
|
-
/**
|
|
4454
|
-
* @tagname flow-ui-color-stop
|
|
4455
|
-
* @summary A single color stop used by the `flow-ui-color-mapper` component.
|
|
4456
|
-
*
|
|
4457
|
-
*/
|
|
4458
|
-
declare class FlowColorStopComponent extends FlowRdfElement implements FlowRdfFormControl {
|
|
4459
|
-
static styles: CSSResultGroup;
|
|
4460
|
-
private readonly formControlController;
|
|
4461
|
-
input: HTMLInputElement;
|
|
4462
|
-
picker: FlowColorPicker;
|
|
4463
|
-
tooltip: FlowTooltip;
|
|
4464
|
-
textOptions: FlowToolButtonGroup;
|
|
4465
|
-
/** The name of the color stop, submitted as a name/value pair with form data. */
|
|
4466
|
-
name: string;
|
|
4467
|
-
/**
|
|
4468
|
-
* By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you
|
|
4469
|
-
* to place the form control outside of a form and associate it with the form that has this `id`. The form must be in
|
|
4470
|
-
* the same document or shadow root for this to work.
|
|
4471
|
-
*/
|
|
4472
|
-
form: string;
|
|
4473
|
-
/** Makes the color stop as a required field. */
|
|
4474
|
-
required: boolean;
|
|
4475
|
-
options: ColorStopOptions;
|
|
4476
|
-
value: ColorStopValue;
|
|
4477
|
-
size: 'small' | 'medium' | 'large';
|
|
4478
|
-
placeholder: boolean;
|
|
4479
|
-
fixed?: string;
|
|
4480
|
-
/**
|
|
4481
|
-
* One or more predefined color swatches to display as presets in the color picker. Can include any format the color
|
|
4482
|
-
* picker can parse, including HEX(A), RGB(A), HSL(A), HSV(A), and CSS color names. Each color must be separated by a
|
|
4483
|
-
* semicolon (`;`). Alternatively, you can pass an array of color values to this property using JavaScript.
|
|
4484
|
-
*/
|
|
4485
|
-
swatches: string | string[];
|
|
4486
|
-
get validity(): ValidityState;
|
|
4487
|
-
get validationMessage(): "" | "Invalid regular expression";
|
|
4488
|
-
checkValidity(): boolean;
|
|
4489
|
-
getForm(): HTMLFormElement | null;
|
|
4490
|
-
reportValidity(): boolean;
|
|
4491
|
-
setCustomValidity(message: string): void;
|
|
4492
|
-
private handleRemove;
|
|
4493
|
-
private handleChange;
|
|
4494
|
-
private emitChange;
|
|
4495
|
-
private validate;
|
|
4496
|
-
private textInputTemplate;
|
|
4497
|
-
private numberInputTemplate;
|
|
4498
|
-
private fixedInputTemplate;
|
|
4499
|
-
private selectInputTemplate;
|
|
4500
|
-
render(): lit.TemplateResult<1>;
|
|
4501
|
-
}
|
|
4502
4438
|
declare global {
|
|
4503
4439
|
interface HTMLElementTagNameMap {
|
|
4504
|
-
'flow-ui-
|
|
4440
|
+
'flow-ui-tree': FlowTree;
|
|
4505
4441
|
}
|
|
4506
4442
|
}
|
|
4507
4443
|
|
|
4508
|
-
declare function colorMapperValueToMaplibreExpression(value: ColorMapperValue): string;
|
|
4509
|
-
declare function escapeMaplibreString(value: string): string;
|
|
4510
|
-
|
|
4511
4444
|
/**
|
|
4512
4445
|
* @tagname flow-ui-tool-button-group
|
|
4513
4446
|
* @summary Tool buttons groups are used to build toolbars.
|
|
@@ -5002,4 +4935,41 @@ declare function unregisterIconLibrary(name: string): void;
|
|
|
5002
4935
|
declare function setDefaultLocale(locale: string): void;
|
|
5003
4936
|
declare function setDefaultTimeZone(timeZone: string): void;
|
|
5004
4937
|
|
|
5005
|
-
|
|
4938
|
+
/**
|
|
4939
|
+
* Given a FlowQueryBuilderRuleSet this function will recursively filter rules.
|
|
4940
|
+
*
|
|
4941
|
+
* This can be used to sanitize user queries before they are executed.
|
|
4942
|
+
*
|
|
4943
|
+
* @param ruleset Rule set to filter
|
|
4944
|
+
* @param options Fields to include or exclude
|
|
4945
|
+
*/
|
|
4946
|
+
declare function filterRuleSet(ruleset: FlowQueryBuilderRuleSet, options: {
|
|
4947
|
+
excludeFields?: string[];
|
|
4948
|
+
includeFields?: string[];
|
|
4949
|
+
}): FlowQueryBuilderRuleSet;
|
|
4950
|
+
declare function renameRuleSetFields(ruleset: FlowQueryBuilderRuleSet, replacements: Record<string, string>): FlowQueryBuilderRuleSet;
|
|
4951
|
+
/**
|
|
4952
|
+
* Given a FlowQueryBuilderRuleSet this function will recursively apply
|
|
4953
|
+
* a transform function to each rule.
|
|
4954
|
+
*
|
|
4955
|
+
* The transform fn should expect a single FlowQueryBuilderRule and return:
|
|
4956
|
+
*
|
|
4957
|
+
* - the same rule unmodifed or modified in place
|
|
4958
|
+
* - `undefined` to exclude the rule from the rule set
|
|
4959
|
+
*
|
|
4960
|
+
* This can be used to sanitize rule sets before they are used to perform queries.
|
|
4961
|
+
*
|
|
4962
|
+
* @param ruleSet query builder rule set
|
|
4963
|
+
* @param transformFn transform function
|
|
4964
|
+
*/
|
|
4965
|
+
declare function transformRuleSet(ruleSet: FlowQueryBuilderRuleSet, transformFn: (rule: FlowQueryBuilderRule) => FlowQueryBuilderRule | undefined, clone?: boolean): FlowQueryBuilderRuleSet;
|
|
4966
|
+
/**
|
|
4967
|
+
* Helper functions to determine if supplied argument is a FlowQueryBuilderRule or FlowQueryBuilderRuleSet
|
|
4968
|
+
*/
|
|
4969
|
+
declare const isRule: (r: unknown) => r is FlowQueryBuilderRule<any>;
|
|
4970
|
+
declare const isRuleSet: (r: unknown) => r is FlowQueryBuilderRuleSet;
|
|
4971
|
+
declare const isRuleOrRuleset: (r: unknown) => r is FlowQueryBuilderRuleSet | FlowQueryBuilderRule<any>;
|
|
4972
|
+
|
|
4973
|
+
declare const converter: FlowQueryBuilderConverter;
|
|
4974
|
+
|
|
4975
|
+
export { FlowAfterCollapseEvent, FlowAfterExpandEvent, FlowAfterHideEvent, FlowAfterShowEvent, FlowAlert, SlAnimation as FlowAnimation, FlowAvatar, FlowBadge, FlowBlurEvent, FlowBreadcrumb, FlowBreadcrumbItem, FlowButton, FlowButtonGroup, FlowCalendar, FlowCancelEvent, FlowCard, FlowCarousel, FlowCarouselItem, FlowChangeEvent, FlowChart, FlowCheckbox, FlowClearEvent, FlowCloseEvent, FlowCollapseEvent, FlowColorMapper, FlowColorPicker, FlowColorStopComponent as FlowColorStop, FlowDatetimePicker as FlowDateTimePicker, FlowDetails, FlowDialog, FlowDivider, FlowDragEndEvent, FlowDragEvent, FlowDragStartEvent, FlowDrawer, SlDropdown as FlowDropdown, FlowErrorEvent, FlowExpandEvent, FlowFinishEvent, FlowFocusEvent, FlowGauge, FlowHideEvent, FlowHoverEvent, FlowIcon, FlowIconButton, FlowInitialFocusEvent, FlowInput, FlowInputEvent, FlowInvalidEvent, FlowLazyChangeEvent, FlowLazyLoadEvent, FlowLoadEvent, FlowUiMap as FlowMap, FlowMenu, FlowMenuItem, FlowMenuLabel, FlowMutationEvent, FlowMutationObserver, FlowOption, FlowPanel, FlowPanelHeader, FlowPanelToggleEvent, SlPopup as FlowPopup, FlowProgressBar, FlowProgressRing, FlowQueryBuilder, FlowQueryBuilderConfig, FlowQueryBuilderConverter, FlowQueryBuilderConverterOptions, FlowQueryBuilderDateField, FlowQueryBuilderDateTimeField, FlowQueryBuilderDateTimeFieldBase, FlowQueryBuilderField, FlowQueryBuilderFieldBase, FlowQueryBuilderFieldDefinition, FlowQueryBuilderFieldMap, FlowQueryBuilderFieldType, FlowQueryBuilderFieldTypeMap, FlowQueryBuilderMultiSelectField, FlowQueryBuilderNumberField, FlowQueryBuilderOption, FlowQueryBuilderRule, FlowQueryBuilderRuleSet, FlowQueryBuilderSelectField, FlowQueryBuilderStringField, FlowQueryBuilderTemplateFn, FlowQueryBuilderTimeField, FlowRadio, FlowRadioGroup, FlowRange, FlowRemoveEvent, FlowRepositionEvent, FlowRequestCloseEvent, FlowResizeEvent, FlowResizeObserver, FlowScrollView, FlowSelect, FlowSelectEvent, FlowSelectionChangeEvent, FlowShowEvent, FlowSlideChange, FlowSpinner, FlowSplitView, FlowPanelDivider as FlowSplitViewDivider, FlowSplitViewPane, FlowSplitViewToggleButton, FlowStartEvent, FlowStepper, FlowStepperPanel, FlowSwitch, FlowTab, FlowTabGroup, FlowTabHideEvent, FlowTabPanel, FlowTabShowEvent, FlowTag, FlowTextarea, FlowTimer, FlowToolButton, FlowToolButtonGroup, FlowTooltip, FlowTree, FlowTreeItem, addIcons, filterRuleSet, converter as flowQueryConverter, getAnimationNames, getBasePath, getEasingNames, initializeChartJs, isRule, isRuleOrRuleset, isRuleSet, registerChartComponent, registerIconLibrary, renameRuleSetFields, setBasePath, setDefaultLocale, setDefaultTimeZone, transformRuleSet, unregisterIconLibrary };
|