@vonage/vivid 3.50.0 → 3.50.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vonage/vivid",
-  "version": "3.50.0",
+  "version": "3.50.1",
   "type": "module",
   "module": "./index.js",
   "main": "./index.cjs",

package/pagination/index.cjs

@@ -8,8 +8,6 @@ require('../shared/icon.cjs');
 require('../shared/_has.cjs');
 require('../shared/class-names.cjs');
 require('../shared/when.cjs');
-require('../shared/definition59.cjs');
-require('../shared/focus.cjs');
 require('../shared/definition37.cjs');
 require('../shared/base-progress.cjs');
 require('../shared/affix.cjs');

package/pagination/index.js

@@ -6,8 +6,6 @@ import '../shared/icon.js';
 import '../shared/_has.js';
 import '../shared/class-names.js';
 import '../shared/when.js';
-import '../shared/definition59.js';
-import '../shared/focus.js';
 import '../shared/definition37.js';
 import '../shared/base-progress.js';
 import '../shared/affix.js';

package/popup/index.cjs

@@ -1,6 +1,6 @@
 'use strict';
 
-const definition = require('../shared/definition61.cjs');
+const definition = require('../shared/definition60.cjs');
 require('../shared/index.cjs');
 require('../shared/definition11.cjs');
 require('../shared/definition26.cjs');
@@ -8,8 +8,6 @@ require('../shared/icon.cjs');
 require('../shared/_has.cjs');
 require('../shared/class-names.cjs');
 require('../shared/when.cjs');
-require('../shared/definition59.cjs');
-require('../shared/focus.cjs');
 require('../shared/definition37.cjs');
 require('../shared/base-progress.cjs');
 require('../shared/affix.cjs');
@@ -22,6 +20,6 @@ require('../shared/aria-global.cjs');
 require('../shared/start-end.cjs');
 require('../shared/ref.cjs');
 require('../shared/enums.cjs');
-require('../shared/definition60.cjs');
+require('../shared/definition59.cjs');
 
 definition.registerPopup();

package/popup/index.js

@@ -1,4 +1,4 @@
-import { r as registerPopup } from '../shared/definition61.js';
+import { r as registerPopup } from '../shared/definition60.js';
 import '../shared/index.js';
 import '../shared/definition11.js';
 import '../shared/definition26.js';
@@ -6,8 +6,6 @@ import '../shared/icon.js';
 import '../shared/_has.js';
 import '../shared/class-names.js';
 import '../shared/when.js';
-import '../shared/definition59.js';
-import '../shared/focus.js';
 import '../shared/definition37.js';
 import '../shared/base-progress.js';
 import '../shared/affix.js';
@@ -20,6 +18,6 @@ import '../shared/aria-global.js';
 import '../shared/start-end.js';
 import '../shared/ref.js';
 import '../shared/enums.js';
-import '../shared/definition60.js';
+import '../shared/definition59.js';
 
 registerPopup();

package/radio/index.cjs

@@ -2,8 +2,6 @@
 
 const definition = require('../shared/definition40.cjs');
 require('../shared/index.cjs');
-require('../shared/definition59.cjs');
-require('../shared/focus.cjs');
 require('../shared/radio.cjs');
 require('../shared/form-associated.cjs');
 require('../shared/key-codes.cjs');

package/radio/index.js

@@ -1,7 +1,5 @@
 import { b as registerRadio } from '../shared/definition40.js';
 import '../shared/index.js';
-import '../shared/definition59.js';
-import '../shared/focus.js';
 import '../shared/radio.js';
 import '../shared/form-associated.js';
 import '../shared/key-codes.js';

package/select/index.cjs

@@ -2,9 +2,7 @@
 
 const definition = require('../shared/definition41.cjs');
 require('../shared/index.cjs');
-require('../shared/definition59.cjs');
-require('../shared/focus.cjs');
-require('../shared/definition61.cjs');
+require('../shared/definition60.cjs');
 require('../shared/definition11.cjs');
 require('../shared/definition26.cjs');
 require('../shared/icon.cjs');
@@ -23,10 +21,9 @@ require('../shared/aria-global.cjs');
 require('../shared/start-end.cjs');
 require('../shared/ref.cjs');
 require('../shared/enums.cjs');
-require('../shared/definition60.cjs');
+require('../shared/definition59.cjs');
 require('../shared/definition35.cjs');
 require('../shared/dom.cjs');
-require('../shared/focus2.cjs');
 require('../shared/index2.cjs');
 require('../locales/en-US.cjs');
 require('../shared/listbox.cjs');

package/select/index.js

@@ -1,8 +1,6 @@
 import { r as registerSelect } from '../shared/definition41.js';
 import '../shared/index.js';
-import '../shared/definition59.js';
-import '../shared/focus.js';
-import '../shared/definition61.js';
+import '../shared/definition60.js';
 import '../shared/definition11.js';
 import '../shared/definition26.js';
 import '../shared/icon.js';
@@ -21,10 +19,9 @@ import '../shared/aria-global.js';
 import '../shared/start-end.js';
 import '../shared/ref.js';
 import '../shared/enums.js';
-import '../shared/definition60.js';
+import '../shared/definition59.js';
 import '../shared/definition35.js';
 import '../shared/dom.js';
-import '../shared/focus2.js';
 import '../shared/index2.js';
 import '../locales/en-US.js';
 import '../shared/listbox.js';

package/selectable-box/index.cjs

@@ -8,8 +8,6 @@ require('../shared/icon.cjs');
 require('../shared/_has.cjs');
 require('../shared/class-names.cjs');
 require('../shared/when.cjs');
-require('../shared/definition59.cjs');
-require('../shared/focus.cjs');
 require('../shared/affix.cjs');
 require('../shared/slotted.cjs');
 require('../shared/index2.cjs');
@@ -19,7 +17,6 @@ require('../shared/key-codes.cjs');
 require('../shared/apply-mixins.cjs');
 require('../shared/definition40.cjs');
 require('../shared/radio.cjs');
-require('../shared/focus2.cjs');
 require('../shared/enums.cjs');
 
 definition.registerSelectableBox();

package/selectable-box/index.js

@@ -6,8 +6,6 @@ import '../shared/icon.js';
 import '../shared/_has.js';
 import '../shared/class-names.js';
 import '../shared/when.js';
-import '../shared/definition59.js';
-import '../shared/focus.js';
 import '../shared/affix.js';
 import '../shared/slotted.js';
 import '../shared/index2.js';
