@vonage/vivid 3.0.0-next.7 → 3.0.0-next.71

package/shared/web.dom-collections.iterator.js

@@ -0,0 +1,474 @@
+import { d as descriptors, E as v8PrototypeDefineBug, o as objectDefineProperty, j as anObject$2, F as toIndexedObject$2, G as hiddenKeys$1, H as sharedKey$2, I as enumBugKeys$1, p as documentCreateElement$2, w as wellKnownSymbol$4, e as fails$2, q as hasOwnProperty_1, i as isCallable$3, J as toObject$1, y as isObject$1, v as defineBuiltIn$2, K as createPropertyDescriptor$1, _ as _export, L as createNonEnumerableProperty$2, x as functionCall, D as functionName, z as internalState, g as global$1 } from './export.js';
+import { o as objectKeys$1 } from './object-keys.js';
+import { h as html$1, s as setToStringTag$2, i as iterators, o as objectSetPrototypeOf } from './iterators.js';
+
+var objectDefineProperties = {};
+
+var DESCRIPTORS$1 = descriptors;
+var V8_PROTOTYPE_DEFINE_BUG = v8PrototypeDefineBug;
+var definePropertyModule = objectDefineProperty;
+var anObject$1 = anObject$2;
+var toIndexedObject$1 = toIndexedObject$2;
+var objectKeys = objectKeys$1;
+
+// `Object.defineProperties` method
+// https://tc39.es/ecma262/#sec-object.defineproperties
+// eslint-disable-next-line es-x/no-object-defineproperties -- safe
+objectDefineProperties.f = DESCRIPTORS$1 && !V8_PROTOTYPE_DEFINE_BUG ? Object.defineProperties : function defineProperties(O, Properties) {
+  anObject$1(O);
+  var props = toIndexedObject$1(Properties);
+  var keys = objectKeys(Properties);
+  var length = keys.length;
+  var index = 0;
+  var key;
+  while (length > index) definePropertyModule.f(O, key = keys[index++], props[key]);
+  return O;
+};
+
+/* global ActiveXObject -- old IE, WSH */
+
+var anObject = anObject$2;
+var definePropertiesModule = objectDefineProperties;
+var enumBugKeys = enumBugKeys$1;
+var hiddenKeys = hiddenKeys$1;
+var html = html$1;
+var documentCreateElement$1 = documentCreateElement$2;
+var sharedKey$1 = sharedKey$2;
+
+var GT = '>';
+var LT = '<';
+var PROTOTYPE = 'prototype';
+var SCRIPT = 'script';
+var IE_PROTO$1 = sharedKey$1('IE_PROTO');
+
+var EmptyConstructor = function () { /* empty */ };
+
+var scriptTag = function (content) {
+  return LT + SCRIPT + GT + content + LT + '/' + SCRIPT + GT;
+};
+
+// Create object with fake `null` prototype: use ActiveX Object with cleared prototype
+var NullProtoObjectViaActiveX = function (activeXDocument) {
+  activeXDocument.write(scriptTag(''));
+  activeXDocument.close();
+  var temp = activeXDocument.parentWindow.Object;
+  activeXDocument = null; // avoid memory leak
+  return temp;
+};
+
+// Create object with fake `null` prototype: use iframe Object with cleared prototype
+var NullProtoObjectViaIFrame = function () {
+  // Thrash, waste and sodomy: IE GC bug
+  var iframe = documentCreateElement$1('iframe');
+  var JS = 'java' + SCRIPT + ':';
+  var iframeDocument;
+  iframe.style.display = 'none';
+  html.appendChild(iframe);
+  // https://github.com/zloirock/core-js/issues/475
+  iframe.src = String(JS);
+  iframeDocument = iframe.contentWindow.document;
+  iframeDocument.open();
+  iframeDocument.write(scriptTag('document.F=Object'));
+  iframeDocument.close();
+  return iframeDocument.F;
+};
+
+// Check for document.domain and active x support
+// No need to use active x approach when document.domain is not set
+// see https://github.com/es-shims/es5-shim/issues/150
+// variation of https://github.com/kitcambridge/es5-shim/commit/4f738ac066346
+// avoid IE GC bug
+var activeXDocument;
+var NullProtoObject = function () {
+  try {
+    activeXDocument = new ActiveXObject('htmlfile');
+  } catch (error) { /* ignore */ }
+  NullProtoObject = typeof document != 'undefined'
+    ? document.domain && activeXDocument
+      ? NullProtoObjectViaActiveX(activeXDocument) // old IE
+      : NullProtoObjectViaIFrame()
+    : NullProtoObjectViaActiveX(activeXDocument); // WSH
+  var length = enumBugKeys.length;
+  while (length--) delete NullProtoObject[PROTOTYPE][enumBugKeys[length]];
+  return NullProtoObject();
+};
+
+hiddenKeys[IE_PROTO$1] = true;
+
+// `Object.create` method
+// https://tc39.es/ecma262/#sec-object.create
+// eslint-disable-next-line es-x/no-object-create -- safe
+var objectCreate = Object.create || function create(O, Properties) {
+  var result;
+  if (O !== null) {
+    EmptyConstructor[PROTOTYPE] = anObject(O);
+    result = new EmptyConstructor();
+    EmptyConstructor[PROTOTYPE] = null;
+    // add "__proto__" for Object.getPrototypeOf polyfill
+    result[IE_PROTO$1] = O;
+  } else result = NullProtoObject();
+  return Properties === undefined ? result : definePropertiesModule.f(result, Properties);
+};
+
+var wellKnownSymbol$3 = wellKnownSymbol$4;
+var create$1 = objectCreate;
+var defineProperty$1 = objectDefineProperty.f;
+
+var UNSCOPABLES = wellKnownSymbol$3('unscopables');
+var ArrayPrototype = Array.prototype;
+
+// Array.prototype[@@unscopables]
+// https://tc39.es/ecma262/#sec-array.prototype-@@unscopables
+if (ArrayPrototype[UNSCOPABLES] == undefined) {
+  defineProperty$1(ArrayPrototype, UNSCOPABLES, {
+    configurable: true,
+    value: create$1(null)
+  });
+}
+
+// add a key to Array.prototype[@@unscopables]
+var addToUnscopables$1 = function (key) {
+  ArrayPrototype[UNSCOPABLES][key] = true;
+};
+
+var fails$1 = fails$2;
+
+var correctPrototypeGetter = !fails$1(function () {
+  function F() { /* empty */ }
+  F.prototype.constructor = null;
+  // eslint-disable-next-line es-x/no-object-getprototypeof -- required for testing
+  return Object.getPrototypeOf(new F()) !== F.prototype;
+});
+
+var hasOwn = hasOwnProperty_1;
+var isCallable$2 = isCallable$3;
+var toObject = toObject$1;
+var sharedKey = sharedKey$2;
+var CORRECT_PROTOTYPE_GETTER = correctPrototypeGetter;
+
+var IE_PROTO = sharedKey('IE_PROTO');
+var $Object = Object;
+var ObjectPrototype = $Object.prototype;
+
+// `Object.getPrototypeOf` method
+// https://tc39.es/ecma262/#sec-object.getprototypeof
+// eslint-disable-next-line es-x/no-object-getprototypeof -- safe
+var objectGetPrototypeOf = CORRECT_PROTOTYPE_GETTER ? $Object.getPrototypeOf : function (O) {
+  var object = toObject(O);
+  if (hasOwn(object, IE_PROTO)) return object[IE_PROTO];
+  var constructor = object.constructor;
+  if (isCallable$2(constructor) && object instanceof constructor) {
+    return constructor.prototype;
+  } return object instanceof $Object ? ObjectPrototype : null;
+};
+
+var fails = fails$2;
+var isCallable$1 = isCallable$3;
+var isObject = isObject$1;
+var getPrototypeOf$1 = objectGetPrototypeOf;
+var defineBuiltIn$1 = defineBuiltIn$2;
+var wellKnownSymbol$2 = wellKnownSymbol$4;
+
+var ITERATOR$2 = wellKnownSymbol$2('iterator');
+var BUGGY_SAFARI_ITERATORS$1 = false;
+
+// `%IteratorPrototype%` object
+// https://tc39.es/ecma262/#sec-%iteratorprototype%-object
+var IteratorPrototype$2, PrototypeOfArrayIteratorPrototype, arrayIterator;
+
+/* eslint-disable es-x/no-array-prototype-keys -- safe */
+if ([].keys) {
+  arrayIterator = [].keys();
+  // Safari 8 has buggy iterators w/o `next`
+  if (!('next' in arrayIterator)) BUGGY_SAFARI_ITERATORS$1 = true;
+  else {
+    PrototypeOfArrayIteratorPrototype = getPrototypeOf$1(getPrototypeOf$1(arrayIterator));
+    if (PrototypeOfArrayIteratorPrototype !== Object.prototype) IteratorPrototype$2 = PrototypeOfArrayIteratorPrototype;
+  }
+}
+
+var NEW_ITERATOR_PROTOTYPE = !isObject(IteratorPrototype$2) || fails(function () {
+  var test = {};
+  // FF44- legacy iterators case
+  return IteratorPrototype$2[ITERATOR$2].call(test) !== test;
+});
+
+if (NEW_ITERATOR_PROTOTYPE) IteratorPrototype$2 = {};
+
+// `%IteratorPrototype%[@@iterator]()` method
+// https://tc39.es/ecma262/#sec-%iteratorprototype%-@@iterator
+if (!isCallable$1(IteratorPrototype$2[ITERATOR$2])) {
+  defineBuiltIn$1(IteratorPrototype$2, ITERATOR$2, function () {
+    return this;
+  });
+}
+
+var iteratorsCore = {
+  IteratorPrototype: IteratorPrototype$2,
+  BUGGY_SAFARI_ITERATORS: BUGGY_SAFARI_ITERATORS$1
+};
+
+var IteratorPrototype$1 = iteratorsCore.IteratorPrototype;
+var create = objectCreate;
+var createPropertyDescriptor = createPropertyDescriptor$1;
+var setToStringTag$1 = setToStringTag$2;
+var Iterators$2 = iterators;
+
+var returnThis$1 = function () { return this; };
+
+var iteratorCreateConstructor = function (IteratorConstructor, NAME, next, ENUMERABLE_NEXT) {
+  var TO_STRING_TAG = NAME + ' Iterator';
+  IteratorConstructor.prototype = create(IteratorPrototype$1, { next: createPropertyDescriptor(+!ENUMERABLE_NEXT, next) });
+  setToStringTag$1(IteratorConstructor, TO_STRING_TAG, false);
+  Iterators$2[TO_STRING_TAG] = returnThis$1;
+  return IteratorConstructor;
+};
+
+var $ = _export;
+var call = functionCall;
+var FunctionName = functionName;
+var isCallable = isCallable$3;
+var createIteratorConstructor = iteratorCreateConstructor;
+var getPrototypeOf = objectGetPrototypeOf;
+var setPrototypeOf = objectSetPrototypeOf;
+var setToStringTag = setToStringTag$2;
+var createNonEnumerableProperty$1 = createNonEnumerableProperty$2;
+var defineBuiltIn = defineBuiltIn$2;
+var wellKnownSymbol$1 = wellKnownSymbol$4;
+var Iterators$1 = iterators;
+var IteratorsCore = iteratorsCore;
+
+var PROPER_FUNCTION_NAME = FunctionName.PROPER;
+var CONFIGURABLE_FUNCTION_NAME = FunctionName.CONFIGURABLE;
+var IteratorPrototype = IteratorsCore.IteratorPrototype;
+var BUGGY_SAFARI_ITERATORS = IteratorsCore.BUGGY_SAFARI_ITERATORS;
+var ITERATOR$1 = wellKnownSymbol$1('iterator');
+var KEYS = 'keys';
+var VALUES = 'values';
+var ENTRIES = 'entries';
+
+var returnThis = function () { return this; };
+
+var iteratorDefine = function (Iterable, NAME, IteratorConstructor, next, DEFAULT, IS_SET, FORCED) {
+  createIteratorConstructor(IteratorConstructor, NAME, next);
+
+  var getIterationMethod = function (KIND) {
+    if (KIND === DEFAULT && defaultIterator) return defaultIterator;
+    if (!BUGGY_SAFARI_ITERATORS && KIND in IterablePrototype) return IterablePrototype[KIND];
+    switch (KIND) {
+      case KEYS: return function keys() { return new IteratorConstructor(this, KIND); };
+      case VALUES: return function values() { return new IteratorConstructor(this, KIND); };
+      case ENTRIES: return function entries() { return new IteratorConstructor(this, KIND); };
+    } return function () { return new IteratorConstructor(this); };
+  };
+
+  var TO_STRING_TAG = NAME + ' Iterator';
+  var INCORRECT_VALUES_NAME = false;
+  var IterablePrototype = Iterable.prototype;
+  var nativeIterator = IterablePrototype[ITERATOR$1]
+    || IterablePrototype['@@iterator']
+    || DEFAULT && IterablePrototype[DEFAULT];
+  var defaultIterator = !BUGGY_SAFARI_ITERATORS && nativeIterator || getIterationMethod(DEFAULT);
+  var anyNativeIterator = NAME == 'Array' ? IterablePrototype.entries || nativeIterator : nativeIterator;
+  var CurrentIteratorPrototype, methods, KEY;
+
+  // fix native
+  if (anyNativeIterator) {
+    CurrentIteratorPrototype = getPrototypeOf(anyNativeIterator.call(new Iterable()));
+    if (CurrentIteratorPrototype !== Object.prototype && CurrentIteratorPrototype.next) {
+      if (getPrototypeOf(CurrentIteratorPrototype) !== IteratorPrototype) {
+        if (setPrototypeOf) {
+          setPrototypeOf(CurrentIteratorPrototype, IteratorPrototype);
+        } else if (!isCallable(CurrentIteratorPrototype[ITERATOR$1])) {
+          defineBuiltIn(CurrentIteratorPrototype, ITERATOR$1, returnThis);
+        }
+      }
+      // Set @@toStringTag to native iterators
+      setToStringTag(CurrentIteratorPrototype, TO_STRING_TAG, true);
+    }
+  }
+
+  // fix Array.prototype.{ values, @@iterator }.name in V8 / FF
+  if (PROPER_FUNCTION_NAME && DEFAULT == VALUES && nativeIterator && nativeIterator.name !== VALUES) {
+    if (CONFIGURABLE_FUNCTION_NAME) {
+      createNonEnumerableProperty$1(IterablePrototype, 'name', VALUES);
+    } else {
+      INCORRECT_VALUES_NAME = true;
+      defaultIterator = function values() { return call(nativeIterator, this); };
+    }
+  }
+
+  // export additional methods
+  if (DEFAULT) {
+    methods = {
+      values: getIterationMethod(VALUES),
+      keys: IS_SET ? defaultIterator : getIterationMethod(KEYS),
+      entries: getIterationMethod(ENTRIES)
+    };
+    if (FORCED) for (KEY in methods) {
+      if (BUGGY_SAFARI_ITERATORS || INCORRECT_VALUES_NAME || !(KEY in IterablePrototype)) {
+        defineBuiltIn(IterablePrototype, KEY, methods[KEY]);
+      }
+    } else $({ target: NAME, proto: true, forced: BUGGY_SAFARI_ITERATORS || INCORRECT_VALUES_NAME }, methods);
+  }
+
+  // define iterator
+  if (IterablePrototype[ITERATOR$1] !== defaultIterator) {
+    defineBuiltIn(IterablePrototype, ITERATOR$1, defaultIterator, { name: DEFAULT });
+  }
+  Iterators$1[NAME] = defaultIterator;
+
+  return methods;
+};
+
+// `CreateIterResultObject` abstract operation
+// https://tc39.es/ecma262/#sec-createiterresultobject
+var createIterResultObject$1 = function (value, done) {
+  return { value: value, done: done };
+};
+
+var toIndexedObject = toIndexedObject$2;
+var addToUnscopables = addToUnscopables$1;
+var Iterators = iterators;
+var InternalStateModule = internalState;
+var defineProperty = objectDefineProperty.f;
+var defineIterator = iteratorDefine;
+var createIterResultObject = createIterResultObject$1;
+var DESCRIPTORS = descriptors;
+
+var ARRAY_ITERATOR = 'Array Iterator';
+var setInternalState = InternalStateModule.set;
+var getInternalState = InternalStateModule.getterFor(ARRAY_ITERATOR);
+
+// `Array.prototype.entries` method
+// https://tc39.es/ecma262/#sec-array.prototype.entries
+// `Array.prototype.keys` method
+// https://tc39.es/ecma262/#sec-array.prototype.keys
+// `Array.prototype.values` method
+// https://tc39.es/ecma262/#sec-array.prototype.values
+// `Array.prototype[@@iterator]` method
+// https://tc39.es/ecma262/#sec-array.prototype-@@iterator
+// `CreateArrayIterator` internal method
+// https://tc39.es/ecma262/#sec-createarrayiterator
+var es_array_iterator = defineIterator(Array, 'Array', function (iterated, kind) {
+  setInternalState(this, {
+    type: ARRAY_ITERATOR,
+    target: toIndexedObject(iterated), // target
+    index: 0,                          // next index
+    kind: kind                         // kind
+  });
+// `%ArrayIteratorPrototype%.next` method
+// https://tc39.es/ecma262/#sec-%arrayiteratorprototype%.next
+}, function () {
+  var state = getInternalState(this);
+  var target = state.target;
+  var kind = state.kind;
+  var index = state.index++;
+  if (!target || index >= target.length) {
+    state.target = undefined;
+    return createIterResultObject(undefined, true);
+  }
+  if (kind == 'keys') return createIterResultObject(index, false);
+  if (kind == 'values') return createIterResultObject(target[index], false);
+  return createIterResultObject([index, target[index]], false);
+}, 'values');
+
+// argumentsList[@@iterator] is %ArrayProto_values%
+// https://tc39.es/ecma262/#sec-createunmappedargumentsobject
+// https://tc39.es/ecma262/#sec-createmappedargumentsobject
+var values = Iterators.Arguments = Iterators.Array;
+
+// https://tc39.es/ecma262/#sec-array.prototype-@@unscopables
+addToUnscopables('keys');
+addToUnscopables('values');
+addToUnscopables('entries');
+
+// V8 ~ Chrome 45- bug
+if (DESCRIPTORS && values.name !== 'values') try {
+  defineProperty(values, 'name', { value: 'values' });
+} catch (error) { /* empty */ }
+
+// iterable DOM collections
+// flag - `iterable` interface - 'entries', 'keys', 'values', 'forEach' methods
+var domIterables = {
+  CSSRuleList: 0,
+  CSSStyleDeclaration: 0,
+  CSSValueList: 0,
+  ClientRectList: 0,
+  DOMRectList: 0,
+  DOMStringList: 0,
+  DOMTokenList: 1,
+  DataTransferItemList: 0,
+  FileList: 0,
+  HTMLAllCollection: 0,
+  HTMLCollection: 0,
+  HTMLFormElement: 0,
+  HTMLSelectElement: 0,
+  MediaList: 0,
+  MimeTypeArray: 0,
+  NamedNodeMap: 0,
+  NodeList: 1,
+  PaintRequestList: 0,
+  Plugin: 0,
+  PluginArray: 0,
+  SVGLengthList: 0,
+  SVGNumberList: 0,
+  SVGPathSegList: 0,
+  SVGPointList: 0,
+  SVGStringList: 0,
+  SVGTransformList: 0,
+  SourceBufferList: 0,
+  StyleSheetList: 0,
+  TextTrackCueList: 0,
+  TextTrackList: 0,
+  TouchList: 0
+};
+
+// in old WebKit versions, `element.classList` is not an instance of global `DOMTokenList`
+var documentCreateElement = documentCreateElement$2;
+
+var classList = documentCreateElement('span').classList;
+var DOMTokenListPrototype$1 = classList && classList.constructor && classList.constructor.prototype;
+
+var domTokenListPrototype = DOMTokenListPrototype$1 === Object.prototype ? undefined : DOMTokenListPrototype$1;
+
+var global = global$1;
+var DOMIterables = domIterables;
+var DOMTokenListPrototype = domTokenListPrototype;
+var ArrayIteratorMethods = es_array_iterator;
+var createNonEnumerableProperty = createNonEnumerableProperty$2;
+var wellKnownSymbol = wellKnownSymbol$4;
+
+var ITERATOR = wellKnownSymbol('iterator');
+var TO_STRING_TAG = wellKnownSymbol('toStringTag');
+var ArrayValues = ArrayIteratorMethods.values;
+
+var handlePrototype = function (CollectionPrototype, COLLECTION_NAME) {
+  if (CollectionPrototype) {
+    // some Chrome versions have non-configurable methods on DOMTokenList
+    if (CollectionPrototype[ITERATOR] !== ArrayValues) try {
+      createNonEnumerableProperty(CollectionPrototype, ITERATOR, ArrayValues);
+    } catch (error) {
+      CollectionPrototype[ITERATOR] = ArrayValues;
+    }
+    if (!CollectionPrototype[TO_STRING_TAG]) {
+      createNonEnumerableProperty(CollectionPrototype, TO_STRING_TAG, COLLECTION_NAME);
+    }
+    if (DOMIterables[COLLECTION_NAME]) for (var METHOD_NAME in ArrayIteratorMethods) {
+      // some Chrome versions have non-configurable methods on DOMTokenList
+      if (CollectionPrototype[METHOD_NAME] !== ArrayIteratorMethods[METHOD_NAME]) try {
+        createNonEnumerableProperty(CollectionPrototype, METHOD_NAME, ArrayIteratorMethods[METHOD_NAME]);
+      } catch (error) {
+        CollectionPrototype[METHOD_NAME] = ArrayIteratorMethods[METHOD_NAME];
+      }
+    }
+  }
+};
+
+for (var COLLECTION_NAME in DOMIterables) {
+  handlePrototype(global[COLLECTION_NAME] && global[COLLECTION_NAME].prototype, COLLECTION_NAME);
+}
+
+handlePrototype(DOMTokenListPrototype, 'DOMTokenList');
+
+export { objectCreate as o };

