@emuanalytics/flow-rdf-ui 4.1.6 → 4.1.8

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.
Files changed (8) hide show
  1. package/dist/components/autocomplete/autocomplete.component.mjs +49 -41
  2. package/dist/components/autocomplete/autocomplete.styles.mjs +1 -1
  3. package/dist/custom-elements.json +334 -316
  4. package/dist/index.d.mts +3 -1
  5. package/dist/index.d.ts +3 -1
  6. package/dist/package.json.mjs +1 -1
  7. package/dist/vscode.html-custom-data.json +53 -48
  8. package/package.json +3 -3
package/dist/components/autocomplete/autocomplete.component.mjs CHANGED
@@ -2,7 +2,7 @@ import { html, nothing } from 'lit';
2
2
  import { FlowRdfFormControl } from '../../internal/flow-ui-rdf-element.mjs';
3
3
  import { property, state, query } from 'lit/decorators.js';
4
4
  import { FormControlController } from '../../internal/form.mjs';
5
- import { debounce } from '@emuanalytics/flow-rdf-core/utils';
5
+ import { debounce, isStringFull } from '@emuanalytics/flow-rdf-core/utils';
6
6
  import { watch } from '../../internal/watch.mjs';
7
7
  import { boolean } from '../../internal/boolean.mjs';
8
8
  import { classMap } from 'lit-html/directives/class-map.js';