@@ -17,7 +15,6 @@ import '../shared/key-codes.js';
 import '../shared/apply-mixins.js';
 import '../shared/definition40.js';
 import '../shared/radio.js';
-import '../shared/focus2.js';
 import '../shared/enums.js';
 
 registerSelectableBox();

package/shared/definition.cjs

@@ -2,7 +2,6 @@
 
 const index = require('./index.cjs');
 const definition = require('./definition26.cjs');
-const definition$1 = require('./definition59.cjs');
 const affix = require('./affix.cjs');
 const applyMixins = require('./apply-mixins.cjs');
 const startEnd = require('./start-end.cjs');
@@ -151,12 +150,9 @@ const AccordionItemTemplate = (context) => index.html`
 const accordionItemDefinition = AccordionItem.compose({
   baseName: "accordion-item",
   template: AccordionItemTemplate,
-  styles,
-  shadowOptions: {
-    delegatesFocus: true
-  }
+  styles
 });
-const accordionItemRegistries = [accordionItemDefinition(), ...definition.iconRegistries, ...definition$1.focusRegistries];
+const accordionItemRegistries = [accordionItemDefinition(), ...definition.iconRegistries];
 const registerAccordionItem = index.registerFactory(accordionItemRegistries);
 
 exports.AccordionItem = AccordionItem$1;

package/shared/definition.js

@@ -1,6 +1,5 @@
 import { F as FoundationElement, _ as __decorate, a as attr, n as nullableNumberConverter, h as html, r as registerFactory } from './index.js';
 import { a as iconRegistries } from './definition26.js';
-import { f as focusRegistries } from './definition59.js';
 import { b as AffixIconWithTrailing, a as affixIconTemplateFactory, I as IconWrapper } from './affix.js';
 import { a as applyMixins } from './apply-mixins.js';
 import { S as StartEnd } from './start-end.js';
@@ -149,12 +148,9 @@ const AccordionItemTemplate = (context) => html`
 const accordionItemDefinition = AccordionItem.compose({
   baseName: "accordion-item",
   template: AccordionItemTemplate,
-  styles,
-  shadowOptions: {
-    delegatesFocus: true
-  }
+  styles
 });
-const accordionItemRegistries = [accordionItemDefinition(), ...iconRegistries, ...focusRegistries];
+const accordionItemRegistries = [accordionItemDefinition(), ...iconRegistries];
 const registerAccordionItem = registerFactory(accordionItemRegistries);
 
 export { AccordionItem$1 as A, accordionItemDefinition as a, accordionItemRegistries as b, registerAccordionItem as r };

package/shared/definition11.cjs

@@ -2,7 +2,6 @@
 
 const index = require('./index.cjs');
 const definition$1 = require('./definition26.cjs');
-const definition$2 = require('./definition59.cjs');
 const definition = require('./definition37.cjs');
 const affix = require('./affix.cjs');
 const button = require('./button.cjs');
@@ -155,7 +154,7 @@ const buttonDefinition = Button.compose({
     delegatesFocus: true
   }
 });
-const buttonRegistries = [buttonDefinition(), ...definition$1.iconRegistries, ...definition$2.focusRegistries, ...definition.progressRingRegistries];
+const buttonRegistries = [buttonDefinition(), ...definition$1.iconRegistries, ...definition.progressRingRegistries];
 const registerButton = index.registerFactory(buttonRegistries);
 
 exports.Button = Button;

package/shared/definition11.js

@@ -1,6 +1,5 @@
 import { a as attr, h as html, r as registerFactory } from './index.js';
 import { a as iconRegistries } from './definition26.js';
-import { f as focusRegistries } from './definition59.js';
 import { P as ProgressRing, a as progressRingRegistries } from './definition37.js';
 import { b as AffixIconWithTrailing, a as affixIconTemplateFactory, I as IconWrapper, c as IconAriaHidden } from './affix.js';
 import { B as Button$1 } from './button.js';
@@ -153,7 +152,7 @@ const buttonDefinition = Button.compose({
     delegatesFocus: true
   }
 });
-const buttonRegistries = [buttonDefinition(), ...iconRegistries, ...focusRegistries, ...progressRingRegistries];
+const buttonRegistries = [buttonDefinition(), ...iconRegistries, ...progressRingRegistries];
 const registerButton = registerFactory(buttonRegistries);
 
 export { Button as B, buttonRegistries as a, buttonDefinition as b, registerButton as r };

package/shared/definition14.cjs

@@ -2,7 +2,7 @@
 
 const index = require('./index.cjs');
 const definition$1 = require('./definition26.cjs');
-const definition = require('./definition60.cjs');
+const definition = require('./definition59.cjs');
 const enums = require('./enums.cjs');
 const icon = require('./icon.cjs');
 const when = require('./when.cjs');

package/shared/definition14.js

@@ -1,6 +1,6 @@
 import { F as FoundationElement, a as attr, o as observable, h as html, r as registerFactory } from './index.js';
 import { a as iconRegistries } from './definition26.js';
-import { E as Elevation, e as elevationRegistries } from './definition60.js';
+import { E as Elevation, e as elevationRegistries } from './definition59.js';
 import { A as Appearance } from './enums.js';
 import { I as Icon } from './icon.js';
 import { w as when } from './when.js';

package/shared/definition15.cjs

@@ -2,7 +2,6 @@
 
 const index = require('./index.cjs');
 const definition = require('./definition26.cjs');
-const definition$1 = require('./definition59.cjs');
 require('./affix.cjs');
 const index$1 = require('./index2.cjs');
 const formAssociated = require('./form-associated.cjs');
@@ -99,7 +98,7 @@ index.__decorate([
     index.observable
 ], Checkbox$1.prototype, "indeterminate", void 0);
 
