@vonage/vivid 3.9.0 → 3.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (123) hide show
  1. package/alert/index.js +28 -0
  2. package/avatar/index.js +1 -1
  3. package/badge/index.js +1 -1
  4. package/banner/index.js +3 -3
  5. package/breadcrumb/index.js +1 -1
  6. package/breadcrumb-item/index.js +1 -1
  7. package/button/index.js +2 -2
  8. package/calendar/index.js +1 -1
  9. package/calendar-event/index.js +1 -1
  10. package/card/index.js +2 -2
  11. package/checkbox/index.js +1 -1
  12. package/combobox/index.js +6 -6
  13. package/custom-elements.json +269 -27
  14. package/data-grid/index.js +1 -1
  15. package/dialog/index.js +4 -4
  16. package/divider/index.js +1 -1
  17. package/elevation/index.js +1 -1
  18. package/fab/index.js +1 -1
  19. package/header/index.js +2 -2
  20. package/index.js +51 -50
  21. package/layout/index.js +1 -1
  22. package/lib/alert/alert.d.ts +24 -0
  23. package/lib/alert/alert.template.d.ts +4 -0
  24. package/lib/alert/definition.d.ts +2 -0
  25. package/lib/alert/index.d.ts +1 -0
  26. package/lib/components.d.ts +1 -0
  27. package/lib/text-area/text-area.d.ts +2 -1
  28. package/lib/tooltip/tooltip.d.ts +1 -0
  29. package/listbox/index.js +2 -2
  30. package/menu/index.js +6 -6
  31. package/menu-item/index.js +1 -1
  32. package/nav/index.js +1 -1
  33. package/nav-disclosure/index.js +1 -1
  34. package/nav-item/index.js +1 -1
  35. package/note/index.js +1 -1
  36. package/number-field/index.js +4 -4
  37. package/option/index.js +1 -1
  38. package/package.json +1 -1
  39. package/popup/index.js +4 -4
  40. package/progress/index.js +1 -1
  41. package/progress-ring/index.js +1 -1
  42. package/radio/index.js +1 -1
  43. package/radio-group/index.js +1 -1
  44. package/select/index.js +6 -6
  45. package/shared/definition.js +1 -1
  46. package/shared/definition10.js +46 -63
  47. package/shared/definition11.js +38 -92
  48. package/shared/definition12.js +96 -31
  49. package/shared/definition13.js +84 -757
  50. package/shared/definition14.js +32 -95
  51. package/shared/definition15.js +758 -100
  52. package/shared/definition16.js +103 -24
  53. package/shared/definition17.js +96 -154
  54. package/shared/definition18.js +108 -663
  55. package/shared/definition19.js +667 -1532
  56. package/shared/definition2.js +1 -1
  57. package/shared/definition20.js +1544 -223
  58. package/shared/definition21.js +183 -964
  59. package/shared/definition22.js +1037 -222
  60. package/shared/definition23.js +226 -67
  61. package/shared/definition24.js +68 -77
  62. package/shared/definition25.js +76 -47
  63. package/shared/definition26.js +46 -32
  64. package/shared/definition27.js +35 -49
  65. package/shared/definition28.js +48 -344
  66. package/shared/definition29.js +273 -282
  67. package/shared/definition30.js +356 -14
  68. package/shared/definition31.js +13 -67
  69. package/shared/definition32.js +65 -21
  70. package/shared/definition33.js +21 -39
  71. package/shared/definition34.js +31 -432
  72. package/shared/definition35.js +432 -76
  73. package/shared/definition36.js +82 -33
  74. package/shared/definition37.js +31 -422
  75. package/shared/definition38.js +357 -564
  76. package/shared/definition39.js +628 -75
  77. package/shared/definition4.js +1 -1
  78. package/shared/definition40.js +70 -573
  79. package/shared/definition41.js +538 -81
  80. package/shared/definition42.js +127 -47
  81. package/shared/definition43.js +51 -16
  82. package/shared/definition44.js +17 -425
  83. package/shared/definition45.js +421 -103
  84. package/shared/definition46.js +114 -19
  85. package/shared/definition47.js +19 -269
  86. package/shared/definition48.js +244 -86
  87. package/shared/definition49.js +110 -70
  88. package/shared/definition5.js +1 -1
  89. package/shared/definition50.js +80 -67
  90. package/shared/definition51.js +69 -295
  91. package/shared/definition52.js +305 -0
  92. package/shared/definition6.js +142 -45
  93. package/shared/definition7.js +95 -23
  94. package/shared/definition8.js +22 -103
  95. package/shared/definition9.js +62 -102
  96. package/shared/es.object.assign.js +1 -1
  97. package/shared/form-associated.js +1 -1
  98. package/shared/form-elements.js +2 -2
  99. package/shared/index.js +1 -1
  100. package/shared/listbox.js +2 -2
  101. package/shared/patterns/form-elements/form-elements.d.ts +4 -4
  102. package/shared/repeat.js +1 -1
  103. package/shared/text-field.js +1 -1
  104. package/shared/text-field2.js +1 -1
  105. package/side-drawer/index.js +1 -1
  106. package/slider/index.js +1 -1
  107. package/styles/core/all.css +1 -1
  108. package/styles/core/theme.css +1 -1
  109. package/styles/core/typography.css +1 -1
  110. package/styles/tokens/theme-dark.css +4 -4
  111. package/styles/tokens/theme-light.css +4 -4
  112. package/switch/index.js +1 -1
  113. package/tab/index.js +1 -1
  114. package/tab-panel/index.js +1 -1
  115. package/tabs/index.js +3 -3
  116. package/tag/index.js +1 -1
  117. package/tag-group/index.js +1 -1
  118. package/text-area/index.js +1 -1
  119. package/text-field/index.js +1 -1
  120. package/tooltip/index.js +5 -5
  121. package/tree-item/index.js +1 -1
  122. package/tree-view/index.js +1 -1
  123. package/vivid.api.json +91 -0