@@ -56,6 +56,7 @@ class FlowUiAutocomplete extends FlowRdfFormControl {
56
56
  this.displayWith = (value) => value;
57
57
  this.debounceDelay = 0;
58
58
  this.clearable = false;
59
+ this.clearOnFocus = false;
59
60
  this.inputText = "";
60
61
  this.open = false;
61
62
  this.selectedOption = null;
@@ -78,6 +79,8 @@ class FlowUiAutocomplete extends FlowRdfFormControl {
78
79
  this.inline = boolean(this.inline, true);
79
80
  this.divider = boolean(this.divider, true);
80
81
  this.clearable = boolean(this.clearable, true);
82
+ this.hoist = boolean(this.hoist, true);
83
+ this.clearOnFocus = boolean(this.clearOnFocus, true);
81
84
  }
82
85
  /** Gets the associated form, if one exists. */
83
86
  getForm() {
@@ -187,10 +190,12 @@ class FlowUiAutocomplete extends FlowRdfFormControl {
187
190
  event.preventDefault();
188
191
  }
189
192
  /** @internal Handle the `mousedown` event from the clear button */
190
- handleClearMouseDown(event) {
193
+ async handleClearMouseDown(event) {
191
194
  event.stopPropagation();
192
195
  event.preventDefault();
193
- this.setValue("", { emitInputEvent: true });
196
+ this.setValue("", { emitInputEvent: true, emitChangeEvent: true });
197
+ await waitForEvent(this, "flow-ui-input");
198
+ this.hasOptions = false;
194
199
  this.input.focus({ preventScroll: true });
195
200
  }
196
201
  /** @internal Handle option selection when an option is clicked on */
@@ -328,6 +333,14 @@ class FlowUiAutocomplete extends FlowRdfFormControl {
328
333
  this.hasFocus = true;
329
334
  this.input.focus({ preventScroll: true });
330
335
  this.emit("flow-ui-focus");
336
+ if (this.clearOnFocus) {
337
+ if (isStringFull(this.value)) {
338
+ this.setValue("", { emitInputEvent: true, emitChangeEvent: true });
339
+ } else {
340
+ this.inputText = "";
341
+ }
342
+ this.hasOptions = false;
343
+ }
331
344
  this.toggleListbox();
332
345
  this.addListenersForDropdown();
333
346
  }
@@ -374,8 +387,8 @@ class FlowUiAutocomplete extends FlowRdfFormControl {
374
387
  const hasHelpTextSlot = this.hasSlotController.test("help-text");
375
388
  const hasLabel = !!this.label || !!hasLabelSlot;
376
389
  const hasHelpText = !!this.helpText || !!hasHelpTextSlot;
377
- const hasClearIcon = this.clearable && this.value.length > 0;
378
- const isPlaceholderVisible = this.placeholder && this.inputText.length === 0;
390
+ const hasClearIcon = this.clearable && isStringFull(this.value) && !this.disabled;
391
+ const isPlaceholderVisible = this.placeholder && isStringFull(this.inputText) === false;
379
392
  const horizontalPlacement = this.inline ? "end" : "start";
380
393
  const placement = `${this.placement}-${horizontalPlacement}`;
381
394
  const strategy = this.inline || this.hoist ? "fixed" : "absolute";
@@ -398,12 +411,7 @@ class FlowUiAutocomplete extends FlowRdfFormControl {
398
411
  "form-control--pill": this.pill
399
412
  })}
400
413
  >
401
- <label
402
- id="label"
403
- part="label"
404
- class="form-control__label"
405
- aria-hidden=${hasLabel ? "false" : "true"}
406
- >
414
+ <label id="label" part="label" class="form-control__label" aria-hidden=${hasLabel ? "false" : "true"}>
407
415
  <slot name="label">${this.label}</slot>
408
416
  </label>
409
417
 
@@ -416,10 +424,7 @@ class FlowUiAutocomplete extends FlowRdfFormControl {
416
424
  <slot name="help-text">${this.helpText}</slot>
417
425
  </div>
418
426
 
419
- <div
420
- part="control"
421
- class="form-control__input"
422
- >
427
+ <div part="control" class="form-control__input">
423
428
  <flow-ui-popup
424
429
  class=${classMap({
425
430
  autocomplete: true,
@@ -475,7 +480,7 @@ class FlowUiAutocomplete extends FlowRdfFormControl {
475
480
  .value=${this.inputText}
476
481
  ?disabled=${this.disabled}
477
482
  @focus=${this.handleInputFocus}
478
- @blur=${this.handleInputBlur}
483
+ @blur=${this.handleInputBlur}
479
484
  @input=${this.handleInput}
480
485
  @change=${this.handleInputChange}
481
486
  />
@@ -483,36 +488,36 @@ class FlowUiAutocomplete extends FlowRdfFormControl {
483
488
  </div>
484
489
 
485
490
  ${hasClearIcon ? html`
486
- <button
487
- part="clear-button"
488
- class="autocomplete__clear"
489
- type="button"
490
- aria-label=${this.localize.term("clearEntry")}
491
- @mousedown=${this.handleClearMouseDown}
492
- @click=${this.handleClearClick}
493
- tabindex="-1"
494
- >
495
- <slot name="clear-icon">
496
- <flow-ui-icon name="x-circle-fill" library="system"></flow-ui-icon>
497
- </slot>
498
- </button>
499
- ` : nothing}
500
-
491
+ <button
492
+ part="clear-button"
493
+ class="autocomplete__clear"
494
+ type="button"
495
+ aria-label=${this.localize.term("clearEntry")}
496
+ @mousedown=${this.handleClearMouseDown}
497
+ @click=${this.handleClearClick}
498
+ tabindex="-1"
499
+ >
500
+ <slot name="clear-icon">
501
+ <flow-ui-icon name="x-circle-fill" library="system"></flow-ui-icon>
502
+ </slot>
503
+ </button>
504
+ ` : nothing}
505
+
501
506
  <slot part="suffix" name="suffix" class="autocomplete__suffix"></slot>
502
507
  </div>
503
508
 
504
509
  <div
505
- id="listbox"
506
- role="listbox"
507
- part="listbox"
508
- class="autocomplete__listbox"
509
- aria-labelledby="label"
510
- aria-expanded=${this.open ? "true" : "false"}
511
- aria-multiselectable="false"
512
- @mouseup=${this.handleListboxClick}
513
- @slotchange=${this.handleDefaultSlotChange}
510
+ id="listbox"
511
+ role="listbox"
512
+ part="listbox"
513
+ class="autocomplete__listbox"
514
+ aria-labelledby="label"
515
+ aria-expanded=${this.open ? "true" : "false"}
516
+ aria-multiselectable="false"
517
+ @mouseup=${this.handleListboxClick}
518
+ @slotchange=${this.handleDefaultSlotChange}
514
519
  >
515
- <slot></slot>
520
+ <slot></slot>
516
521
  </div>
517
522
  </flow-ui-popup>
518
523
  </div>
@@ -578,6 +583,9 @@ __decorateClass([
578
583
  __decorateClass([
579
584
  property({ type: Boolean, reflect: true })
580
585
  ], FlowUiAutocomplete.prototype, "clearable", 2);
586
+ __decorateClass([
587
+ property({ type: Boolean, reflect: true, attribute: "clear-on-focus" })
588
+ ], FlowUiAutocomplete.prototype, "clearOnFocus", 2);
581
589
  __decorateClass([
582
590
  state()
583
591
  ], FlowUiAutocomplete.prototype, "inputText", 2);
package/dist/components/autocomplete/autocomplete.styles.mjs CHANGED
@@ -177,7 +177,7 @@ const styles = css`
177
177
  border: none;
178
178
  background: none;
179
179
  padding: 0;
180
- margin-inline-start: var(--control-spacing);
180
+ margin-inline-end: var(--control-spacing);
181
181
  transition: var(--flow-ui-transition-fast) color;
182
182
  cursor: pointer;
183
183
  }
package/dist/custom-elements.json CHANGED
@@ -668,191 +668,6 @@
668
668
  }
669
669
  ]
670
670
  },
671
- {
672
- "kind": "javascript-module",
673
- "path": "components/avatar/avatar.component.js",
674
- "declarations": [
675
- {
676
- "kind": "class",
677
- "description": "",
678
- "name": "FlowUiAvatar",
679
- "cssProperties": [
680
- {
681
- "description": "The size of the avatar.",
682
- "name": "--size"
683
- }
684
- ],
685
- "cssParts": [
686
- {
687
- "description": "The component's base wrapper.",
688
- "name": "base"
689
- },
690
- {
691
- "description": "The container that wraps the avatar's icon.",
692
- "name": "icon"
693
- },
694
- {
695
- "description": "The container that wraps the avatar's initials.",
696
- "name": "initials"
697
- },
698
- {
699
- "description": "The avatar image. Only shown when the `image` attribute is set.",
700
- "name": "image"
701
- }
702
- ],
703
- "slots": [
704
- {
705
- "description": "The default icon to use when no image or initials are present. Works best with `<flow-ui-icon>`.",
706
- "name": "icon"
707
- }
708
- ],
709
- "members": [
710
- {
711
- "kind": "field",
712
- "name": "hasError",
713
- "type": {
714
- "text": "boolean"
715
- },
716
- "privacy": "private",
717
- "default": "false"
718
- },
719
- {
720
- "kind": "field",
721
- "name": "image",
722
- "type": {
723
- "text": "string"
724
- },
725
- "default": "''",
726
- "description": "The image source to use for the avatar.",
727
- "attribute": "image"
728
- },
729
- {
730
- "kind": "field",
731
- "name": "label",
732
- "type": {
733
- "text": "string"
734
- },
735
- "default": "''",
736
- "description": "A label to use to describe the avatar to assistive devices.",
737
- "attribute": "label"
738
- },
739
- {
740
- "kind": "field",
741
- "name": "initials",
742
- "type": {
743
- "text": "string"
744
- },
745
- "default": "''",
746
- "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
747
- "attribute": "initials"
748
- },
749
- {
750
- "kind": "field",
751
- "name": "loading",
752
- "type": {
753
- "text": "'eager' | 'lazy'"
754
- },
755
- "default": "'eager'",
756
- "description": "Indicates how the browser should load the image.",
757
- "attribute": "loading"
758
- },
759
- {
760
- "kind": "field",
761
- "name": "shape",
762
- "type": {
763
- "text": "'circle' | 'square' | 'rounded'"
764
- },
765
- "default": "'circle'",
766
- "description": "The shape of the avatar.",
767
- "attribute": "shape",
768
- "reflects": true
769
- }
770
- ],
771
- "attributes": [
772
- {
773
- "name": "image",
774
- "type": {
775
- "text": "string"
776
- },
777
- "default": "''",
778
- "description": "The image source to use for the avatar.",
779
- "fieldName": "image"
780
- },
781
- {
782
- "name": "label",
783
- "type": {
784
- "text": "string"
785
- },
786
- "default": "''",
787
- "description": "A label to use to describe the avatar to assistive devices.",
788
- "fieldName": "label"
789
- },
790
- {
791
- "name": "initials",
792
- "type": {
793
- "text": "string"
794
- },
795
- "default": "''",
796
- "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
797
- "fieldName": "initials"
798
- },
799
- {
800
- "name": "loading",
801
- "type": {
802
- "text": "'eager' | 'lazy'"
803
- },
804
- "default": "'eager'",
805
- "description": "Indicates how the browser should load the image.",
806
- "fieldName": "loading"
807
- },
808
- {
809
- "name": "shape",
810
- "type": {
811
- "text": "'circle' | 'square' | 'rounded'"
812
- },
813
- "default": "'circle'",
814
- "description": "The shape of the avatar.",
815
- "fieldName": "shape"
816
- }
817
- ],
818
- "superclass": {
819
- "name": "FlowRdfElement",
820
- "module": "/src/internal/flow-ui-rdf-element"
821
- },
822
- "tagName": "flow-ui-avatar",
823
- "summary": "Avatars are used to represent a person or object.",
824
- "dependencies": [
825
- "flow-ui-icon"
826
- ],
827
- "customElement": true
828
- }
829
- ],
830
- "exports": [
831
- {
832
- "kind": "js",
833
- "name": "default",
834
- "declaration": {
835
- "name": "FlowUiAvatar",
836
- "module": "components/avatar/avatar.component.js"
837
- }
838
- }
839
- ]
840
- },
841
- {
842
- "kind": "javascript-module",
843
- "path": "components/avatar/avatar.js",
844
- "declarations": [],
845
- "exports": [
846
- {
847
- "kind": "js",
848
- "name": "default",
849
- "declaration": {
850
- "name": "FlowUiAvatar",
851
- "module": "components/avatar/avatar.js"
852
- }
853
- }
854
- ]
855
- },
856
671
  {
857
672
  "kind": "javascript-module",
858
673
  "path": "components/autocomplete/autocomplete.component.js",
@@ -957,7 +772,7 @@
957
772
  "kind": "field",
958
773
  "name": "debouncedInput",
959
774
  "type": {
960
- "text": "((displayValue: string) => void)"
775
+ "text": "(displayValue: string) => void"
961
776
  },
962
777
  "privacy": "private"
963
778
  },
@@ -1148,7 +963,6 @@
1148
963
  "type": {
1149
964
  "text": "((value: string) => string) | ((value: string) => Promise<string>)"
1150
965
  },
1151
- "default": "(value => value)",
1152
966
  "description": "Function for determining the `displayValue` for a given `value`.\nBy default, it will show the `value` itself.",
1153
967
  "attribute": "displayWith"
1154
968
  },
@@ -1174,6 +988,17 @@
1174
988
  "attribute": "clearable",
1175
989
  "reflects": true
1176
990
  },
991
+ {
992
+ "kind": "field",
993
+ "name": "clearOnFocus",
994
+ "type": {
995
+ "text": "boolean"
996
+ },
997
+ "default": "false",
998
+ "description": "Clear the value when the autocomplete is focused on",
999
+ "attribute": "clear-on-focus",
1000
+ "reflects": true
1001
+ },
1177
1002
  {
1178
1003
  "kind": "field",
1179
1004
  "name": "inputText",
@@ -1514,7 +1339,6 @@
1514
1339
  "type": {
1515
1340
  "text": "((value: string) => string) | ((value: string) => Promise<string>)"
1516
1341
  },
1517
- "default": "(value => value)",
1518
1342
  "description": "Function for determining the `displayValue` for a given `value`.\nBy default, it will show the `value` itself.",
1519
1343
  "fieldName": "displayWith"
1520
1344
  },
@@ -1535,6 +1359,15 @@
1535
1359
  "default": "false",
1536
1360
  "description": "Show the option to clear input",
1537
1361
  "fieldName": "clearable"
1362
+ },
1363
+ {
1364
+ "name": "clear-on-focus",
1365
+ "type": {
1366
+ "text": "boolean"
1367
+ },
1368
+ "default": "false",
1369
+ "description": "Clear the value when the autocomplete is focused on",
1370
+ "fieldName": "clearOnFocus"
1538
1371
  }
1539
1372
  ],