-const styles = ":host{display:inline-flex;flex-direction:column;vertical-align:middle}:host([disabled]){cursor:not-allowed}.base{display:inline-flex;align-items:center;gap:8px;vertical-align:middle}.base.connotation-cta{--_connotation-color-primary: var(--vvd-checkbox-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-checkbox-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-checkbox-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-fierce: var(--vvd-checkbox-cta-fierce, var(--vvd-color-cta-700));--_connotation-color-intermediate: var(--vvd-checkbox-cta-intermediate, var(--vvd-color-cta-500));--_connotation-color-firm: var(--vvd-checkbox-cta-firm, var(--vvd-color-cta-600))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-checkbox-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-checkbox-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-checkbox-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-fierce: var(--vvd-checkbox-accent-fierce, var(--vvd-color-neutral-700));--_connotation-color-intermediate: var(--vvd-checkbox-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-firm: var(--vvd-checkbox-accent-firm, var(--vvd-color-canvas-text))}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-intermediate)}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-fierce)}.base:where(:checked,.checked):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: var(--_connotation-color-primary)}.base:where(:checked,.checked):where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary-increment);--_appearance-color-outline: var(--_connotation-color-primary-increment)}.base:where(:disabled,.disabled){--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.base:where(.readonly):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}.base:focus-visible{outline:none}@supports (user-select: none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}.base.disabled{pointer-events:none}.control{position:relative;display:flex;flex-shrink:0;align-items:center;justify-content:center;background-color:var(--_appearance-color-fill);block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));border-radius:4px;box-shadow:inset 0 0 0 2px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base:focus-visible .control{--focus-inset: -3px;--focus-stroke-gap-color: transparent}.base:focus-visible .control:before{box-shadow:inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:2px solid var(--focus-stroke-color, var(--vvd-color-canvas-text));outline-offset:calc(-2px - var(--focus-inset, 0px));position:absolute;display:block;block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));border-radius:2px;content:\"\";inline-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.indicator{font-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)) - 4px)}.base:not(.checked) .indicator.checkmark{display:none}.base.checked .indicator.minus,.base:not(.indeterminate) .indicator.minus{display:none}label{display:flex;flex-wrap:wrap;align-items:center;color:var(--vvd-color-canvas-text);column-gap:4px;cursor:pointer;font:var(--vvd-typography-base)}.hide-label label{display:none}.icon{font-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2))*.6);line-height:1}.message{margin-block-start:4px;--_low-ink-color: var(--vvd-color-neutral-600)}\n";
+const styles = ":host{display:inline-flex;flex-direction:column;vertical-align:middle}:host([disabled]){cursor:not-allowed}.base{display:inline-flex;align-items:center;gap:8px;vertical-align:middle}.base.connotation-cta{--_connotation-color-primary: var(--vvd-checkbox-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-checkbox-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-checkbox-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-fierce: var(--vvd-checkbox-cta-fierce, var(--vvd-color-cta-700));--_connotation-color-intermediate: var(--vvd-checkbox-cta-intermediate, var(--vvd-color-cta-500));--_connotation-color-firm: var(--vvd-checkbox-cta-firm, var(--vvd-color-cta-600))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-checkbox-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-checkbox-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-checkbox-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-fierce: var(--vvd-checkbox-accent-fierce, var(--vvd-color-neutral-700));--_connotation-color-intermediate: var(--vvd-checkbox-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-firm: var(--vvd-checkbox-accent-firm, var(--vvd-color-canvas-text))}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-intermediate)}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-fierce)}.base:where(:checked,.checked):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: var(--_connotation-color-primary)}.base:where(:checked,.checked):where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary-increment);--_appearance-color-outline: var(--_connotation-color-primary-increment)}.base:where(:disabled,.disabled){--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.base:where(.readonly):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}.base:focus-visible{outline:none}@supports (user-select: none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}.base.disabled{pointer-events:none}.control{position:relative;display:flex;flex-shrink:0;align-items:center;justify-content:center;background-color:var(--_appearance-color-fill);block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));border-radius:4px;box-shadow:inset 0 0 0 2px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base:focus-visible .control{--focus-inset: -3px;--focus-stroke-gap-color: transparent}.base:focus-visible .control:before{box-shadow:inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:2px solid var(--focus-stroke-color, var(--vvd-color-canvas-text));outline-offset:calc(-2px - var(--focus-inset, 0px));position:absolute;display:block;block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));border-radius:2px;content:\"\";inline-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base.error:not(.checked) .control{background-color:var(--vvd-color-alert-50);box-shadow:inset 0 0 0 2px var(--vvd-color-alert-500)}.indicator{font-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)) - 4px)}.base:not(.checked) .indicator.checkmark{display:none}.base.checked .indicator.minus,.base:not(.indeterminate) .indicator.minus{display:none}label{display:flex;flex-wrap:wrap;align-items:center;color:var(--vvd-color-canvas-text);column-gap:4px;cursor:pointer;font:var(--vvd-typography-base)}.hide-label label{display:none}.icon{font-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2))*.6);line-height:1}.message{margin-block-start:4px;--_low-ink-color: var(--vvd-color-neutral-600)}\n";
 
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -238,7 +237,7 @@ const checkboxDefinition = exports.Checkbox.compose({
     delegatesFocus: true
   }
 });
-const checkboxRegistries = [checkboxDefinition(), ...definition.iconRegistries, ...definition$1.focusRegistries];
+const checkboxRegistries = [checkboxDefinition(), ...definition.iconRegistries];
 const registerCheckbox = index.registerFactory(checkboxRegistries);
 
 exports.checkboxDefinition = checkboxDefinition;

package/shared/definition15.js

@@ -1,6 +1,5 @@
 import { F as FoundationElement, _ as __decorate, a as attr, o as observable, h as html, r as registerFactory } from './index.js';
 import { a as iconRegistries } from './definition26.js';
-import { f as focusRegistries } from './definition59.js';
 import './affix.js';
 import { e as errorText, f as formElements, F as FormElementSuccessText, a as FormElementHelperText, g as getFeedbackTemplate } from './index2.js';
 import { C as CheckableFormAssociated } from './form-associated.js';
@@ -97,7 +96,7 @@ __decorate([
     observable
 ], Checkbox$1.prototype, "indeterminate", void 0);
 