@@ -1,111 +1,48 @@
1
- import { G as _export, i as descriptors, g as global$1, k as functionUncurryThis, B as hasOwnProperty_1, m as isCallable$1, f as objectDefineProperty, a4 as copyConstructorProperties$1, j as objectIsPrototypeOf, h as html, r as registerFactory } from './index.js';
2
- import { C as CalendarEvent } from './calendar-event.js';
3
- import './es.object.assign.js';
4
- import { t as toString$1 } from './to-string.js';
1
+ import { _ as __decorate, a as attr, b as __metadata, h as html, r as registerFactory } from './index.js';
2
+ import { i as iconRegistries } from './definition3.js';
3
+ import { f as focusRegistries } from './definition4.js';
4
+ import { B as BreadcrumbItem$1 } from './breadcrumb-item.js';
5
+ import { t as textAnchorTemplate } from './text-anchor.template.js';
6
+ import { I as Icon } from './icon.js';
5
7
  import { w as when } from './when.js';
6
8
  import { c as classNames } from './class-names.js';
7
9
 
8
- var css_248z = "/**\n * Do not edit directly\n * Generated on Mon, 24 Apr 2023 10:27:51 GMT\n */\n:host {\n display: contents;\n}\n\n.base {\n /* 4 as the indentation limit */\n /* per cell divider */\n /* per cell divider */\n --vvd-calendar-event--indent: calc(0px + var(--vvd-calendar-event--overlap-count, 0) * 8px);\n position: absolute;\n z-index: var(--vvd-calendar-event--overlap-count);\n top: calc(var(--vvd-calendar-event--start, 0) * (100% - 23px) / 24 + calc(1px * var(--vvd-calendar-event--start, 0)));\n overflow: hidden;\n box-sizing: border-box;\n padding: 4px 8px;\n background-color: var(--_appearance-color-fill);\n block-size: calc(var(--vvd-calendar-event--duration, 1) * calc((100% - 23px) / 24) + calc(1px * (var(--vvd-calendar-event--duration, 1) - 1)) - 4px);\n border-radius: 6px;\n box-shadow: inset 0 0 0 1px var(--_appearance-color-outline);\n color: var(--_appearance-color-text);\n inline-size: calc(100% - 8px - min(var(--vvd-calendar-event--indent), 32px));\n margin-block-start: 2px;\n margin-inline-end: 8px;\n margin-inline-start: min(var(--vvd-calendar-event--indent), 32px);\n max-block-size: calc(100% - calc(var(--vvd-calendar-event--start, 0) * (100% - 23px) / 24 + calc(1px * var(--vvd-calendar-event--start, 0))) - 4px);\n}\n.base.connotation-accent {\n --_connotation-color-primary: var(--vvd-color-canvas-text);\n --_connotation-color-primary-text: var(--vvd-color-canvas);\n --_connotation-color-contrast: var(--vvd-color-neutral-800);\n --_connotation-color-soft: var(--vvd-color-neutral-100);\n}\n.base.connotation-cta {\n --_connotation-color-primary: var(--vvd-color-cta-500);\n --_connotation-color-primary-text: var(--vvd-color-canvas);\n --_connotation-color-contrast: var(--vvd-color-cta-800);\n --_connotation-color-soft: var(--vvd-color-cta-100);\n}\n.base.connotation-success {\n --_connotation-color-primary: var(--vvd-color-success-500);\n --_connotation-color-primary-text: var(--vvd-color-canvas);\n --_connotation-color-contrast: var(--vvd-color-success-800);\n --_connotation-color-soft: var(--vvd-color-success-100);\n}\n.base.connotation-alert {\n --_connotation-color-primary: var(--vvd-color-alert-500);\n --_connotation-color-primary-text: var(--vvd-color-canvas);\n --_connotation-color-contrast: var(--vvd-color-alert-800);\n --_connotation-color-soft: var(--vvd-color-alert-100);\n}\n.base.connotation-warning {\n --_connotation-color-primary: var(--vvd-color-warning-300);\n --_connotation-color-primary-text: var(--vvd-color-canvas-text);\n --_connotation-color-contrast: var(--vvd-color-warning-800);\n --_connotation-color-soft: var(--vvd-color-warning-100);\n}\n.base.connotation-announcement {\n --_connotation-color-primary: var(--vvd-color-announcement-500);\n --_connotation-color-primary-text: var(--vvd-color-canvas);\n --_connotation-color-contrast: var(--vvd-color-announcement-800);\n --_connotation-color-soft: var(--vvd-color-announcement-100);\n}\n.base:not(.connotation-accent, .connotation-cta, .connotation-success, .connotation-alert, .connotation-warning, .connotation-announcement) {\n --_connotation-color-primary: var(--vvd-color-information-500);\n --_connotation-color-primary-text: var(--vvd-color-canvas);\n --_connotation-color-contrast: var(--vvd-color-information-800);\n --_connotation-color-soft: var(--vvd-color-information-100);\n}\n.base {\n --_appearance-color-text: var(--_connotation-color-primary-text);\n --_appearance-color-fill: var(--_connotation-color-primary);\n --_appearance-color-outline: transparent;\n}\n.base.appearance-subtle {\n --_appearance-color-text: var(--_connotation-color-contrast);\n --_appearance-color-fill: var(--_connotation-color-soft);\n --_appearance-color-outline: transparent;\n}\n@supports (contain: content) {\n .base {\n contain: strict;\n }\n}\n@supports not (contain: content) {\n .base {\n overflow: hidden;\n }\n}\n.base:focus {\n z-index: 2000;\n filter: var(--vvd-shadow-surface-8dp);\n outline: none;\n}\n\nh2 {\n margin: 0;\n font: var(--vvd-typography-base-condensed-bold);\n}\nh2 > strong {\n font: inherit;\n}\n\np {\n margin: 0;\n font: var(--vvd-typography-base-condensed);\n}";
10
+ var css_248z = "/**\n * Do not edit directly\n * Generated on Thu, 27 Apr 2023 09:20:45 GMT\n */\n.base {\n display: flex;\n align-items: center;\n color: var(--vvd-color-canvas-text);\n font: var(--vvd-typography-base);\n}\n.base .separator {\n margin: 0 16px;\n color: var(--vvd-color-neutral-600);\n font-size: 12px;\n}\n\n.control {\n position: relative;\n font: inherit;\n}\n@supports selector(:focus-visible) {\n .control:focus {\n outline: none;\n }\n}\n.control:any-link {\n color: var(--vvd-color-cta-600);\n text-decoration: none;\n}\n.control:any-link:hover {\n text-decoration: underline;\n}\n\n.focus-indicator {\n --focus-inset: -4px -8px;\n --focus-stroke-gap-color: transparent;\n border-radius: 6px;\n}\n.control:not(:focus-visible) > .focus-indicator {\n display: none;\n}";
9
11
 