1540
1373
  "superclass": {
@@ -1586,47 +1419,170 @@
1586
1419
  },
1587
1420
  {
1588
1421
  "kind": "javascript-module",
1589
- "path": "components/base-control/base-control.component.js",
1422
+ "path": "components/breadcrumb/breadcrumb.component.js",
1590
1423
  "declarations": [
1591
1424
  {
1592
1425
  "kind": "class",
1593
1426
  "description": "",
1594
- "name": "FlowUiBaseControl",
1427
+ "name": "FlowUiBreadcrumb",
1595
1428
  "cssParts": [
1596
1429
  {
1597
- "description": "The form control that wraps the label, input, and help text.",
1598
- "name": "form-control"
1599
- },
1600
- {
1601
- "description": "The label's wrapper.",
1602
- "name": "form-control-label"
1603
- },
1430
+ "description": "The component's base wrapper.",
1431
+ "name": "base"
1432
+ }
1433
+ ],
1434
+ "slots": [
1604
1435
  {
1605
- "description": "The input's wrapper.",
1606
- "name": "form-control-input"
1436
+ "description": "One or more breadcrumb items to display.",
1437
+ "name": ""
1607
1438
  },
1608
1439
  {
1609
- "description": "The help text's wrapper.",
1610
- "name": "form-control-help-text"
1611
- },
1440
+ "description": "The separator to use between breadcrumb items. Works best with `<flow-ui-icon>`.",
1441
+ "name": "separator"
1442
+ }
1443
+ ],
1444
+ "members": [
1612
1445
  {
1613
- "description": "The component's base wrapper.",
1614
- "name": "base"
1446
+ "kind": "field",
1447
+ "name": "localize",
1448
+ "privacy": "private",
1449
+ "readonly": true,
1450
+ "default": "new LocalizeController(this)"
1615
1451
  },
1616
1452
  {
1617
- "description": "The internal `<input>` control.",
1618
- "name": "input"
1453
+ "kind": "field",
1454
+ "name": "separatorDir",
1455
+ "privacy": "private"
1619
1456
  },
1620
1457
  {
1621
- "description": "The container that wraps the prefix.",
1622
- "name": "prefix"
1458
+ "kind": "field",
1459
+ "name": "defaultSlot",
1460
+ "type": {
1461
+ "text": "HTMLSlotElement"
1462
+ },
1463
+ "privacy": "private"
1623
1464
  },
1624
1465
  {
1625
- "description": "The clear button.",
1626
- "name": "clear-button"
1466
+ "kind": "field",
1467
+ "name": "separatorSlot",
1468
+ "type": {
1469
+ "text": "HTMLSlotElement"
1470
+ },
1471
+ "privacy": "private"
1627
1472
  },
1628
1473
  {
1629
- "description": "The password toggle button.",
1474
+ "kind": "field",
1475
+ "name": "label",
1476
+ "type": {
1477
+ "text": "string"
1478
+ },
1479
+ "default": "''",
1480
+ "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
1481
+ "attribute": "label"
1482
+ },
1483
+ {
1484
+ "kind": "method",
1485
+ "name": "getSeparator",
1486
+ "privacy": "private"
1487
+ },
1488
+ {
1489
+ "kind": "method",
1490
+ "name": "handleSlotChange",
1491
+ "privacy": "private"
1492
+ }
1493
+ ],
1494
+ "attributes": [
1495
+ {
1496
+ "name": "label",
1497
+ "type": {
1498
+ "text": "string"
1499
+ },
1500
+ "default": "''",
1501
+ "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
1502
+ "fieldName": "label"
1503
+ }
1504
+ ],
1505
+ "superclass": {
1506
+ "name": "FlowRdfElement",
1507
+ "module": "/src/internal/flow-ui-rdf-element"
1508
+ },
1509
+ "tagName": "flow-ui-breadcrumb",
1510
+ "summary": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.",
1511
+ "dependencies": [
1512
+ "flow-ui-icon"
1513
+ ],
1514
+ "customElement": true
1515
+ }
1516
+ ],
1517
+ "exports": [
1518
+ {
1519
+ "kind": "js",
1520
+ "name": "default",
1521
+ "declaration": {
1522
+ "name": "FlowUiBreadcrumb",
1523
+ "module": "components/breadcrumb/breadcrumb.component.js"
1524
+ }
1525
+ }
1526
+ ]
1527
+ },
1528
+ {
1529
+ "kind": "javascript-module",
1530
+ "path": "components/breadcrumb/breadcrumb.js",
1531
+ "declarations": [],
1532
+ "exports": [
1533
+ {
1534
+ "kind": "js",
1535
+ "name": "default",
1536
+ "declaration": {
1537
+ "name": "FlowUiBreadcrumb",
1538
+ "module": "components/breadcrumb/breadcrumb.js"
1539
+ }
1540
+ }
1541
+ ]
1542
+ },
1543
+ {
1544
+ "kind": "javascript-module",
1545
+ "path": "components/base-control/base-control.component.js",
1546
+ "declarations": [
1547
+ {
1548
+ "kind": "class",
1549
+ "description": "",
1550
+ "name": "FlowUiBaseControl",
1551
+ "cssParts": [
1552
+ {
1553
+ "description": "The form control that wraps the label, input, and help text.",
1554
+ "name": "form-control"
1555
+ },
1556
+ {
1557
+ "description": "The label's wrapper.",
1558
+ "name": "form-control-label"
1559
+ },
1560
+ {
1561
+ "description": "The input's wrapper.",
1562
+ "name": "form-control-input"
1563
+ },
1564
+ {
1565
+ "description": "The help text's wrapper.",
1566
+ "name": "form-control-help-text"
1567
+ },
1568
+ {
1569
+ "description": "The component's base wrapper.",
1570
+ "name": "base"
1571
+ },
1572
+ {
1573
+ "description": "The internal `<input>` control.",
1574
+ "name": "input"
1575
+ },
1576
+ {
1577
+ "description": "The container that wraps the prefix.",
1578
+ "name": "prefix"
1579
+ },
1580
+ {
1581
+ "description": "The clear button.",
1582
+ "name": "clear-button"
1583
+ },
1584
+ {
1585
+ "description": "The password toggle button.",
1630
1586
  "name": "password-toggle-button"
1631
1587
  },
1632
1588
  {
@@ -2047,114 +2003,160 @@
2047
2003
  },
2048
2004
  {
2049
2005
  "kind": "javascript-module",
2050
- "path": "components/badge/badge.component.js",
2006
+ "path": "components/avatar/avatar.component.js",
2051
2007
  "declarations": [
2052
2008
  {
2053
2009
  "kind": "class",
2054
2010
  "description": "",
2055
- "name": "FlowUiBadge",
2011
+ "name": "FlowUiAvatar",
2012
+ "cssProperties": [
2013
+ {
2014
+ "description": "The size of the avatar.",
2015
+ "name": "--size"
2016
+ }
2017
+ ],
2056
2018
  "cssParts": [
2057
2019
  {
2058
2020
  "description": "The component's base wrapper.",
2059
2021
  "name": "base"
2022
+ },
2023
+ {
2024
+ "description": "The container that wraps the avatar's icon.",
2025
+ "name": "icon"
2026
+ },
2027
+ {
2028
+ "description": "The container that wraps the avatar's initials.",
2029
+ "name": "initials"
2030
+ },
2031
+ {
2032
+ "description": "The avatar image. Only shown when the `image` attribute is set.",
2033
+ "name": "image"
2060
2034
  }
2061
2035
  ],
2062
2036
  "slots": [
2063
2037
  {
2064
- "description": "The badge's content.",
2065
- "name": ""
2038
+ "description": "The default icon to use when no image or initials are present. Works best with `<flow-ui-icon>`.",
2039
+ "name": "icon"
2066
2040
  }
2067
2041
  ],
2068
2042
  "members": [
2069
2043
  {
2070
2044
  "kind": "field",
2071
- "name": "variant",
2045
+ "name": "hasError",
2072
2046
  "type": {
2073
- "text": "'primary' | 'secondary' | 'success' | 'neutral' | 'warning' | 'danger'"
2047
+ "text": "boolean"
2074
2048
  },
2075
- "default": "'primary'",
2076
- "description": "The badge's theme variant.",
2077
- "attribute": "variant",
2078
- "reflects": true
2049
+ "privacy": "private",
2050
+ "default": "false"
2079
2051
  },
2080
2052
  {
2081
2053
  "kind": "field",
2082
- "name": "size",
2054
+ "name": "image",
2083
2055
  "type": {
2084
- "text": "'small' | 'medium' | 'large'"
2056
+ "text": "string"
2085
2057
  },
2086
- "default": "'medium'",
2087
- "description": "The badge size.",
2088
- "attribute": "size",
2089
- "reflects": true
2058
+ "default": "''",
2059
+ "description": "The image source to use for the avatar.",
2060
+ "attribute": "image"
2090
2061
  },
2091
2062
  {
2092
2063
  "kind": "field",
2093
- "name": "pill",
2064
+ "name": "label",
2094
2065
  "type": {
2095
- "text": "boolean"
2066
+ "text": "string"
2096
2067
  },
2097
- "default": "false",
2098
- "description": "Draws a pill-style badge with rounded edges.",
2099
- "attribute": "pill",
2100
- "reflects": true
2068
+ "default": "''",
2069
+ "description": "A label to use to describe the avatar to assistive devices.",
2070
+ "attribute": "label"
2101
2071
  },
2102
2072
  {
2103
2073
  "kind": "field",
2104
- "name": "pulse",
2074
+ "name": "initials",
2105
2075
  "type": {
2106
- "text": "boolean"
2076
+ "text": "string"
2107
2077
  },
2108
- "default": "false",
2109
- "description": "Makes the badge pulsate to draw attention.",
2110
- "attribute": "pulse",
2078
+ "default": "''",
2079
+ "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
2080
+ "attribute": "initials"
2081
+ },
2082
+ {
2083
+ "kind": "field",
2084
+ "name": "loading",
2085
+ "type": {
2086
+ "text": "'eager' | 'lazy'"
2087
+ },
2088
+ "default": "'eager'",
2089
+ "description": "Indicates how the browser should load the image.",
2090
+ "attribute": "loading"
2091
+ },
2092
+ {
2093
+ "kind": "field",
2094
+ "name": "shape",
2095
+ "type": {
2096
+ "text": "'circle' | 'square' | 'rounded'"
2097
+ },
2098
+ "default": "'circle'",
2099
+ "description": "The shape of the avatar.",
2100
+ "attribute": "shape",
2111
2101
  "reflects": true
2112
2102
  }
2113
2103
  ],
2114
2104
  "attributes": [
2115
2105
  {
2116
- "name": "variant",
2106
+ "name": "image",
2117
2107
  "type": {
2118
- "text": "'primary' | 'secondary' | 'success' | 'neutral' | 'warning' | 'danger'"
2108
+ "text": "string"
2119
2109
  },
2120
- "default": "'primary'",
2121
- "description": "The badge's theme variant.",
2122
- "fieldName": "variant"
2110
+ "default": "''",
2111
+ "description": "The image source to use for the avatar.",
2112
+ "fieldName": "image"
2123
2113
  },
2124
2114
  {
2125
- "name": "size",
2115
+ "name": "label",
2126
2116
  "type": {
2127
- "text": "'small' | 'medium' | 'large'"
2117
+ "text": "string"
2128
2118
  },
2129
- "default": "'medium'",
2130
- "description": "The badge size.",
2131
- "fieldName": "size"
2119
+ "default": "''",
2120
+ "description": "A label to use to describe the avatar to assistive devices.",
2121
+ "fieldName": "label"
2132
2122
  },
2133
2123
  {
2134
- "name": "pill",
2124
+ "name": "initials",
2135
2125
  "type": {
2136
- "text": "boolean"
2126
+ "text": "string"
2137
2127
  },
2138
- "default": "false",
2139
- "description": "Draws a pill-style badge with rounded edges.",
2140
- "fieldName": "pill"
2128
+ "default": "''",
2129
+ "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
2130
+ "fieldName": "initials"
2141
2131
  },
2142
2132
  {
2143
- "name": "pulse",
2133
+ "name": "loading",
2144
2134
  "type": {
2145
- "text": "boolean"
2135
+ "text": "'eager' | 'lazy'"
2146
2136
  },
2147
- "default": "false",
2148
- "description": "Makes the badge pulsate to draw attention.",
2149
- "fieldName": "pulse"
2137
+ "default": "'eager'",
2138
+ "description": "Indicates how the browser should load the image.",
2139
+ "fieldName": "loading"
2140
+ },
2141
+ {
2142
+ "name": "shape",
2143
+ "type": {
2144
+ "text": "'circle' | 'square' | 'rounded'"
2145
+ },
2146
+ "default": "'circle'",
2147
+ "description": "The shape of the avatar.",
2148
+ "fieldName": "shape"
2150
2149
  }
2151
2150
  ],
2152
2151
  "superclass": {
2153
2152
  "name": "FlowRdfElement",
2154
2153
  "module": "/src/internal/flow-ui-rdf-element"
2155
2154
  },
2156
- "tagName": "flow-ui-badge",
2157
- "summary": "Badges are used to draw attention and display statuses or counts.",
2155
+ "tagName": "flow-ui-avatar",
2156
+ "summary": "Avatars are used to represent a person or object.",
2157
+ "dependencies": [
2158
+ "flow-ui-icon"
2159
+ ],
2158
2160
  "customElement": true
2159
2161
  }
2160
2162
  ],
@@ -2163,35 +2165,35 @@
2163
2165
  "kind": "js",
2164
2166
  "name": "default",
2165
2167
  "declaration": {
2166
- "name": "FlowUiBadge",
2167
- "module": "components/badge/badge.component.js"
2168
+ "name": "FlowUiAvatar",
2169
+ "module": "components/avatar/avatar.component.js"
2168
2170
  }
2169
2171
  }
2170
2172
  ]
2171
2173
  },
2172
2174
  {
2173
2175
  "kind": "javascript-module",
2174
- "path": "components/badge/badge.js",
2176
+ "path": "components/avatar/avatar.js",
2175
2177
  "declarations": [],
2176
2178
  "exports": [
2177
2179
  {
2178
2180
  "kind": "js",
2179
2181
  "name": "default",
2180
2182
  "declaration": {
2181
- "name": "FlowUiBadge",
2182
- "module": "components/badge/badge.js"
2183
+ "name": "FlowUiAvatar",
2184
+ "module": "components/avatar/avatar.js"
2183
2185
  }
2184
2186
  }
2185
2187
  ]
2186
2188
  },
2187
2189
  {
2188
2190
  "kind": "javascript-module",
2189
- "path": "components/breadcrumb/breadcrumb.component.js",
2191
+ "path": "components/badge/badge.component.js",
2190
2192
  "declarations": [
2191
2193
  {
2192
2194
  "kind": "class",
2193
2195
  "description": "",
2194
- "name": "FlowUiBreadcrumb",
2196
+ "name": "FlowUiBadge",
2195
2197
  "cssParts": [
2196
2198
  {
2197
2199
  "description": "The component's base wrapper.",
@@ -2200,84 +2202,100 @@
2200
2202
  ],
2201
2203
  "slots": [
2202
2204
  {
2203
- "description": "One or more breadcrumb items to display.",
2205
+ "description": "The badge's content.",
2204
2206
  "name": ""
2205
- },
2206
- {
2207
- "description": "The separator to use between breadcrumb items. Works best with `<flow-ui-icon>`.",
2208
- "name": "separator"
2209
2207
  }
2210
2208
  ],
2211
2209
  "members": [
2212
2210
  {
2213
2211
  "kind": "field",
2214
- "name": "localize",
2215
- "privacy": "private",
2216
- "readonly": true,
2217
- "default": "new LocalizeController(this)"
2212
+ "name": "variant",
2213
+ "type": {
2214
+ "text": "'primary' | 'secondary' | 'success' | 'neutral' | 'warning' | 'danger'"
2215
+ },
2216
+ "default": "'primary'",
2217
+ "description": "The badge's theme variant.",
2218
+ "attribute": "variant",
2219
+ "reflects": true
2218
2220
  },
2219
2221
  {
2220
2222
  "kind": "field",
2221
- "name": "separatorDir",
2222
- "privacy": "private"
2223
+ "name": "size",
2224
+ "type": {
2225
+ "text": "'small' | 'medium' | 'large'"
2226
+ },
2227
+ "default": "'medium'",
2228
+ "description": "The badge size.",
2229
+ "attribute": "size",
2230
+ "reflects": true
2223
2231
  },
2224
2232
  {
2225
2233
  "kind": "field",
2226
- "name": "defaultSlot",
2234
+ "name": "pill",
2227
2235
  "type": {
2228
- "text": "HTMLSlotElement"
2236
+ "text": "boolean"
2229
2237
  },
2230
- "privacy": "private"
2238
+ "default": "false",
2239
+ "description": "Draws a pill-style badge with rounded edges.",
2240
+ "attribute": "pill",
2241
+ "reflects": true
2231
2242
  },
2232
2243
  {
2233
2244
  "kind": "field",
2234
- "name": "separatorSlot",
2245
+ "name": "pulse",
2235
2246
  "type": {
2236
- "text": "HTMLSlotElement"
2247
+ "text": "boolean"
2237
2248
  },
2238
- "privacy": "private"
2239
- },
2249
+ "default": "false",
2250
+ "description": "Makes the badge pulsate to draw attention.",
2251
+ "attribute": "pulse",
2252
+ "reflects": true
2253
+ }
2254
+ ],
2255
+ "attributes": [
2240
2256
  {
2241
- "kind": "field",
2242
- "name": "label",
2257
+ "name": "variant",
2243
2258
  "type": {
2244
- "text": "string"
2259
+ "text": "'primary' | 'secondary' | 'success' | 'neutral' | 'warning' | 'danger'"
2245
2260
  },
2246
- "default": "''",
2247
- "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
2248
- "attribute": "label"
2261
+ "default": "'primary'",
2262
+ "description": "The badge's theme variant.",
2263
+ "fieldName": "variant"
2249
2264
  },
2250
2265
  {
2251
- "kind": "method",
2252
- "name": "getSeparator",
2253
- "privacy": "private"
2266
+ "name": "size",
2267
+ "type": {
2268
+ "text": "'small' | 'medium' | 'large'"
2269
+ },
2270
+ "default": "'medium'",
2271
+ "description": "The badge size.",
2272
+ "fieldName": "size"
2254
2273
  },
2255
2274
  {
2256
- "kind": "method",
2257
- "name": "handleSlotChange",
2258
- "privacy": "private"
2259
- }
2260
- ],
2261
- "attributes": [
2275
+ "name": "pill",
2276
+ "type": {
2277
+ "text": "boolean"
2278
+ },
2279
+ "default": "false",
2280
+ "description": "Draws a pill-style badge with rounded edges.",
2281
+ "fieldName": "pill"
2282
+ },
2262
2283
  {
2263
- "name": "label",
2284
+ "name": "pulse",
2264
2285
  "type": {
2265
- "text": "string"
2286
+ "text": "boolean"
2266
2287
  },
2267
- "default": "''",
2268
- "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
2269
- "fieldName": "label"
2288
+ "default": "false",
2289
+ "description": "Makes the badge pulsate to draw attention.",
2290
+ "fieldName": "pulse"
2270
2291
  }
2271
2292
  ],
2272
2293
  "superclass": {
2273
2294
  "name": "FlowRdfElement",
2274
2295
  "module": "/src/internal/flow-ui-rdf-element"
2275
2296
  },
2276
- "tagName": "flow-ui-breadcrumb",
2277
- "summary": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.",
2278
- "dependencies": [
2279
- "flow-ui-icon"
2280
- ],
2297
+ "tagName": "flow-ui-badge",
2298
+ "summary": "Badges are used to draw attention and display statuses or counts.",
2281
2299
  "customElement": true
2282
2300
  }
2283
2301
  ],
@@ -2286,23 +2304,23 @@
2286
2304
  "kind": "js",
2287
2305
  "name": "default",
2288
2306
  "declaration": {
2289
- "name": "FlowUiBreadcrumb",
2290
- "module": "components/breadcrumb/breadcrumb.component.js"
2307
+ "name": "FlowUiBadge",
2308
+ "module": "components/badge/badge.component.js"
2291
2309
  }
2292
2310
  }
2293
2311
  ]