-const styles = ":host{display:inline-flex;flex-direction:column;vertical-align:middle}:host([disabled]){cursor:not-allowed}.base{display:inline-flex;align-items:center;gap:8px;vertical-align:middle}.base.connotation-cta{--_connotation-color-primary: var(--vvd-checkbox-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-checkbox-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-checkbox-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-fierce: var(--vvd-checkbox-cta-fierce, var(--vvd-color-cta-700));--_connotation-color-intermediate: var(--vvd-checkbox-cta-intermediate, var(--vvd-color-cta-500));--_connotation-color-firm: var(--vvd-checkbox-cta-firm, var(--vvd-color-cta-600))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-checkbox-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-checkbox-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-checkbox-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-fierce: var(--vvd-checkbox-accent-fierce, var(--vvd-color-neutral-700));--_connotation-color-intermediate: var(--vvd-checkbox-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-firm: var(--vvd-checkbox-accent-firm, var(--vvd-color-canvas-text))}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-intermediate)}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-fierce)}.base:where(:checked,.checked):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: var(--_connotation-color-primary)}.base:where(:checked,.checked):where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary-increment);--_appearance-color-outline: var(--_connotation-color-primary-increment)}.base:where(:disabled,.disabled){--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.base:where(.readonly):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}.base:focus-visible{outline:none}@supports (user-select: none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}.base.disabled{pointer-events:none}.control{position:relative;display:flex;flex-shrink:0;align-items:center;justify-content:center;background-color:var(--_appearance-color-fill);block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));border-radius:4px;box-shadow:inset 0 0 0 2px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base:focus-visible .control{--focus-inset: -3px;--focus-stroke-gap-color: transparent}.base:focus-visible .control:before{box-shadow:inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:2px solid var(--focus-stroke-color, var(--vvd-color-canvas-text));outline-offset:calc(-2px - var(--focus-inset, 0px));position:absolute;display:block;block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));border-radius:2px;content:\"\";inline-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.indicator{font-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)) - 4px)}.base:not(.checked) .indicator.checkmark{display:none}.base.checked .indicator.minus,.base:not(.indeterminate) .indicator.minus{display:none}label{display:flex;flex-wrap:wrap;align-items:center;color:var(--vvd-color-canvas-text);column-gap:4px;cursor:pointer;font:var(--vvd-typography-base)}.hide-label label{display:none}.icon{font-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2))*.6);line-height:1}.message{margin-block-start:4px;--_low-ink-color: var(--vvd-color-neutral-600)}\n";
+const styles = ":host{display:inline-flex;flex-direction:column;vertical-align:middle}:host([disabled]){cursor:not-allowed}.base{display:inline-flex;align-items:center;gap:8px;vertical-align:middle}.base.connotation-cta{--_connotation-color-primary: var(--vvd-checkbox-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-checkbox-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-checkbox-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-fierce: var(--vvd-checkbox-cta-fierce, var(--vvd-color-cta-700));--_connotation-color-intermediate: var(--vvd-checkbox-cta-intermediate, var(--vvd-color-cta-500));--_connotation-color-firm: var(--vvd-checkbox-cta-firm, var(--vvd-color-cta-600))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-checkbox-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-checkbox-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-checkbox-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-fierce: var(--vvd-checkbox-accent-fierce, var(--vvd-color-neutral-700));--_connotation-color-intermediate: var(--vvd-checkbox-accent-intermediate, var(--vvd-color-neutral-500));--_connotation-color-firm: var(--vvd-checkbox-accent-firm, var(--vvd-color-canvas-text))}.base{--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-intermediate)}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-canvas);--_appearance-color-outline: var(--_connotation-color-fierce)}.base:where(:checked,.checked):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary);--_appearance-color-outline: var(--_connotation-color-primary)}.base:where(:checked,.checked):where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary-text);--_appearance-color-fill: var(--_connotation-color-primary-increment);--_appearance-color-outline: var(--_connotation-color-primary-increment)}.base:where(:disabled,.disabled){--_appearance-color-text: var(--vvd-color-neutral-300);--_appearance-color-fill: var(--vvd-color-neutral-100);--_appearance-color-outline: var(--vvd-color-neutral-300)}.base:where(.readonly):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--vvd-color-canvas-text);--_appearance-color-fill: var(--vvd-color-neutral-200);--_appearance-color-outline: var(--vvd-color-neutral-400)}.base:focus-visible{outline:none}@supports (user-select: none){.base{user-select:none}}.base:not(.disabled){cursor:pointer}.base.disabled{pointer-events:none}.control{position:relative;display:flex;flex-shrink:0;align-items:center;justify-content:center;background-color:var(--_appearance-color-fill);block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));border-radius:4px;box-shadow:inset 0 0 0 2px var(--_appearance-color-outline);color:var(--_appearance-color-text);inline-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base:focus-visible .control{--focus-inset: -3px;--focus-stroke-gap-color: transparent}.base:focus-visible .control:before{box-shadow:inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:2px solid var(--focus-stroke-color, var(--vvd-color-canvas-text));outline-offset:calc(-2px - var(--focus-inset, 0px));position:absolute;display:block;block-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)));border-radius:2px;content:\"\";inline-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base.error:not(.checked) .control{background-color:var(--vvd-color-alert-50);box-shadow:inset 0 0 0 2px var(--vvd-color-alert-500)}.indicator{font-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2)) - 4px)}.base:not(.checked) .indicator.checkmark{display:none}.base.checked .indicator.minus,.base:not(.indeterminate) .indicator.minus{display:none}label{display:flex;flex-wrap:wrap;align-items:center;color:var(--vvd-color-canvas-text);column-gap:4px;cursor:pointer;font:var(--vvd-typography-base)}.hide-label label{display:none}.icon{font-size:calc(1px*(20 + 4*clamp(-1,var(--vvd-size-density, 0),2))*.6);line-height:1}.message{margin-block-start:4px;--_low-ink-color: var(--vvd-color-neutral-600)}\n";
 
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -236,7 +235,7 @@ const checkboxDefinition = Checkbox.compose({
     delegatesFocus: true
   }
 });
-const checkboxRegistries = [checkboxDefinition(), ...iconRegistries, ...focusRegistries];
+const checkboxRegistries = [checkboxDefinition(), ...iconRegistries];
 const registerCheckbox = registerFactory(checkboxRegistries);
 
 export { Checkbox as C, checkboxRegistries as a, checkboxDefinition as c, registerCheckbox as r };

package/shared/definition16.cjs

@@ -2,8 +2,8 @@
 
 const index = require('./index.cjs');
 const definition$1 = require('./definition26.cjs');
-const definition = require('./definition61.cjs');
-const definition$2 = require('./definition59.cjs');
+const definition = require('./definition60.cjs');
+const definition$2 = require('./definition61.cjs');
 const definition$3 = require('./definition35.cjs');
 const textField = require('./text-field.cjs');
 const affix = require('./affix.cjs');

package/shared/definition16.js

@@ -1,7 +1,7 @@
 import { D as DOM, O as Observable, _ as __decorate, a as attr, o as observable, h as html, r as registerFactory } from './index.js';
 import { a as iconRegistries } from './definition26.js';
