@vonage/vivid 3.0.0-next.92 → 3.0.0-next.94

package/shared/dom.js

@@ -0,0 +1,8 @@
+/**
+ * A test that ensures that all arguments are HTML Elements
+ */
+function isHTMLElement(...args) {
+    return args.every((arg) => arg instanceof HTMLElement);
+}
+
+export { isHTMLElement as i };

package/shared/es.object.assign.js

@@ -1,4 +1,4 @@
-import { d as descriptors, f as functionUncurryThis, x as functionCall, e as fails$1, J as toObject$1, N as indexedObject, O as objectGetOwnPropertySymbols, P as objectPropertyIsEnumerable, _ as _export } from './export.js';
+import { d as descriptors, f as functionUncurryThis, x as functionCall, e as fails$1, I as toObject$1, N as indexedObject, O as objectGetOwnPropertySymbols, P as objectPropertyIsEnumerable, _ as _export } from './export.js';
 import { o as objectKeys$1 } from './object-keys.js';
 
 var DESCRIPTORS = descriptors;

package/shared/es.regexp.to-string.js

@@ -0,0 +1,59 @@
+import { j as anObject$2, x as functionCall, q as hasOwnProperty_1, b as objectIsPrototypeOf, C as functionName, v as defineBuiltIn$1, e as fails$1 } from './export.js';
+import { t as toString } from './to-string.js';
+
+var anObject$1 = anObject$2;
+
+// `RegExp.prototype.flags` getter implementation
+// https://tc39.es/ecma262/#sec-get-regexp.prototype.flags
+var regexpFlags = function () {
+  var that = anObject$1(this);
+  var result = '';
+  if (that.hasIndices) result += 'd';
+  if (that.global) result += 'g';
+  if (that.ignoreCase) result += 'i';
+  if (that.multiline) result += 'm';
+  if (that.dotAll) result += 's';
+  if (that.unicode) result += 'u';
+  if (that.unicodeSets) result += 'v';
+  if (that.sticky) result += 'y';
+  return result;
+};
+
+var call = functionCall;
+var hasOwn = hasOwnProperty_1;
+var isPrototypeOf = objectIsPrototypeOf;
+var regExpFlags = regexpFlags;
+
+var RegExpPrototype$1 = RegExp.prototype;
+
+var regexpGetFlags = function (R) {
+  var flags = R.flags;
+  return flags === undefined && !('flags' in RegExpPrototype$1) && !hasOwn(R, 'flags') && isPrototypeOf(RegExpPrototype$1, R)
+    ? call(regExpFlags, R) : flags;
+};
+
+var PROPER_FUNCTION_NAME = functionName.PROPER;
+var defineBuiltIn = defineBuiltIn$1;
+var anObject = anObject$2;
+var $toString = toString;
+var fails = fails$1;
+var getRegExpFlags = regexpGetFlags;
+
+var TO_STRING = 'toString';
+var RegExpPrototype = RegExp.prototype;
+var nativeToString = RegExpPrototype[TO_STRING];
+
+var NOT_GENERIC = fails(function () { return nativeToString.call({ source: 'a', flags: 'b' }) != '/a/b'; });
+// FF44- RegExp#toString has a wrong name
+var INCORRECT_NAME = PROPER_FUNCTION_NAME && nativeToString.name != TO_STRING;
+
+// `RegExp.prototype.toString` method
+// https://tc39.es/ecma262/#sec-regexp.prototype.tostring
+if (NOT_GENERIC || INCORRECT_NAME) {
+  defineBuiltIn(RegExp.prototype, TO_STRING, function toString() {
+    var R = anObject(this);
+    var pattern = $toString(R.source);
+    var flags = $toString(getRegExpFlags(R));
+    return '/' + pattern + '/' + flags;
+  }, { unsafe: true });
+}

package/shared/export.js

@@ -1014,4 +1014,4 @@ var _export = function (options, source) {
   }
 };
 