2294
2312
  },
2295
2313
  {
2296
2314
  "kind": "javascript-module",
2297
- "path": "components/breadcrumb/breadcrumb.js",
2315
+ "path": "components/badge/badge.js",
2298
2316
  "declarations": [],
2299
2317
  "exports": [
2300
2318
  {
2301
2319
  "kind": "js",
2302
2320
  "name": "default",
2303
2321
  "declaration": {
2304
- "name": "FlowUiBreadcrumb",
2305
- "module": "components/breadcrumb/breadcrumb.js"
2322
+ "name": "FlowUiBadge",
2323
+ "module": "components/badge/badge.js"
2306
2324
  }
2307
2325
  }
2308
2326
  ]
@@ -25718,6 +25736,6 @@
25718
25736
  ],
25719
25737
  "package": {
25720
25738
  "name": "@emuanalytics/flow-rdf-ui",
25721
- "version": "4.1.6"
25739
+ "version": "4.1.8"
25722
25740
  }
25723
25741
  }
package/dist/index.d.mts CHANGED
@@ -2032,6 +2032,8 @@ declare class FlowUiAutocomplete extends FlowRdfFormControl {
2032
2032
  debounceDelay: number;
2033
2033
  /** Show the option to clear input */
2034
2034
  clearable: boolean;
2035
+ /** Clear the value when the autocomplete is focused on */
2036
+ clearOnFocus: boolean;
2035
2037
  /** Current value displayed by the control; this can be what the user is typing or the label of the selected option */
2036
2038
  private inputText;
2037
2039
  /** @internal Is the listbox open or not */
@@ -2093,7 +2095,7 @@ declare class FlowUiAutocomplete extends FlowRdfFormControl {
2093
2095
  private handleInputBlur;
2094
2096
  handleClearClick(event: MouseEvent): void;
2095
2097
  /** @internal Handle the `mousedown` event from the clear button */
2096
- handleClearMouseDown(event: MouseEvent): void;
2098
+ handleClearMouseDown(event: MouseEvent): Promise<void>;
2097
2099
  /** @internal Handle option selection when an option is clicked on */
2098
2100
  private handleListboxClick;
2099
2101
  /** @internal Handle mouse and keyboard events in the document, outside the control. */
package/dist/index.d.ts CHANGED
@@ -2032,6 +2032,8 @@ declare class FlowUiAutocomplete extends FlowRdfFormControl {
2032
2032
  debounceDelay: number;
2033
2033
  /** Show the option to clear input */
2034
2034
  clearable: boolean;
2035
+ /** Clear the value when the autocomplete is focused on */
2036
+ clearOnFocus: boolean;
2035
2037
  /** Current value displayed by the control; this can be what the user is typing or the label of the selected option */
2036
2038
  private inputText;
2037
2039
  /** @internal Is the listbox open or not */
@@ -2093,7 +2095,7 @@ declare class FlowUiAutocomplete extends FlowRdfFormControl {
2093
2095
  private handleInputBlur;
2094
2096
  handleClearClick(event: MouseEvent): void;
2095
2097
  /** @internal Handle the `mousedown` event from the clear button */
2096
- handleClearMouseDown(event: MouseEvent): void;
2098
+ handleClearMouseDown(event: MouseEvent): Promise<void>;
2097
2099
  /** @internal Handle option selection when an option is clicked on */
2098
2100
  private handleListboxClick;
2099
2101
  /** @internal Handle mouse and keyboard events in the document, outside the control. */
package/dist/package.json.mjs CHANGED
@@ -1,3 +1,3 @@
1
- const version = "4.1.6";
1
+ const version = "4.1.8";
2
2
 
3
3
  export { version };
package/dist/vscode.html-custom-data.json CHANGED
@@ -97,42 +97,6 @@
97
97
  ],
98
98
  "references": []
99
99
  },
100
- {
101
- "name": "flow-ui-avatar",
102
- "description": "Avatars are used to represent a person or object.\n\n\n---\n\n\n\n\n### **Slots:**\n - **icon** - The default icon to use when no image or initials are present. Works best with `<flow-ui-icon>`.\n\n### **CSS Properties:**\n - **--size** - The size of the avatar. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **icon** - The container that wraps the avatar's icon.\n- **initials** - The container that wraps the avatar's initials.\n- **image** - The avatar image. Only shown when the `image` attribute is set.",
103
- "attributes": [
104
- {
105
- "name": "image",
106
- "description": "The image source to use for the avatar.",
107
- "values": []
108
- },
109
- {
110
- "name": "label",
111
- "description": "A label to use to describe the avatar to assistive devices.",
112
- "values": []
113
- },
114
- {
115
- "name": "initials",
116
- "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
117
- "values": []
118
- },
119
- {
120
- "name": "loading",
121
- "description": "Indicates how the browser should load the image.",
122
- "values": [{ "name": "eager" }, { "name": "lazy" }]
123
- },
124
- {
125
- "name": "shape",
126
- "description": "The shape of the avatar.",
127
- "values": [
128
- { "name": "circle" },
129
- { "name": "square" },
130
- { "name": "rounded" }
131
- ]
132
- }
133
- ],
134
- "references": []
135
- },
136
100
  {
137
101
  "name": "flow-ui-autocomplete",
138
102
  "description": "The Autocomplete is a Text input enhanced by a panel of suggested options.\n\n\n---\n\n\n\n\n### **Events:**\n - **flow-ui-input** - Emitted when the display value changes.\n- **flow-ui-change** - Emitted when the input value changes.\n- **flow-ui-focus** - Emitted when the input is focused.\n- **flow-ui-blur** - Emitted when the input is blurred.\n- **flow-ui-show** - Emitted when the dropdown is shown.\n- **flow-ui-after-show** - Emitted when the dropdown is shown.\n- **flow-ui-hide** - Emitted when the dropdown is hidden.\n- **flow-ui-after-hide** - Emitted when the dropdown is hidden.\n- **flow-ui-invalid** - Emitted when the input is invalid.\n- **flow-ui-valid** - Emitted when the input is valid.\n- **flow-ui-validate** - Emitted when the input is validated.\n- **flow-ui-validate-complete** - Emitted when the input is validated and the validity state is updated.\n- **flow-ui-validate-error** - Emitted when the input is validated and an error occurs.\n- **flow-ui-validate-success** - Emitted when the input is validated and no errors occur.\n\n### **Methods:**\n - **getForm(): _HTMLFormElement | null_** - Gets the associated form, if one exists.\n- **checkValidity(): _boolean_** - Checks for validity but does not show a validation message. Returns `true` when valid and `false` when invalid.\n- **reportValidity(): _boolean_** - Checks for validity and shows the browser's validation message if the control is invalid.\n- **setCustomValidity(_: _string_)** - Sets a custom validation message. Pass an empty string to restore validity.\n- **focus()** - Focuses on the control\n- **blur()** - Blurs from the control.\n- **show()** - Shows the listbox.\n- **hide()** - Hides the listbox.\n- **getInputText()** - Gets the current value of the text input\n\n### **Slots:**\n - _default_ - The listbox options. Must be `<flow-option>` elements. You can use `<flow-divider>` to group items visually.\n- **label** - The input's label. Alternatively, you can use the `label` attribute.\n- **prefix** - Used to prepend a presentational icon or similar element to the combobox.\n- **suffix** - Used to append a presentational icon or similar element to the combobox.\n- **clear-icon** - An icon to use in lieu of the default clear icon.\n- **help-text** - Text that describes how to use the input. Alternatively, you can use the `help-text` attribute.\n\n### **CSS Parts:**\n - **form-control** - The form control that wraps the label, input, and help text.\n- **form-control-label** - The label's wrapper.\n- **form-control-input** - The select's wrapper.\n- **form-control-help-text** - The help text's wrapper.\n- **combobox** - The container the wraps the prefix, suffix, combobox, clear icon, and expand button.\n- **prefix** - The container that wraps the prefix slot.\n- **suffix** - The container that wraps the suffix slot.\n- **display-input** - The element that displays the selected option's label, an `<input>` element.\n- **listbox** - The listbox container where options are slotted.\n- **clear-button** - The clear button.",
@@ -228,6 +192,23 @@
228
192
  "name": "clearable",
229
193
  "description": "Show the option to clear input",
230
194
  "values": []
195
+ },
196
+ {
197
+ "name": "clear-on-focus",
198
+ "description": "Clear the value when the autocomplete is focused on",
199
+ "values": []
200
+ }
201
+ ],
202
+ "references": []
203
+ },
204
+ {
205
+ "name": "flow-ui-breadcrumb",
206
+ "description": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.\n\n\n---\n\n\n\n\n### **Slots:**\n - _default_ - One or more breadcrumb items to display.\n- **separator** - The separator to use between breadcrumb items. Works best with `<flow-ui-icon>`.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
207
+ "attributes": [
208
+ {
209
+ "name": "label",
210
+ "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
211
+ "values": []
231
212
  }
232
213
  ],
233
214
  "references": []
@@ -293,6 +274,42 @@
293
274
  ],