10
- var $ = _export;
11
- var DESCRIPTORS = descriptors;
12
- var global = global$1;
13
- var uncurryThis = functionUncurryThis;
14
- var hasOwn = hasOwnProperty_1;
15
- var isCallable = isCallable$1;
16
- var isPrototypeOf = objectIsPrototypeOf;
17
- var toString = toString$1;
18
- var defineProperty = objectDefineProperty.f;
19
- var copyConstructorProperties = copyConstructorProperties$1;
20
-
21
- var NativeSymbol = global.Symbol;
22
- var SymbolPrototype = NativeSymbol && NativeSymbol.prototype;
23
-
24
- if (DESCRIPTORS && isCallable(NativeSymbol) && (!('description' in SymbolPrototype) ||
25
- // Safari 12 bug
26
- NativeSymbol().description !== undefined
27
- )) {
28
- var EmptyStringDescriptionStore = {};
29
- // wrap Symbol constructor for correct work with undefined description
30
- var SymbolWrapper = function Symbol() {
31
- var description = arguments.length < 1 || arguments[0] === undefined ? undefined : toString(arguments[0]);
32
- var result = isPrototypeOf(SymbolPrototype, this)
33
- ? new NativeSymbol(description)
34
- // in Edge 13, String(Symbol(undefined)) === 'Symbol(undefined)'
35
- : description === undefined ? NativeSymbol() : NativeSymbol(description);
36
- if (description === '') EmptyStringDescriptionStore[result] = true;
37
- return result;
38
- };
39
-
40
- copyConstructorProperties(SymbolWrapper, NativeSymbol);
41
- SymbolWrapper.prototype = SymbolPrototype;
42
- SymbolPrototype.constructor = SymbolWrapper;
43
-
44
- var NATIVE_SYMBOL = String(NativeSymbol('test')) == 'Symbol(test)';
45
- var thisSymbolValue = uncurryThis(SymbolPrototype.valueOf);
46
- var symbolDescriptiveString = uncurryThis(SymbolPrototype.toString);
47
- var regexp = /^Symbol\((.*)\)[^)]+$/;
48
- var replace = uncurryThis(''.replace);
49
- var stringSlice = uncurryThis(''.slice);
50
-
51
- defineProperty(SymbolPrototype, 'description', {
52
- configurable: true,
53
- get: function description() {
54
- var symbol = thisSymbolValue(this);
55
- if (hasOwn(EmptyStringDescriptionStore, symbol)) return '';
56
- var string = symbolDescriptiveString(symbol);
57
- var desc = NATIVE_SYMBOL ? stringSlice(string, 7, -1) : replace(string, regexp, '$1');
58
- return desc === '' ? undefined : desc;
59
- }
60
- });
61
-
62
- $({ global: true, constructor: true, forced: true }, {
63
- Symbol: SymbolWrapper
64
- });
12
+ class BreadcrumbItem extends BreadcrumbItem$1 {
13
+ constructor() {
14
+ super();
15
+ }
65
16
  }