package/shared/when.js

@@ -0,0 +1,15 @@
+/**
+ * A directive that enables basic conditional rendering in a template.
+ * @param binding - The condition to test for rendering.
+ * @param templateOrTemplateBinding - The template or a binding that gets
+ * the template to render when the condition is true.
+ * @public
+ */
+function when(binding, templateOrTemplateBinding) {
+    const getTemplate = typeof templateOrTemplateBinding === "function"
+        ? templateOrTemplateBinding
+        : () => templateOrTemplateBinding;
+    return (source, context) => binding(source, context) ? getTemplate(source, context) : null;
+}
+
+export { when as w };

package/side-drawer/index.js

@@ -0,0 +1,102 @@
+import { F as FoundationElement, c as __classPrivateFieldGet, _ as __decorate, a as attr, b as __metadata, h as html, d as designSystem } from '../shared/index.js';
+import '../shared/web.dom-collections.iterator.js';
+import { w as when } from '../shared/when.js';
+import { c as classNames } from '../shared/class-names.js';
+import '../shared/export.js';
+import '../shared/object-keys.js';
+import '../shared/iterators.js';
+
+var _SideDrawer_instances, _SideDrawer_close, _SideDrawer_open;
+class SideDrawer extends FoundationElement {
+  constructor() {
+    super(...arguments);
+
+    _SideDrawer_instances.add(this);
+
+    this.alternate = false;
+    this.modal = false;
+    this.open = false;
+    this.trailing = false;
+  }
+
+  attributeChangedCallback(name, oldValue, newValue) {
+    super.attributeChangedCallback(name, oldValue, newValue);
+
+    switch (name) {
+      case 'open':
+        {
+          this.open ? __classPrivateFieldGet(this, _SideDrawer_instances, "m", _SideDrawer_open).call(this) : __classPrivateFieldGet(this, _SideDrawer_instances, "m", _SideDrawer_close).call(this);
+        }
+    }
+  }
+
+}
+_SideDrawer_instances = new WeakSet(), _SideDrawer_close = function _SideDrawer_close() {
+  this.$emit('close');
+}, _SideDrawer_open = function _SideDrawer_open() {
+  this.$emit('open');
+};
+
+__decorate([attr({
+  mode: 'boolean'
+}), __metadata("design:type", Object)], SideDrawer.prototype, "alternate", void 0);
+
+__decorate([attr({
+  mode: 'boolean'
+}), __metadata("design:type", Object)], SideDrawer.prototype, "modal", void 0);
+
+__decorate([attr({
+  mode: 'boolean'
+}), __metadata("design:type", Object)], SideDrawer.prototype, "open", void 0);
+
+__decorate([attr({
+  mode: 'boolean'
+}), __metadata("design:type", Object)], SideDrawer.prototype, "trailing", void 0);
+
+var css_248z = "/**\n * Do not edit directly\n * Generated on Thu, 06 Oct 2022 14:03:46 GMT\n */\n.control {\n  position: fixed;\n  z-index: 1;\n  background-color: var(--vvd-color-canvas);\n  color: var(--vvd-color-canvas-text);\n  inline-size: 280px;\n  inset-block: 0;\n  overflow-y: auto;\n}\n.control[part~=vvd-theme-alternate] {\n  background-color: var(--vvd-color-canvas);\n  color: var(--vvd-color-canvas-text);\n  color-scheme: var(--vvd-color-scheme);\n}\n.control.trailing {\n  inset-inline-end: 0;\n}\n.control:not(.open).trailing {\n  transform: translateX(100%);\n}\n.control:not(.open):not(.trailing) {\n  transform: translateX(-100%);\n}\n.control.open:not(.modal).trailing + .side-drawer-app-content {\n  margin-inline-end: var(--side-drawer-app-content-offset, 280px);\n}\n.control.open:not(.modal):not(.trailing) + .side-drawer-app-content {\n  margin-inline-start: var(--side-drawer-app-content-offset, 280px);\n}\n@media (prefers-reduced-motion: no-preference) {\n  .control {\n    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n  }\n}\n\n.scrim {\n  background-color: var(--vvd-color-canvas-text);\n  opacity: 0.5;\n  position: fixed;\n  inset: 0;\n}\n.scrim:not(.open) {\n  display: none;\n}";
+
+let _ = t => t,
+    _t,
+    _t2;
+
+const getClasses = ({
+  modal,
+  open,
+  trailing
+}) => classNames('control', ['modal', modal], ['open', open], ['trailing', trailing]);
+
+const getScrimClasses = ({
+  open
+}) => classNames('scrim', ['open', open]);
+
+const sideDrawerTemplate = () => html(_t || (_t = _`
+	<aside class="${0}" part="base ${0}"
+	 @keydown="${0}">
+    <slot></slot>
+	</aside>
+
+	<div class="side-drawer-app-content" ?inert="${0}">
+		<slot name="app-content"></slot>
+	</div>
+
+	${0}
+`), getClasses, x => x.alternate ? 'vvd-theme-alternate' : '', (x, c) => handleKeydown(x, c.event), x => x.open && x.modal, when(x => x.modal, html(_t2 || (_t2 = _`<div class="${0}" @click="${0}"></div>`), getScrimClasses, x => x.open = false)));
+
+const handleKeydown = (x, {
+  key
+}) => {
+  if (key === 'Escape') {
+    x.open = false;
+  } else {
+    return true;
+  }
+};
+
+const vividSideDrawer = SideDrawer.compose({
+  baseName: 'side-drawer',
+  template: sideDrawerTemplate,
+  styles: css_248z
+});
+designSystem.register(vividSideDrawer());
+
+export { vividSideDrawer };