294
275
  "references": []
295
276
  },
277
+ {
278
+ "name": "flow-ui-avatar",
279
+ "description": "Avatars are used to represent a person or object.\n\n\n---\n\n\n\n\n### **Slots:**\n - **icon** - The default icon to use when no image or initials are present. Works best with `<flow-ui-icon>`.\n\n### **CSS Properties:**\n - **--size** - The size of the avatar. _(default: undefined)_\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **icon** - The container that wraps the avatar's icon.\n- **initials** - The container that wraps the avatar's initials.\n- **image** - The avatar image. Only shown when the `image` attribute is set.",
280
+ "attributes": [
281
+ {
282
+ "name": "image",
283
+ "description": "The image source to use for the avatar.",
284
+ "values": []
285
+ },
286
+ {
287
+ "name": "label",
288
+ "description": "A label to use to describe the avatar to assistive devices.",
289
+ "values": []
290
+ },
291
+ {
292
+ "name": "initials",
293
+ "description": "Initials to use as a fallback when no image is available (1-2 characters max recommended).",
294
+ "values": []
295
+ },
296
+ {
297
+ "name": "loading",
298
+ "description": "Indicates how the browser should load the image.",
299
+ "values": [{ "name": "eager" }, { "name": "lazy" }]
300
+ },
301
+ {
302
+ "name": "shape",
303
+ "description": "The shape of the avatar.",
304
+ "values": [
305
+ { "name": "circle" },
306
+ { "name": "square" },
307
+ { "name": "rounded" }
308
+ ]
309
+ }
310
+ ],
311
+ "references": []
312
+ },
296
313
  {
297
314
  "name": "flow-ui-badge",
298
315
  "description": "Badges are used to draw attention and display statuses or counts.\n\n\n---\n\n\n\n\n### **Slots:**\n - _default_ - The badge's content.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
@@ -331,18 +348,6 @@
331
348
  ],