-export { getMethod$1 as A, lengthOfArrayLike$1 as B, requireObjectCoercible$2 as C, functionName as D, v8PrototypeDefineBug as E, toIndexedObject$3 as F, sharedKey$1 as G, enumBugKeys$1 as H, hiddenKeys$3 as I, toObject$1 as J, createPropertyDescriptor$2 as K, createNonEnumerableProperty$2 as L, objectKeysInternal as M, indexedObject as N, objectGetOwnPropertySymbols as O, objectPropertyIsEnumerable as P, copyConstructorProperties$1 as Q, _export as _, getBuiltIn$3 as a, objectIsPrototypeOf as b, classofRaw$1 as c, descriptors as d, fails$8 as e, functionUncurryThis as f, global$a as g, inspectSource$1 as h, isCallable$a as i, anObject$2 as j, isNullOrUndefined$2 as k, functionBindNative as l, aCallable$1 as m, engineUserAgent as n, objectDefineProperty as o, documentCreateElement as p, hasOwnProperty_1 as q, objectGetOwnPropertyDescriptor as r, isForced_1 as s, tryToString$1 as t, engineV8Version as u, defineBuiltIn$1 as v, wellKnownSymbol$1 as w, functionCall as x, internalState as y, isObject$5 as z };
+export { getMethod$1 as A, lengthOfArrayLike$1 as B, functionName as C, v8PrototypeDefineBug as D, toIndexedObject$3 as E, sharedKey$1 as F, enumBugKeys$1 as G, hiddenKeys$3 as H, toObject$1 as I, createPropertyDescriptor$2 as J, createNonEnumerableProperty$2 as K, requireObjectCoercible$2 as L, objectKeysInternal as M, indexedObject as N, objectGetOwnPropertySymbols as O, objectPropertyIsEnumerable as P, copyConstructorProperties$1 as Q, _export as _, getBuiltIn$3 as a, objectIsPrototypeOf as b, classofRaw$1 as c, descriptors as d, fails$8 as e, functionUncurryThis as f, global$a as g, inspectSource$1 as h, isCallable$a as i, anObject$2 as j, isNullOrUndefined$2 as k, functionBindNative as l, aCallable$1 as m, engineUserAgent as n, objectDefineProperty as o, documentCreateElement as p, hasOwnProperty_1 as q, objectGetOwnPropertyDescriptor as r, isForced_1 as s, tryToString$1 as t, engineV8Version as u, defineBuiltIn$1 as v, wellKnownSymbol$1 as w, functionCall as x, internalState as y, isObject$5 as z };

package/shared/form-elements.js