package/styles/core/all.css

@@ -0,0 +1,75 @@
+/**
+ * Do not edit directly
+ * Generated on Thu, 06 Oct 2022 14:03:46 GMT
+ */
+.vvd-root {
+  color-scheme: var(--vvd-color-scheme);
+  background-color: var(--vvd-color-canvas);
+  color: var(--vvd-color-canvas-text);
+}
+
+.vvd-root {
+  font-feature-settings: "kern"; /* turns on kerning */
+  text-rendering: optimizeLegibility; /* emphasise on legibility when rendering, turns on ligatures and kerning */
+  -webkit-font-smoothing: antialiased; /* apply font anti-aliasing for Webkit on OSX */
+  -moz-osx-font-smoothing: grayscale; /* apply font anti-aliasing for Firefox on OSX */
+  font: var(--vvd-font-base);
+}
+.vvd-root p {
+  font: var(--vvd-font-base);
+  margin-block: 16px;
+}
+.vvd-root b, .vvd-root strong {
+  font: var(--vvd-font-base-bold);
+}
+.vvd-root pre, .vvd-root var, .vvd-root code, .vvd-root kbd, .vvd-root samp {
+  font: var(--vvd-font-base-code);
+}
+.vvd-root .headline {
+  font: var(--vvd-font-headline);
+  margin-block: 40px;
+}
+.vvd-root .subtitle {
+  font: var(--vvd-font-subtitle);
+  margin-block: 40px;
+}
+.vvd-root h1, .vvd-root .heading1 {
+  font: var(--vvd-font-heading1);
+  margin-block: 32px;
+}
+.vvd-root h2, .vvd-root .heading2 {
+  font: var(--vvd-font-heading2);
+  margin-block: 32px;
+}
+.vvd-root h3, .vvd-root .heading3 {
+  font: var(--vvd-font-heading3);
+  margin-block: 24px;
+}
+.vvd-root h4, .vvd-root .heading4 {
+  font: var(--vvd-font-heading4);
+  margin-block: 24px;
+}
+.vvd-root small, .vvd-root figcaption {
+  font: var(--vvd-font-base-condensed);
+}
+.vvd-root small b, .vvd-root small strong, .vvd-root figcaption b, .vvd-root figcaption strong {
+  font: var(--vvd-font-base-condensed-bold);
+}
+.vvd-root small pre, .vvd-root small var, .vvd-root small code, .vvd-root small kbd, .vvd-root small samp, .vvd-root figcaption pre, .vvd-root figcaption var, .vvd-root figcaption code, .vvd-root figcaption kbd, .vvd-root figcaption samp {
+  font: var(--vvd-font-base-condensed-code);
+}
+.vvd-root sub,
+.vvd-root sup {
+  font: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+.vvd-root sub {
+  bottom: -0.25em;
+}
+.vvd-root sup {
+  top: -0.5em;
+}
+
+/*# sourceMappingURL=all.css.map */

package/styles/core/theme.css

@@ -0,0 +1,11 @@
+/**
+ * Do not edit directly
+ * Generated on Thu, 06 Oct 2022 14:03:46 GMT
+ */
+.vvd-root {
+  color-scheme: var(--vvd-color-scheme);
+  background-color: var(--vvd-color-canvas);
+  color: var(--vvd-color-canvas-text);
+}
+
+/*# sourceMappingURL=theme.css.map */