332
349
  "references": []
333
350
  },
334
- {
335
- "name": "flow-ui-breadcrumb",
336
- "description": "Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.\n\n\n---\n\n\n\n\n### **Slots:**\n - _default_ - One or more breadcrumb items to display.\n- **separator** - The separator to use between breadcrumb items. Works best with `<flow-ui-icon>`.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.",
337
- "attributes": [
338
- {
339
- "name": "label",
340
- "description": "The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by\nscreen readers and other assistive devices to provide more context for users.",
341
- "values": []
342
- }
343
- ],
344
- "references": []
345
- },
346
351
  {
347
352
  "name": "flow-ui-breadcrumb-item",
348
353
  "description": "Breadcrumb Items are used inside [breadcrumbs](./flow-ui-breadcrumb) to represent different links.\n\n\n---\n\n\n\n\n### **Slots:**\n - _default_ - The breadcrumb item's label.\n- **prefix** - An optional prefix, usually an icon or icon button.\n- **suffix** - An optional suffix, usually an icon or icon button.\n- **separator** - The separator to use for the breadcrumb item. This will only change the separator for this item. If you want to change it for all items in the group, set the separator on `<flow-ui-breadcrumb>` instead.\n\n### **CSS Parts:**\n - **base** - The component's base wrapper.\n- **label** - The breadcrumb item's label.\n- **prefix** - The container that wraps the prefix.\n- **suffix** - The container that wraps the suffix.\n- **separator** - The container that wraps the separator.",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@emuanalytics/flow-rdf-ui",
3
- "version": "4.1.6",
3
+ "version": "4.1.8",
4
4
  "type": "module",
5
5
  "module": "dist/index.mjs",
6
6
  "types": "dist/index.d.ts",
@@ -104,13 +104,13 @@
104
104
  "vite": "^4.3.9",
105
105
  "vite-plugin-dts": "^3.5.1",
106
106
  "webdriverio": "^8.14.3",
107
- "@emuanalytics/flow-rdf-core": "4.0.11"
107
+ "@emuanalytics/flow-rdf-core": "4.0.12"
108
108
  },
109
109
  "peerDependencies": {
110
110
  "chart.js": "^4.4.2",
111
111
  "lit": "^2.7.2",
112
112
  "lit-html": "^2.7.5",
113
- "@emuanalytics/flow-rdf-core": "~4.0.11"
113
+ "@emuanalytics/flow-rdf-core": "~4.0.12"
114
114
  },
115
115
  "scripts": {
116
116
  "dev": "vite",