-import { P as Popup, p as popupRegistries } from './definition61.js';
-import { f as focusRegistries } from './definition59.js';
+import { P as Popup, p as popupRegistries } from './definition60.js';
+import { f as focusRegistries } from './definition61.js';
 import { a as listboxOptionRegistries } from './definition35.js';
 import { s as styles$1 } from './text-field.js';
 import { A as AffixIcon, a as affixIconTemplateFactory } from './affix.js';

package/shared/definition17.cjs

@@ -7,7 +7,6 @@ const repeat = require('./repeat.cjs');
 const slotted = require('./slotted.cjs');
 const children = require('./children.cjs');
 const icon = require('./icon.cjs');
-const focus = require('./focus2.cjs');
 const keyCodes$1 = require('./key-codes2.cjs');
 const when = require('./when.cjs');
 
@@ -914,7 +913,7 @@ const dataGridStyles = ":host{display:block}:host([generate-header=sticky]){max-
 
 const dataGridRowStyles = ".base{display:grid;width:100%;box-sizing:border-box;color:var(--vvd-color-canvas-text)}.base.connotation-cta{--_connotation-color-primary: var(--vvd-data-grid-row-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-data-grid-row-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-data-grid-row-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-faint: var(--vvd-data-grid-row-cta-faint, var(--vvd-color-cta-50));--_connotation-color-pale: var(--vvd-data-grid-row-cta-pale, var(--vvd-color-cta-300));--_connotation-color-dim: var(--vvd-data-grid-row-cta-dim, var(--vvd-color-cta-200))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-data-grid-row-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-data-grid-row-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-data-grid-row-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-faint: var(--vvd-data-grid-row-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-pale: var(--vvd-data-grid-row-accent-pale, var(--vvd-color-neutral-300));--_connotation-color-dim: var(--vvd-data-grid-row-accent-dim, var(--vvd-color-neutral-200))}.base{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.base:where(.selected,[aria-current]):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-dim);--_appearance-color-outline: transparent}.base:where(.selected,[aria-current]):where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-pale);--_appearance-color-outline: transparent}:host([row-type=sticky-header]) .base{position:sticky;z-index:9;top:0;background:var(--data-grid-row-background, var(--vvd-color-canvas))}:host([row-type=hidden-header]) .base{display:none}:host(:is([aria-selected]):not([row-type*=header])) .base{background-color:var(--_appearance-color-fill)}\n";
 