@@ -225,7 +225,7 @@ class DelegatesARIATextbox {
 applyMixins(DelegatesARIATextbox, ARIAGlobalStatesAndProperties);
 applyMixins(TextField, StartEnd, DelegatesARIATextbox);
 
-var css_248z = "/**\n * Do not edit directly\n * Generated on Sun, 06 Nov 2022 10:46:17 GMT\n */\n.message {\n  display: flex;\n  contain: inline-size;\n  font: var(--vvd-typography-base-condensed);\n  gap: 4px;\n  grid-column: 1/-1;\n}\n.message-text {\n  color: var(--vvd-color-canvas-text);\n}\n.helper-message .message-text {\n  color: var(--_low-ink-color);\n}\n.message-icon {\n  font-size: 16px;\n}\n.success-message .message-icon {\n  color: var(--vvd-color-success-500);\n}\n.error-message .message-icon {\n  color: var(--vvd-color-alert-500);\n}";
+var css_248z = "/**\n * Do not edit directly\n * Generated on Tue, 08 Nov 2022 16:43:57 GMT\n */\n.message {\n  display: flex;\n  contain: inline-size;\n  font: var(--vvd-typography-base-condensed);\n  gap: 4px;\n  grid-column: 1/-1;\n}\n.message-text {\n  color: var(--vvd-color-canvas-text);\n}\n.helper-message .message-text {\n  color: var(--_low-ink-color);\n}\n.message-icon {\n  font-size: 16px;\n}\n.success-message .message-icon {\n  color: var(--vvd-color-success-500);\n}\n.error-message .message-icon {\n  color: var(--vvd-color-alert-500);\n}";
 
 let _ = t => t,
   _t,

package/shared/icon.js

@@ -1,6 +1,7 @@
-import { c as classofRaw, g as global$8, w as wellKnownSymbol$6, a as getBuiltIn$5, o as objectDefineProperty, d as descriptors, b as objectIsPrototypeOf, f as functionUncurryThis, e as fails$4, i as isCallable$6, h as inspectSource$2, t as tryToString$3, j as anObject$5, k as isNullOrUndefined$2, l as functionBindNative, m as aCallable$6, n as engineUserAgent, p as documentCreateElement, q as hasOwnProperty_1, r as objectGetOwnPropertyDescriptor, s as isForced_1, u as engineV8Version, _ as _export, v as defineBuiltIn$3, x as functionCall, y as internalState, z as isObject$2, A as getMethod$2, B as lengthOfArrayLike$1, C as requireObjectCoercible$1, D as functionName } from './export.js';
+import { c as classofRaw, g as global$8, w as wellKnownSymbol$6, a as getBuiltIn$5, o as objectDefineProperty, d as descriptors, b as objectIsPrototypeOf, f as functionUncurryThis, e as fails$4, i as isCallable$6, h as inspectSource$2, t as tryToString$3, j as anObject$5, k as isNullOrUndefined$2, l as functionBindNative, m as aCallable$6, n as engineUserAgent, p as documentCreateElement, q as hasOwnProperty_1, r as objectGetOwnPropertyDescriptor, s as isForced_1, u as engineV8Version, _ as _export, v as defineBuiltIn$3, x as functionCall, y as internalState, z as isObject$2, A as getMethod$2, B as lengthOfArrayLike$1, C as functionName } from './export.js';
 import { h as html$1, o as objectSetPrototypeOf, s as setToStringTag$1, i as iterators } from './iterators.js';
-import { c as classof$3, t as toString$1 } from './to-string.js';
+import { c as classof$3 } from './to-string.js';
+import { w as whitespaces$1, s as stringTrim } from './string-trim.js';
 import { F as FoundationElement, _ as __decorate, a as attr, b as __metadata, o as observable } from './index.js';
 import { _ as _curry1, a as _curry2, b as _has } from './_has.js';
 
@@ -37,7 +38,7 @@ var anInstance$1 = function (it, Prototype) {
   throw $TypeError$5('Incorrect invocation');
 };
 
-var uncurryThis$3 = functionUncurryThis;
+var uncurryThis$2 = functionUncurryThis;
 var fails$3 = fails$4;
 var isCallable$5 = isCallable$6;
 var classof$1 = classof$3;
@@ -48,7 +49,7 @@ var noop = function () { /* empty */ };
 var empty = [];
 var construct = getBuiltIn$3('Reflect', 'construct');
 var constructorRegExp = /^\s*(?:class|function)\b/;
-var exec = uncurryThis$3(constructorRegExp.exec);
+var exec = uncurryThis$2(constructorRegExp.exec);
 var INCORRECT_TO_STRING = !constructorRegExp.exec(noop);
 
 var isConstructorModern = function isConstructor(argument) {
@@ -127,11 +128,11 @@ var functionApply = typeof Reflect == 'object' && Reflect.apply || (NATIVE_BIND$
   return call$7.apply(apply$1, arguments);
 });
 
-var uncurryThis$2 = functionUncurryThis;
+var uncurryThis$1 = functionUncurryThis;
 var aCallable$5 = aCallable$6;
 var NATIVE_BIND = functionBindNative;
 
-var bind$4 = uncurryThis$2(uncurryThis$2.bind);
+var bind$4 = uncurryThis$1(uncurryThis$1.bind);
 
 // optional / simple context binding
 var functionBindContext = function (fn, that) {
@@ -141,9 +142,9 @@ var functionBindContext = function (fn, that) {
   };
 };
 
-var uncurryThis$1 = functionUncurryThis;
+var uncurryThis = functionUncurryThis;
 
-var arraySlice$1 = uncurryThis$1([].slice);
+var arraySlice$1 = uncurryThis([].slice);
 
 var $TypeError$3 = TypeError;
 
@@ -1091,45 +1092,9 @@ $$2({ target: 'Promise', stat: true, forced: FORCED_PROMISE_CONSTRUCTOR }, {
   }
 });
 