17
+ __decorate([attr, __metadata("design:type", String)], BreadcrumbItem.prototype, "text", void 0);
66
18
 
67
- let _ = t => t,
19
+ let _2 = t => t,
68
20
  _t,
69
21
  _t2,
70
- _t3;
71
- const getClasses = ({
72
- connotation,
73
- appearance
74
- }) => classNames('base', [`connotation-${connotation}`, Boolean(connotation)], [`appearance-${appearance}`, Boolean(appearance)]);
75
- const getStyles = ({
76
- start,
77
- duration,
78
- overlapCount
79
- }) => {
80
- const stylesObj = Object.assign(Object.assign(Object.assign({}, overlapCount && {
81
- '--vvd-calendar-event--overlap-count': overlapCount
82
- }), start && {
83
- '--vvd-calendar-event--start': start
84
- }), duration && {
85
- '--vvd-calendar-event--duration': duration
86
- });
87
- return Object.entries(stylesObj).map(entry => entry.join(':')).join(';');
22
+ _t3,
23
+ _t4;
24
+ const getClasses = _ => classNames('base');
25
+ const BreadcrumbItemTemplate = (context, definition) => {
26
+ const iconTag = context.tagFor(Icon);
27
+ return html(_t || (_t = _2`
28
+ <div role="listitem" class="${0}">
29
+ ${0}
30
+
31
+ ${0}
32
+
33
+ ${0}
34
+ </div>`), getClasses, when(x => x.text && !x.href, html(_t2 || (_t2 = _2`${0}`), x => x.text)), when(x => x.text && x.href && x.href.length > 0, html(_t3 || (_t3 = _2`${0}`), textAnchorTemplate(context))), when(x => x.separator, html(_t4 || (_t4 = _2`<${0} class="separator" name="chevron-right-solid"></${0}>`), iconTag, iconTag)));
88
35
  };
89
- const CalendarEventTemplate = () => html(_t || (_t = _`
90
- <div
91
- style="${0}"
92
- class="${0}"
93
- role="button"
94
- tabindex="0"
95
- >
96
- ${0}
97
- ${0}
98
- </div>`), getStyles, getClasses, when(x => x.heading, html(_t2 || (_t2 = _`<h2><strong>${0}</strong></h2>`), x => x.heading)), when(x => x.description, html(_t3 || (_t3 = _`<p>${0}</p>`), x => x.description)));
99
36
 
100
- const calendarEventDefinition = CalendarEvent.compose({
101
- baseName: 'calendar-event',
102
- template: CalendarEventTemplate,
37
+ const breadcrumbItemDefinition = BreadcrumbItem.compose({
38
+ baseName: 'breadcrumb-item',
39
+ template: BreadcrumbItemTemplate,
103
40
  styles: css_248z,
104
41
  shadowOptions: {
105
42
  delegatesFocus: true
106
43
  }
107
44
  });
108
- const calendarEventRegistries = [calendarEventDefinition()];
109
- const registerCalendarEvent = registerFactory(calendarEventRegistries);
45
+ const breadcrumbItemRegistries = [breadcrumbItemDefinition(), ...iconRegistries, ...focusRegistries];
46
+ const registerBreadcrumbItem = registerFactory(breadcrumbItemRegistries);
110
47
 
111
- export { calendarEventRegistries as a, calendarEventDefinition as c, registerCalendarEvent as r };
48
+ export { breadcrumbItemRegistries as a, breadcrumbItemDefinition as b, registerBreadcrumbItem as r };