-const dataGridCellStyles = ":host{min-inline-size:80px}:host(:focus-visible){outline:none}.base{position:relative;display:flex;box-sizing:border-box;align-items:center;padding:8px 12px;border-bottom:1px solid var(--vvd-color-neutral-300);block-size:calc(1px*(48 + 4*clamp(-1,var(--vvd-size-density, 0),2)));color:var(--_appearance-color-text);font:var(--vvd-typography-base)}.base.connotation-cta{--_connotation-color-primary: var(--vvd-data-grid-cell-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-data-grid-cell-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-data-grid-cell-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-faint: var(--vvd-data-grid-cell-cta-faint, var(--vvd-color-cta-50));--_connotation-color-pale: var(--vvd-data-grid-cell-cta-pale, var(--vvd-color-cta-300));--_connotation-color-dim: var(--vvd-data-grid-cell-cta-dim, var(--vvd-color-cta-200))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-data-grid-cell-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-data-grid-cell-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-data-grid-cell-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-faint: var(--vvd-data-grid-cell-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-pale: var(--vvd-data-grid-cell-accent-pale, var(--vvd-color-neutral-300));--_connotation-color-dim: var(--vvd-data-grid-cell-accent-dim, var(--vvd-color-neutral-200))}.base{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.base:where(.selected,[aria-current]):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-dim);--_appearance-color-outline: transparent}.base:where(.selected,[aria-current]):where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-pale);--_appearance-color-outline: transparent}:host([cell-type=columnheader]) .base{border-color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold)}:host(:is([aria-selected]):not([cell-type=columnheader])) .base{background-color:var(--_appearance-color-fill)}.focus-indicator{--focus-stroke-gap-color: transparent;pointer-events:none}:host(:not(:focus)) .base>.focus-indicator{display:none}slot{display:block;overflow:hidden;inline-size:100%;text-overflow:ellipsis;white-space:nowrap}.header-icon{margin-inline-start:auto}\n";
+const dataGridCellStyles = ":host{min-inline-size:80px}:host(:focus-visible){outline:none}.base{display:flex;box-sizing:border-box;align-items:center;padding:8px 12px;border-bottom:1px solid var(--vvd-color-neutral-300);block-size:calc(1px*(48 + 4*clamp(-1,var(--vvd-size-density, 0),2)));color:var(--_appearance-color-text);font:var(--vvd-typography-base)}.base.connotation-cta{--_connotation-color-primary: var(--vvd-data-grid-cell-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-data-grid-cell-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-data-grid-cell-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-faint: var(--vvd-data-grid-cell-cta-faint, var(--vvd-color-cta-50));--_connotation-color-pale: var(--vvd-data-grid-cell-cta-pale, var(--vvd-color-cta-300));--_connotation-color-dim: var(--vvd-data-grid-cell-cta-dim, var(--vvd-color-cta-200))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-data-grid-cell-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-data-grid-cell-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-data-grid-cell-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-faint: var(--vvd-data-grid-cell-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-pale: var(--vvd-data-grid-cell-accent-pale, var(--vvd-color-neutral-300));--_connotation-color-dim: var(--vvd-data-grid-cell-accent-dim, var(--vvd-color-neutral-200))}.base{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.base:where(.selected,[aria-current]):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-dim);--_appearance-color-outline: transparent}.base:where(.selected,[aria-current]):where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-pale);--_appearance-color-outline: transparent}:host(:focus-visible) .base{--focus-stroke-gap-color: transparent;box-shadow:inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:2px solid var(--focus-stroke-color, var(--vvd-color-canvas-text));outline-offset:calc(-2px - var(--focus-inset, 0px))}:host([cell-type=columnheader]) .base{border-color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold)}:host(:is([aria-selected]):not([cell-type=columnheader])) .base{background-color:var(--_appearance-color-fill)}slot{display:block;overflow:hidden;inline-size:100%;text-overflow:ellipsis;white-space:nowrap}.header-icon{margin-inline-start:auto}\n";
 
 const DataGridCellSortStates = {
   none: "none",
@@ -1329,7 +1328,6 @@ function handleKeyDown(x, e) {
   return true;
 }
 function DataGridCellTemplate(context) {
-  const focusTemplate = focus.focusTemplateFactory(context);
   return index.html`
         <template
             tabindex="-1"
@@ -1339,7 +1337,6 @@ function DataGridCellTemplate(context) {
         >
 					<div class="base">
 							<slot></slot>
-							${() => focusTemplate}
 							${(_) => renderSortIcons(context)}
 					</div>
 

package/shared/definition17.js

@@ -5,7 +5,6 @@ import { R as RepeatDirective } from './repeat.js';
 import { s as slotted, e as elements } from './slotted.js';
 import { c as children } from './children.js';
 import { I as Icon } from './icon.js';
-import { f as focusTemplateFactory } from './focus2.js';
 import { b as keyEnter$1, c as keySpace } from './key-codes2.js';
 import { w as when } from './when.js';
 
@@ -912,7 +911,7 @@ const dataGridStyles = ":host{display:block}:host([generate-header=sticky]){max-
 
 const dataGridRowStyles = ".base{display:grid;width:100%;box-sizing:border-box;color:var(--vvd-color-canvas-text)}.base.connotation-cta{--_connotation-color-primary: var(--vvd-data-grid-row-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-data-grid-row-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-data-grid-row-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-faint: var(--vvd-data-grid-row-cta-faint, var(--vvd-color-cta-50));--_connotation-color-pale: var(--vvd-data-grid-row-cta-pale, var(--vvd-color-cta-300));--_connotation-color-dim: var(--vvd-data-grid-row-cta-dim, var(--vvd-color-cta-200))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-data-grid-row-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-data-grid-row-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-data-grid-row-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-faint: var(--vvd-data-grid-row-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-pale: var(--vvd-data-grid-row-accent-pale, var(--vvd-color-neutral-300));--_connotation-color-dim: var(--vvd-data-grid-row-accent-dim, var(--vvd-color-neutral-200))}.base{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.base:where(.selected,[aria-current]):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-dim);--_appearance-color-outline: transparent}.base:where(.selected,[aria-current]):where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-pale);--_appearance-color-outline: transparent}:host([row-type=sticky-header]) .base{position:sticky;z-index:9;top:0;background:var(--data-grid-row-background, var(--vvd-color-canvas))}:host([row-type=hidden-header]) .base{display:none}:host(:is([aria-selected]):not([row-type*=header])) .base{background-color:var(--_appearance-color-fill)}\n";
 
-const dataGridCellStyles = ":host{min-inline-size:80px}:host(:focus-visible){outline:none}.base{position:relative;display:flex;box-sizing:border-box;align-items:center;padding:8px 12px;border-bottom:1px solid var(--vvd-color-neutral-300);block-size:calc(1px*(48 + 4*clamp(-1,var(--vvd-size-density, 0),2)));color:var(--_appearance-color-text);font:var(--vvd-typography-base)}.base.connotation-cta{--_connotation-color-primary: var(--vvd-data-grid-cell-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-data-grid-cell-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-data-grid-cell-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-faint: var(--vvd-data-grid-cell-cta-faint, var(--vvd-color-cta-50));--_connotation-color-pale: var(--vvd-data-grid-cell-cta-pale, var(--vvd-color-cta-300));--_connotation-color-dim: var(--vvd-data-grid-cell-cta-dim, var(--vvd-color-cta-200))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-data-grid-cell-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-data-grid-cell-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-data-grid-cell-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-faint: var(--vvd-data-grid-cell-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-pale: var(--vvd-data-grid-cell-accent-pale, var(--vvd-color-neutral-300));--_connotation-color-dim: var(--vvd-data-grid-cell-accent-dim, var(--vvd-color-neutral-200))}.base{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.base:where(.selected,[aria-current]):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-dim);--_appearance-color-outline: transparent}.base:where(.selected,[aria-current]):where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-pale);--_appearance-color-outline: transparent}:host([cell-type=columnheader]) .base{border-color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold)}:host(:is([aria-selected]):not([cell-type=columnheader])) .base{background-color:var(--_appearance-color-fill)}.focus-indicator{--focus-stroke-gap-color: transparent;pointer-events:none}:host(:not(:focus)) .base>.focus-indicator{display:none}slot{display:block;overflow:hidden;inline-size:100%;text-overflow:ellipsis;white-space:nowrap}.header-icon{margin-inline-start:auto}\n";
+const dataGridCellStyles = ":host{min-inline-size:80px}:host(:focus-visible){outline:none}.base{display:flex;box-sizing:border-box;align-items:center;padding:8px 12px;border-bottom:1px solid var(--vvd-color-neutral-300);block-size:calc(1px*(48 + 4*clamp(-1,var(--vvd-size-density, 0),2)));color:var(--_appearance-color-text);font:var(--vvd-typography-base)}.base.connotation-cta{--_connotation-color-primary: var(--vvd-data-grid-cell-cta-primary, var(--vvd-color-cta-500));--_connotation-color-primary-text: var(--vvd-data-grid-cell-cta-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-data-grid-cell-cta-primary-increment, var(--vvd-color-cta-600));--_connotation-color-faint: var(--vvd-data-grid-cell-cta-faint, var(--vvd-color-cta-50));--_connotation-color-pale: var(--vvd-data-grid-cell-cta-pale, var(--vvd-color-cta-300));--_connotation-color-dim: var(--vvd-data-grid-cell-cta-dim, var(--vvd-color-cta-200))}.base:not(.connotation-cta){--_connotation-color-primary: var(--vvd-data-grid-cell-accent-primary, var(--vvd-color-canvas-text));--_connotation-color-primary-text: var(--vvd-data-grid-cell-accent-primary-text, var(--vvd-color-canvas));--_connotation-color-primary-increment: var(--vvd-data-grid-cell-accent-primary-increment, var(--vvd-color-neutral-800));--_connotation-color-faint: var(--vvd-data-grid-cell-accent-faint, var(--vvd-color-neutral-50));--_connotation-color-pale: var(--vvd-data-grid-cell-accent-pale, var(--vvd-color-neutral-300));--_connotation-color-dim: var(--vvd-data-grid-cell-accent-dim, var(--vvd-color-neutral-200))}.base{--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: transparent;--_appearance-color-outline: transparent}.base:where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-faint);--_appearance-color-outline: transparent}.base:where(.selected,[aria-current]):where(:not(:disabled,.disabled)){--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-dim);--_appearance-color-outline: transparent}.base:where(.selected,[aria-current]):where(:hover,.hover):where(:not(:disabled,.disabled,.readonly)){--_appearance-color-text: var(--_connotation-color-primary);--_appearance-color-fill: var(--_connotation-color-pale);--_appearance-color-outline: transparent}:host(:focus-visible) .base{--focus-stroke-gap-color: transparent;box-shadow:inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:2px solid var(--focus-stroke-color, var(--vvd-color-canvas-text));outline-offset:calc(-2px - var(--focus-inset, 0px))}:host([cell-type=columnheader]) .base{border-color:var(--vvd-color-canvas-text);font:var(--vvd-typography-base-bold)}:host(:is([aria-selected]):not([cell-type=columnheader])) .base{background-color:var(--_appearance-color-fill)}slot{display:block;overflow:hidden;inline-size:100%;text-overflow:ellipsis;white-space:nowrap}.header-icon{margin-inline-start:auto}\n";
 
 const DataGridCellSortStates = {
   none: "none",
@@ -1327,7 +1326,6 @@ function handleKeyDown(x, e) {
   return true;
 }
 function DataGridCellTemplate(context) {
-  const focusTemplate = focusTemplateFactory(context);
   return html`
         <template
             tabindex="-1"
@@ -1337,7 +1335,6 @@ function DataGridCellTemplate(context) {
         >
 					<div class="base">
 							<slot></slot>
-							${() => focusTemplate}
 							${(_) => renderSortIcons(context)}
 					</div>
 

package/shared/definition18.cjs

@@ -1,11 +1,10 @@
 'use strict';
 
 const index = require('./index.cjs');
-const definition$1 = require('./definition61.cjs');
-const definition$3 = require('./definition59.cjs');
+const definition$1 = require('./definition60.cjs');
 const definition = require('./definition11.cjs');
 const definition$2 = require('./definition53.cjs');
-const definition$4 = require('./definition21.cjs');
+const definition$3 = require('./definition21.cjs');
 const presentationDate = require('./presentationDate.cjs');
 require('./affix.cjs');
 const index$1 = require('./index2.cjs');
@@ -165,8 +164,7 @@ const datePickerRegistries = [
   ...definition.buttonRegistries,
   ...definition$1.popupRegistries,
   ...definition$2.textFieldRegistries,
-  ...definition$3.focusRegistries,
-  ...definition$4.dividerRegistries
+  ...definition$3.dividerRegistries
 ];
 const registerDatePicker = index.registerFactory(datePickerRegistries);
 

package/shared/definition18.js

@@ -1,6 +1,5 @@
 import { v as volatile, r as registerFactory } from './index.js';
-import { p as popupRegistries } from './definition61.js';
-import { f as focusRegistries } from './definition59.js';
+import { p as popupRegistries } from './definition60.js';
 import { a as buttonRegistries } from './definition11.js';
 import { a as textFieldRegistries } from './definition53.js';
 import { a as dividerRegistries } from './definition21.js';
@@ -163,7 +162,6 @@ const datePickerRegistries = [
   ...buttonRegistries,
   ...popupRegistries,
   ...textFieldRegistries,
-  ...focusRegistries,
   ...dividerRegistries
 ];
 const registerDatePicker = registerFactory(datePickerRegistries);

package/shared/definition19.cjs

@@ -2,10 +2,9 @@
 
 const index = require('./index.cjs');
 const definition = require('./definition11.cjs');
-const definition$1 = require('./definition61.cjs');
+const definition$1 = require('./definition60.cjs');
 const definition$2 = require('./definition53.cjs');
-const definition$3 = require('./definition59.cjs');
-const definition$4 = require('./definition21.cjs');
+const definition$3 = require('./definition21.cjs');
 const presentationDate = require('./presentationDate.cjs');
 require('./affix.cjs');
 const index$1 = require('./index2.cjs');
@@ -404,8 +403,7 @@ const dateRangePickerRegistries = [
   ...definition.buttonRegistries,
   ...definition$1.popupRegistries,
   ...definition$2.textFieldRegistries,
-  ...definition$3.focusRegistries,
-  ...definition$4.dividerRegistries
+  ...definition$3.dividerRegistries
 ];
 const registerDateRangePicker = index.registerFactory(
   dateRangePickerRegistries

package/shared/definition19.js

@@ -1,8 +1,7 @@
 import { a as attr, o as observable, v as volatile, r as registerFactory } from './index.js';
 import { a as buttonRegistries } from './definition11.js';
-import { p as popupRegistries } from './definition61.js';
+import { p as popupRegistries } from './definition60.js';
 import { a as textFieldRegistries } from './definition53.js';
-import { f as focusRegistries } from './definition59.js';
 import { a as dividerRegistries } from './definition21.js';
 import { f as formatPresentationDate, p as parsePresentationDate, D as DatePickerBase, i as isValidDateStr, c as compareDateStr, a as DatePickerBaseTemplate, s as styles } from './presentationDate.js';
 import './affix.js';
@@ -402,7 +401,6 @@ const dateRangePickerRegistries = [
   ...buttonRegistries,
   ...popupRegistries,
   ...textFieldRegistries,
-  ...focusRegistries,
   ...dividerRegistries
 ];
 const registerDateRangePicker = registerFactory(

package/shared/definition20.cjs

@@ -3,20 +3,19 @@
 const index = require('./index.cjs');
 const definition$2 = require('./definition26.cjs');
 const definition$1 = require('./definition11.cjs');
-const definition = require('./definition60.cjs');
+const definition = require('./definition59.cjs');
 require('./affix.cjs');
 require('./index2.cjs');
 const localized = require('./localized.cjs');
 const applyMixins = require('./apply-mixins.cjs');
 const icon$1 = require('./icon.cjs');
-const focus = require('./focus2.cjs');
 const when = require('./when.cjs');
 const slotted = require('./slotted.cjs');
 const classNames = require('./class-names.cjs');
 
 const dialogPolyfillStyles = "dialog{position:absolute;left:0;right:0;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content;height:-moz-fit-content;height:-webkit-fit-content;height:fit-content;margin:auto;border:solid;padding:1em;background:white;color:#000;display:block}dialog:not([open]){display:none}dialog+.backdrop{position:fixed;inset:0;background:rgba(0,0,0,.1)}._dialog_overlay{position:fixed;inset:0}dialog.fixed{position:fixed;top:50%;transform:translateY(-50%)}\n";
 
-const styles = ".base{box-sizing:border-box;padding:0;border:none;background-color:transparent;border-radius:8px;color:var(--vvd-color-canvas-text);max-block-size:var(--dialog-max-block-size, calc(100vh - 64px));max-inline-size:var(--dialog-max-inline-size, var(--_dialog-default-max-inline-size));min-inline-size:var(--dialog-min-inline-size, 280px)}@media not all and (min-width: 600px){.base{--_dialog-default-max-inline-size: 90vw}}@media (min-width: 600px){.base{--_dialog-default-max-inline-size: 560px}}.base:not(.modal){z-index:var(--dialog-z-index, 1)}.base.modal{position:fixed;box-shadow:0 4px 20px #00000059}.base.modal::backdrop{background-color:var(--vvd-color-canvas-text, currentColor);opacity:.5}.base:focus-visible{outline:none}.base .focus-indicator{pointer-events:none}.base:not(:focus-visible) .focus-indicator{display:none}.main-wrapper{display:flex;box-sizing:border-box;flex-direction:column;gap:24px;padding-block:24px}.main-wrapper>*{box-sizing:border-box}.header{display:grid;align-items:flex-start;justify-content:space-between;inline-size:100%;padding-inline:24px}.base:not(.icon-placement-side) .header{grid-template-columns:1fr auto;grid-template-rows:auto auto auto}.base:not(.icon-placement-side) .header .icon{font-size:calc(1px*(32 + 4*clamp(-1,var(--vvd-size-density, 0),2)));grid-column:1/2;grid-row:1/2;line-height:1;margin-block-end:calc(1px*(24 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base.icon-placement-side .header{grid-template-columns:auto 1fr auto;grid-template-rows:auto auto}.base.icon-placement-side .header .icon{font-size:calc(1px*(28 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base.icon-placement-side .header ::slotted(*),.base.icon-placement-side .header .icon{grid-column:1/2;grid-row:1/-1;margin-inline-end:calc(1px*(32 + 4*clamp(-1,var(--vvd-size-density, 0),2))/2)}.header.border{position:relative}.header.border:after{position:absolute;bottom:-24px;left:0;background-color:var(--vvd-color-neutral-200);block-size:1px;content:\"\";inline-size:100%}.base.hide-body .header.border:after{content:none}.body:not(.full-width){padding-inline:24px}.hide-body .body{display:none}.footer{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-inline:24px}.hide-footer .footer{display:none}.footer .actions{display:flex;align-self:flex-end;gap:8px}.dismiss-button{flex-shrink:0;grid-column:-2/-1;grid-row:1/-1;margin-block-start:-8px;margin-inline-end:-8px;margin-inline-start:4px}.headline{font:var(--vvd-typography-heading-4)}.subtitle{font:var(--vvd-typography-base)}slot[name=main]{display:block;overflow:hidden auto;max-width:inherit;max-height:inherit;border-radius:inherit}\n";
+const styles = ".base{box-sizing:border-box;padding:0;border:none;background-color:transparent;border-radius:8px;color:var(--vvd-color-canvas-text);max-block-size:var(--dialog-max-block-size, calc(100vh - 64px));max-inline-size:var(--dialog-max-inline-size, var(--_dialog-default-max-inline-size));min-inline-size:var(--dialog-min-inline-size, 280px)}@media not all and (min-width: 600px){.base{--_dialog-default-max-inline-size: 90vw}}@media (min-width: 600px){.base{--_dialog-default-max-inline-size: 560px}}.base:not(.modal){z-index:var(--dialog-z-index, 1)}.base.modal{position:fixed;box-shadow:0 4px 20px #00000059}.base.modal::backdrop{background-color:var(--vvd-color-canvas-text, currentColor);opacity:.5}.base:focus-visible{box-shadow:inset 0 0 0 3px var(--focus-stroke-gap-color, currentColor);outline:2px solid var(--focus-stroke-color, var(--vvd-color-canvas-text));outline-offset:calc(-2px - var(--focus-inset, 0px))}.main-wrapper{display:flex;box-sizing:border-box;flex-direction:column;gap:24px;padding-block:24px}.main-wrapper>*{box-sizing:border-box}.header{display:grid;align-items:flex-start;justify-content:space-between;inline-size:100%;padding-inline:24px}.base:not(.icon-placement-side) .header{grid-template-columns:1fr auto;grid-template-rows:auto auto auto}.base:not(.icon-placement-side) .header .icon{font-size:calc(1px*(32 + 4*clamp(-1,var(--vvd-size-density, 0),2)));grid-column:1/2;grid-row:1/2;line-height:1;margin-block-end:calc(1px*(24 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base.icon-placement-side .header{grid-template-columns:auto 1fr auto;grid-template-rows:auto auto}.base.icon-placement-side .header .icon{font-size:calc(1px*(28 + 4*clamp(-1,var(--vvd-size-density, 0),2)))}.base.icon-placement-side .header ::slotted(*),.base.icon-placement-side .header .icon{grid-column:1/2;grid-row:1/-1;margin-inline-end:calc(1px*(32 + 4*clamp(-1,var(--vvd-size-density, 0),2))/2)}.header.border{position:relative}.header.border:after{position:absolute;bottom:-24px;left:0;background-color:var(--vvd-color-neutral-200);block-size:1px;content:\"\";inline-size:100%}.base.hide-body .header.border:after{content:none}.body:not(.full-width){padding-inline:24px}.hide-body .body{display:none}.footer{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-inline:24px}.hide-footer .footer{display:none}.footer .actions{display:flex;align-self:flex-end;gap:8px}.dismiss-button{flex-shrink:0;grid-column:-2/-1;grid-row:1/-1;margin-block-start:-8px;margin-inline-end:-8px;margin-inline-start:4px}.headline{font:var(--vvd-typography-heading-4)}.subtitle{font:var(--vvd-typography-base)}slot[name=main]{display:block;overflow:hidden auto;max-width:inherit;max-height:inherit;border-radius:inherit}\n";
 
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -228,7 +227,6 @@ const DialogTemplate = (context) => {
   const elevationTag = context.tagFor(definition.Elevation);
   const iconTag = context.tagFor(icon$1.Icon);
   const buttonTag = context.tagFor(definition$1.Button);
-  const focusTemplate = focus.focusTemplateFactory(context);
   return index.html`
 	<${elevationTag} dp="8">
 		<dialog class="${getClasses}"
@@ -237,7 +235,6 @@ const DialogTemplate = (context) => {
 				returnValue="${(x) => x.returnValue}"
 				aria-label="${(x) => x.ariaLabel}"
 		>
-			${() => focusTemplate}
 			<slot name="main">
 				<div class="main-wrapper">
 					<div class="header ${(x) => x.subtitle ? "border" : ""}">