-// a string of all valid unicode whitespaces
-var whitespaces$2 = '\u0009\u000A\u000B\u000C\u000D\u0020\u00A0\u1680\u2000\u2001\u2002' +
-  '\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200A\u202F\u205F\u3000\u2028\u2029\uFEFF';
-
-var uncurryThis = functionUncurryThis;
-var requireObjectCoercible = requireObjectCoercible$1;
-var toString = toString$1;
-var whitespaces$1 = whitespaces$2;
-
-var replace = uncurryThis(''.replace);
-var whitespace = '[' + whitespaces$1 + ']';
-var ltrim = RegExp('^' + whitespace + whitespace + '*');
-var rtrim = RegExp(whitespace + whitespace + '*$');
-
-// `String.prototype.{ trim, trimStart, trimEnd, trimLeft, trimRight }` methods implementation
-var createMethod = function (TYPE) {
-  return function ($this) {
-    var string = toString(requireObjectCoercible($this));
-    if (TYPE & 1) string = replace(string, ltrim, '');
-    if (TYPE & 2) string = replace(string, rtrim, '');
-    return string;
-  };
-};
-
-var stringTrim = {
-  // `String.prototype.{ trimLeft, trimStart }` methods
-  // https://tc39.es/ecma262/#sec-string.prototype.trimstart
-  start: createMethod(1),
-  // `String.prototype.{ trimRight, trimEnd }` methods
-  // https://tc39.es/ecma262/#sec-string.prototype.trimend
-  end: createMethod(2),
-  // `String.prototype.trim` method
-  // https://tc39.es/ecma262/#sec-string.prototype.trim
-  trim: createMethod(3)
-};
-
 var PROPER_FUNCTION_NAME = functionName.PROPER;
 var fails$1 = fails$4;
-var whitespaces = whitespaces$2;
+var whitespaces = whitespaces$1;
 
 var non = '\u200B\u0085\u180E';
 

package/shared/index2.js

@@ -26,7 +26,7 @@ __decorate([attr({
 __decorate([attr, __metadata("design:type", String)], Button.prototype, "label", void 0);
 applyMixins(Button, AffixIconWithTrailing);
 
-var css_248z = "/**\n * Do not edit directly\n * Generated on Sun, 06 Nov 2022 10:46:17 GMT\n */\n:host {\n  display: inline-block;\n}\n\n.control {\n  position: relative;\n  display: inline-flex;\n  box-sizing: border-box;\n  align-items: center;\n  border: 0 none;\n  margin: 0;\n  background-color: var(--_appearance-color-fill);\n  block-size: var(--_button-block-size);\n  box-shadow: inset 0 0 0 1px var(--_appearance-color-outline);\n  color: var(--_appearance-color-text);\n  gap: var(--_button-icon-gap);\n  vertical-align: middle;\n  white-space: nowrap;\n  /* Size */\n}\n.control.connotation-cta {\n  --_connotation-color-primary: var(--vvd-color-cta-500);\n  --_connotation-color-primary-text: var(--vvd-color-canvas);\n  --_connotation-color-primary-increment: var(--vvd-color-cta-600);\n  --_connotation-color-contrast: var(--vvd-color-cta-800);\n  --_connotation-color-fierce: var(--vvd-color-cta-700);\n  --_connotation-color-firm: var(--vvd-color-cta-600);\n  --_connotation-color-soft: var(--vvd-color-cta-100);\n  --_connotation-color-faint: var(--vvd-color-cta-50);\n}\n.control.connotation-success {\n  --_connotation-color-primary: var(--vvd-color-success-500);\n  --_connotation-color-primary-text: var(--vvd-color-canvas);\n  --_connotation-color-primary-increment: var(--vvd-color-success-600);\n  --_connotation-color-contrast: var(--vvd-color-success-800);\n  --_connotation-color-fierce: var(--vvd-color-success-700);\n  --_connotation-color-firm: var(--vvd-color-success-600);\n  --_connotation-color-soft: var(--vvd-color-success-100);\n  --_connotation-color-faint: var(--vvd-color-success-50);\n}\n.control.connotation-alert {\n  --_connotation-color-primary: var(--vvd-color-alert-500);\n  --_connotation-color-primary-text: var(--vvd-color-canvas);\n  --_connotation-color-primary-increment: var(--vvd-color-alert-600);\n  --_connotation-color-contrast: var(--vvd-color-alert-800);\n  --_connotation-color-fierce: var(--vvd-color-alert-700);\n  --_connotation-color-firm: var(--vvd-color-alert-600);\n  --_connotation-color-soft: var(--vvd-color-alert-100);\n  --_connotation-color-faint: var(--vvd-color-alert-50);\n}\n.control:not(.connotation-cta, .connotation-success, .connotation-alert) {\n  --_connotation-color-primary: var(--vvd-color-canvas-text);\n  --_connotation-color-primary-text: var(--vvd-color-canvas);\n  --_connotation-color-primary-increment: var(--vvd-color-neutral-800);\n  --_connotation-color-contrast: var(--vvd-color-neutral-800);\n  --_connotation-color-fierce: var(--vvd-color-neutral-700);\n  --_connotation-color-firm: var(--vvd-color-canvas-text);\n  --_connotation-color-soft: var(--vvd-color-neutral-100);\n  --_connotation-color-faint: var(--vvd-color-canvas);\n}\n.control.appearance-filled {\n  --_appearance-color-text: var(--_connotation-color-primary-text);\n  --_appearance-color-fill: var(--_connotation-color-primary);\n  --_appearance-color-outline: transparent;\n}\n.control.appearance-outlined {\n  --_appearance-color-text: var(--_connotation-color-firm);\n  --_appearance-color-fill: transparent;\n  --_appearance-color-outline: var(--_connotation-color-firm);\n}\n.control {\n  --_appearance-color-text: var(--_connotation-color-primary);\n  --_appearance-color-fill: transparent;\n  --_appearance-color-outline: transparent;\n}\n.control:where(:hover, .hover):where(:not(:disabled, .disabled)).appearance-filled {\n  --_appearance-color-text: var(--_connotation-color-primary-text);\n  --_appearance-color-fill: var(--_connotation-color-primary-increment);\n  --_appearance-color-outline: transparent;\n}\n.control:where(:hover, .hover):where(:not(:disabled, .disabled)).appearance-outlined {\n  --_appearance-color-text: var(--_connotation-color-firm);\n  --_appearance-color-fill: var(--_connotation-color-faint);\n  --_appearance-color-outline: var(--_connotation-color-firm);\n}\n.control:where(:hover, .hover):where(:not(:disabled, .disabled)) {\n  --_appearance-color-text: var(--_connotation-color-primary);\n  --_appearance-color-fill: var(--_connotation-color-faint);\n  --_appearance-color-outline: transparent;\n}\n.control:where(:disabled, .disabled).appearance-filled {\n  --_appearance-color-text: var(--vvd-color-neutral-400);\n  --_appearance-color-fill: var(--vvd-color-neutral-200);\n  --_appearance-color-outline: transparent;\n}\n.control:where(:disabled, .disabled).appearance-outlined {\n  --_appearance-color-text: var(--vvd-color-neutral-400);\n  --_appearance-color-fill: transparent;\n  --_appearance-color-outline: var(--vvd-color-neutral-400);\n}\n.control:where(:disabled, .disabled) {\n  --_appearance-color-text: var(--vvd-color-neutral-400);\n  --_appearance-color-fill: transparent;\n  --_appearance-color-outline: transparent;\n}\n.control:where(:active, .active):where(:not(:disabled, .disabled)).appearance-filled {\n  --_appearance-color-text: var(--_connotation-color-primary-text);\n  --_appearance-color-fill: var(--_connotation-color-fierce);\n  --_appearance-color-outline: transparent;\n}\n.control:where(:active, .active):where(:not(:disabled, .disabled)).appearance-outlined {\n  --_appearance-color-text: var(--_connotation-color-firm);\n  --_appearance-color-fill: var(--_connotation-color-soft);\n  --_appearance-color-outline: var(--_connotation-color-firm);\n}\n.control:where(:active, .active):where(:not(:disabled, .disabled)) {\n  --_appearance-color-text: var(--_connotation-color-primary);\n  --_appearance-color-fill: var(--_connotation-color-soft);\n  --_appearance-color-outline: transparent;\n}\n@supports selector(:focus-visible) {\n  .control:focus {\n    outline: none;\n  }\n}\n@supports (user-select: none) {\n  .control {\n    user-select: none;\n  }\n}\n.control:not(:disabled) {\n  cursor: pointer;\n}\n.control:disabled {\n  cursor: not-allowed;\n}\n.control.icon-only {\n  contain: size;\n  padding-inline: 0;\n  place-content: center;\n}\n@supports (aspect-ratio: 1) {\n  .control.icon-only {\n    aspect-ratio: 1;\n  }\n}\n@supports not (aspect-ratio: 1) {\n  .control.icon-only {\n    inline-size: var(--_button-block-size);\n  }\n}\n.control:not(.stacked).density-condensed {\n  --_button-block-size: calc(1px * (40 + 8 * clamp(-1, var(--vvd-size-density, 0), 1) - 8));\n  font: var(--vvd-typography-base-condensed-bold);\n}\n.control:not(.stacked).density-condensed:not(.icon-only) {\n  --_button-icon-gap: 8px;\n  padding-inline: 12px;\n}\n.control:not(.stacked).density-condensed .icon {\n  font-size: 16px;\n}\n.control:not(.stacked).density-extended {\n  --_button-block-size: calc(1px * (40 + 8 * clamp(-1, var(--vvd-size-density, 0), 1) + 8));\n  font: var(--vvd-typography-base-extended-bold);\n}\n.control:not(.stacked).density-extended:not(.icon-only) {\n  --_button-icon-gap: 10px;\n  padding-inline: 20px;\n}\n.control:not(.stacked).density-extended .icon {\n  font-size: 24px;\n}\n.control:not(.stacked):not(.density-condensed, .density-extended) {\n  --_button-block-size: calc(1px * (40 + 8 * clamp(-1, var(--vvd-size-density, 0), 1)));\n  font: var(--vvd-typography-base-bold);\n}\n.control:not(.stacked):not(.density-condensed, .density-extended):not(.icon-only) {\n  --_button-icon-gap: 8px;\n  padding-inline: 16px;\n}\n.control:not(.stacked):not(.density-condensed, .density-extended) .icon {\n  font-size: 20px;\n}\n.control.stacked {\n  flex-direction: column;\n  justify-content: center;\n  --_button-block-size: calc(calc(1px * (40 + 8 * clamp(-1, var(--vvd-size-density, 0), 1) + 8)) + calc(1px * (40 + 8 * clamp(-1, var(--vvd-size-density, 0), 1) - 20)));\n  font: var(--vvd-typography-base-bold);\n}\n.control.stacked:not(.icon-only) {\n  --_button-icon-gap: 10px;\n  padding-inline: 16px;\n}\n.control.stacked .icon {\n  font-size: 20px;\n}\n\n/* Shape */\n.control:not(.shape-pill:not(.stacked)) {\n  border-radius: 6px;\n}\n\n.control.shape-pill:not(.stacked):not(.icon-only) {\n  border-radius: 24px;\n}\n.control.shape-pill:not(.stacked).icon-only {\n  border-radius: 50%;\n}\n\n/* Icon */\n.icon-trailing .icon {\n  order: 1;\n}\n\n:not(:focus-visible) > .focus-indicator {\n  display: none;\n}\n.appearance-outlined .focus-indicator, .appearance-ghost .focus-indicator {\n  --focus-stroke-gap-color: transparent;\n}";
+var css_248z = "/**\n * Do not edit directly\n * Generated on Tue, 08 Nov 2022 16:43:57 GMT\n */\n:host {\n  display: inline-block;\n}\n\n.control {\n  position: relative;\n  display: inline-flex;\n  box-sizing: border-box;\n  align-items: center;\n  border: 0 none;\n  margin: 0;\n  background-color: var(--_appearance-color-fill);\n  block-size: var(--_button-block-size);\n  box-shadow: inset 0 0 0 1px var(--_appearance-color-outline);\n  color: var(--_appearance-color-text);\n  gap: var(--_button-icon-gap);\n  vertical-align: middle;\n  white-space: nowrap;\n  /* Size */\n}\n.control.connotation-cta {\n  --_connotation-color-primary: var(--vvd-color-cta-500);\n  --_connotation-color-primary-text: var(--vvd-color-canvas);\n  --_connotation-color-primary-increment: var(--vvd-color-cta-600);\n  --_connotation-color-contrast: var(--vvd-color-cta-800);\n  --_connotation-color-fierce: var(--vvd-color-cta-700);\n  --_connotation-color-firm: var(--vvd-color-cta-600);\n  --_connotation-color-soft: var(--vvd-color-cta-100);\n  --_connotation-color-faint: var(--vvd-color-cta-50);\n}\n.control.connotation-success {\n  --_connotation-color-primary: var(--vvd-color-success-500);\n  --_connotation-color-primary-text: var(--vvd-color-canvas);\n  --_connotation-color-primary-increment: var(--vvd-color-success-600);\n  --_connotation-color-contrast: var(--vvd-color-success-800);\n  --_connotation-color-fierce: var(--vvd-color-success-700);\n  --_connotation-color-firm: var(--vvd-color-success-600);\n  --_connotation-color-soft: var(--vvd-color-success-100);\n  --_connotation-color-faint: var(--vvd-color-success-50);\n}\n.control.connotation-alert {\n  --_connotation-color-primary: var(--vvd-color-alert-500);\n  --_connotation-color-primary-text: var(--vvd-color-canvas);\n  --_connotation-color-primary-increment: var(--vvd-color-alert-600);\n  --_connotation-color-contrast: var(--vvd-color-alert-800);\n  --_connotation-color-fierce: var(--vvd-color-alert-700);\n  --_connotation-color-firm: var(--vvd-color-alert-600);\n  --_connotation-color-soft: var(--vvd-color-alert-100);\n  --_connotation-color-faint: var(--vvd-color-alert-50);\n}\n.control:not(.connotation-cta, .connotation-success, .connotation-alert) {\n  --_connotation-color-primary: var(--vvd-color-canvas-text);\n  --_connotation-color-primary-text: var(--vvd-color-canvas);\n  --_connotation-color-primary-increment: var(--vvd-color-neutral-800);\n  --_connotation-color-contrast: var(--vvd-color-neutral-800);\n  --_connotation-color-fierce: var(--vvd-color-neutral-700);\n  --_connotation-color-firm: var(--vvd-color-canvas-text);\n  --_connotation-color-soft: var(--vvd-color-neutral-100);\n  --_connotation-color-faint: var(--vvd-color-neutral-50);\n}\n.control.appearance-filled {\n  --_appearance-color-text: var(--_connotation-color-primary-text);\n  --_appearance-color-fill: var(--_connotation-color-primary);\n  --_appearance-color-outline: transparent;\n}\n.control.appearance-outlined {\n  --_appearance-color-text: var(--_connotation-color-firm);\n  --_appearance-color-fill: transparent;\n  --_appearance-color-outline: var(--_connotation-color-firm);\n}\n.control {\n  --_appearance-color-text: var(--_connotation-color-primary);\n  --_appearance-color-fill: transparent;\n  --_appearance-color-outline: transparent;\n}\n.control:where(:hover, .hover):where(:not(:disabled, .disabled)).appearance-filled {\n  --_appearance-color-text: var(--_connotation-color-primary-text);\n  --_appearance-color-fill: var(--_connotation-color-primary-increment);\n  --_appearance-color-outline: transparent;\n}\n.control:where(:hover, .hover):where(:not(:disabled, .disabled)).appearance-outlined {\n  --_appearance-color-text: var(--_connotation-color-firm);\n  --_appearance-color-fill: var(--_connotation-color-faint);\n  --_appearance-color-outline: var(--_connotation-color-firm);\n}\n.control:where(:hover, .hover):where(:not(:disabled, .disabled)) {\n  --_appearance-color-text: var(--_connotation-color-primary);\n  --_appearance-color-fill: var(--_connotation-color-faint);\n  --_appearance-color-outline: transparent;\n}\n.control:where(:disabled, .disabled).appearance-filled {\n  --_appearance-color-text: var(--vvd-color-neutral-400);\n  --_appearance-color-fill: var(--vvd-color-neutral-200);\n  --_appearance-color-outline: transparent;\n}\n.control:where(:disabled, .disabled).appearance-outlined {\n  --_appearance-color-text: var(--vvd-color-neutral-400);\n  --_appearance-color-fill: transparent;\n  --_appearance-color-outline: var(--vvd-color-neutral-400);\n}\n.control:where(:disabled, .disabled) {\n  --_appearance-color-text: var(--vvd-color-neutral-400);\n  --_appearance-color-fill: transparent;\n  --_appearance-color-outline: transparent;\n}\n.control:where(:active, .active):where(:not(:disabled, .disabled)).appearance-filled {\n  --_appearance-color-text: var(--_connotation-color-primary-text);\n  --_appearance-color-fill: var(--_connotation-color-fierce);\n  --_appearance-color-outline: transparent;\n}\n.control:where(:active, .active):where(:not(:disabled, .disabled)).appearance-outlined {\n  --_appearance-color-text: var(--_connotation-color-firm);\n  --_appearance-color-fill: var(--_connotation-color-soft);\n  --_appearance-color-outline: var(--_connotation-color-firm);\n}\n.control:where(:active, .active):where(:not(:disabled, .disabled)) {\n  --_appearance-color-text: var(--_connotation-color-primary);\n  --_appearance-color-fill: var(--_connotation-color-soft);\n  --_appearance-color-outline: transparent;\n}\n@supports selector(:focus-visible) {\n  .control:focus {\n    outline: none;\n  }\n}\n@supports (user-select: none) {\n  .control {\n    user-select: none;\n  }\n}\n.control:not(:disabled) {\n  cursor: pointer;\n}\n.control:disabled {\n  cursor: not-allowed;\n}\n.control.icon-only {\n  contain: size;\n  padding-inline: 0;\n  place-content: center;\n}\n@supports (aspect-ratio: 1) {\n  .control.icon-only {\n    aspect-ratio: 1;\n  }\n}\n@supports not (aspect-ratio: 1) {\n  .control.icon-only {\n    inline-size: var(--_button-block-size);\n  }\n}\n.control:not(.stacked).density-condensed {\n  --_button-block-size: calc(1px * (40 + 8 * clamp(-1, var(--vvd-size-density, 0), 1) - 8));\n  font: var(--vvd-typography-base-condensed-bold);\n}\n.control:not(.stacked).density-condensed:not(.icon-only) {\n  --_button-icon-gap: 8px;\n  padding-inline: 12px;\n}\n.control:not(.stacked).density-condensed .icon {\n  font-size: 16px;\n}\n.control:not(.stacked).density-extended {\n  --_button-block-size: calc(1px * (40 + 8 * clamp(-1, var(--vvd-size-density, 0), 1) + 8));\n  font: var(--vvd-typography-base-extended-bold);\n}\n.control:not(.stacked).density-extended:not(.icon-only) {\n  --_button-icon-gap: 10px;\n  padding-inline: 20px;\n}\n.control:not(.stacked).density-extended .icon {\n  font-size: 24px;\n}\n.control:not(.stacked):not(.density-condensed, .density-extended) {\n  --_button-block-size: calc(1px * (40 + 8 * clamp(-1, var(--vvd-size-density, 0), 1)));\n  font: var(--vvd-typography-base-bold);\n}\n.control:not(.stacked):not(.density-condensed, .density-extended):not(.icon-only) {\n  --_button-icon-gap: 8px;\n  padding-inline: 16px;\n}\n.control:not(.stacked):not(.density-condensed, .density-extended) .icon {\n  font-size: 20px;\n}\n.control.stacked {\n  flex-direction: column;\n  justify-content: center;\n  --_button-block-size: calc(calc(1px * (40 + 8 * clamp(-1, var(--vvd-size-density, 0), 1) + 8)) + calc(1px * (40 + 8 * clamp(-1, var(--vvd-size-density, 0), 1) - 20)));\n  font: var(--vvd-typography-base-bold);\n}\n.control.stacked:not(.icon-only) {\n  --_button-icon-gap: 10px;\n  padding-inline: 16px;\n}\n.control.stacked .icon {\n  font-size: 20px;\n}\n\n/* Shape */\n.control:not(.shape-pill:not(.stacked)) {\n  border-radius: 6px;\n}\n\n.control.shape-pill:not(.stacked):not(.icon-only) {\n  border-radius: 24px;\n}\n.control.shape-pill:not(.stacked).icon-only {\n  border-radius: 50%;\n}\n\n/* Icon */\n.icon-trailing .icon {\n  order: 1;\n}\n\n:not(:focus-visible) > .focus-indicator {\n  display: none;\n}\n.appearance-outlined .focus-indicator, .appearance-ghost .focus-indicator {\n  --focus-stroke-gap-color: transparent;\n}";
 
 let _ = t => t,
   _t;

package/shared/index4.js

@@ -51,7 +51,7 @@ __decorate([
     attr
 ], Divider$1.prototype, "orientation", void 0);
 
-var css_248z = "/**\n * Do not edit directly\n * Generated on Sun, 06 Nov 2022 10:46:17 GMT\n */\n:host {\n  display: block;\n}\n\n.base {\n  display: block;\n  background-color: var(--vvd-color-neutral-200);\n}\n.base:not(.vertical) {\n  block-size: 1px;\n  inline-size: 100%;\n}\n.base.vertical {\n  block-size: 100%;\n  inline-size: 1px;\n}";
+var css_248z = "/**\n * Do not edit directly\n * Generated on Tue, 08 Nov 2022 16:43:57 GMT\n */\n:host {\n  display: block;\n}\n\n.base {\n  display: block;\n  background-color: var(--vvd-color-neutral-200);\n}\n.base:not(.vertical) {\n  block-size: 1px;\n  inline-size: 100%;\n}\n.base.vertical {\n  block-size: 100%;\n  inline-size: 1px;\n}";
 
 class Divider extends Divider$1 {}