@vonage/vivid 3.31.0 → 3.32.0

package/date-picker/index.js

@@ -0,0 +1,35 @@
+import { r as registerDatePicker } from '../shared/definition23.js';
+import '../shared/index.js';
+import '../shared/definition20.js';
+import '../shared/definition7.js';
+import '../shared/definition3.js';
+import '../shared/icon.js';
+import '../shared/_has.js';
+import '../shared/class-names.js';
+import '../shared/when.js';
+import '../shared/definition4.js';
+import '../shared/focus.js';
+import '../shared/definition9.js';
+import '../shared/base-progress.js';
+import '../shared/affix.js';
+import '../shared/button.js';
+import '../shared/apply-mixins.js';
+import '../shared/form-associated.js';
+import '../shared/key-codes.js';
+import '../shared/aria-global.js';
+import '../shared/start-end.js';
+import '../shared/ref.js';
+import '../shared/focus2.js';
+import '../shared/definition8.js';
+import '../shared/definition24.js';
+import '../shared/index2.js';
+import '../locales/en-US.js';
+import '../shared/text-field2.js';
+import '../shared/text-field.js';
+import '../shared/slotted.js';
+import '../shared/node-observation.js';
+import '../shared/definition25.js';
+import '../shared/aria.js';
+import '../shared/repeat.js';
+
+registerDatePicker();

package/dialog/index.js

@@ -1,4 +1,4 @@
-import { r as registerDialog } from '../shared/definition23.js';
+import { r as registerDialog } from '../shared/definition26.js';
 import '../shared/index.js';
 import '../shared/definition3.js';
 import '../shared/icon.js';

package/divider/index.js

@@ -1,4 +1,4 @@
-import { r as registerDivider } from '../shared/definition24.js';
+import { r as registerDivider } from '../shared/definition25.js';
 import '../shared/index.js';
 import '../shared/aria.js';
 import '../shared/class-names.js';

package/empty-state/index.js

@@ -1,4 +1,4 @@
-import { r as registerEmptyState } from '../shared/definition25.js';
+import { r as registerEmptyState } from '../shared/definition27.js';
 import '../shared/index.js';
 import '../shared/definition3.js';
 import '../shared/icon.js';

package/fab/index.js

@@ -1,4 +1,4 @@
-import { r as registerFab } from '../shared/definition26.js';
+import { r as registerFab } from '../shared/definition28.js';
 import '../shared/index.js';
 import '../shared/definition3.js';
 import '../shared/icon.js';

package/file-picker/index.js

@@ -1,4 +1,4 @@
-import { r as registerFilePicker } from '../shared/definition27.js';
+import { r as registerFilePicker } from '../shared/definition29.js';
 import '../shared/index.js';
 import '../shared/definition3.js';
 import '../shared/icon.js';
@@ -19,6 +19,7 @@ import '../shared/aria-global.js';
 import '../shared/start-end.js';
 import '../shared/ref.js';
 import '../shared/focus2.js';
-import '../shared/form-elements.js';
+import '../shared/index2.js';
+import '../locales/en-US.js';
 
 registerFilePicker();

package/header/index.js

@@ -1,4 +1,4 @@
-import { r as registerHeader } from '../shared/definition28.js';
+import { r as registerHeader } from '../shared/definition30.js';
 import '../shared/index.js';
 import '../shared/definition8.js';
 import '../shared/class-names.js';

package/index.d.ts

@@ -1,3 +1,4 @@
 export * from './lib/components';
 export * from './lib/enums';
 export * from './shared/design-system';
+export { setLocale } from './shared/localization';

package/index.js

@@ -1,62 +1,59 @@
-export { a as accordionDefinition, b as accordionRegistries, r as registerAccordion } from './shared/definition.js';
 export { b as accordionItemDefinition, a as accordionItemRegistries, r as registerAccordionItem } from './shared/definition2.js';
+export { a as accordionDefinition, b as accordionRegistries, r as registerAccordion } from './shared/definition.js';
 export { a as actionGroupDefinition, b as actionGroupRegistries, r as registerActionGroup } from './shared/definition5.js';
+export { a as alertDefinition, b as alertRegistries, r as registerAlert } from './shared/definition6.js';
 export { a as avatarDefinition, b as avatarRegistries, r as registerAvatar } from './shared/definition10.js';
 export { b as badgeDefinition, r as registerBadge } from './shared/definition11.js';
 export { b as bannerDefinition, a as bannerRegistries, r as registerBanner } from './shared/definition12.js';
-export { a as alertDefinition, b as alertRegistries, r as registerAlert } from './shared/definition6.js';
-export { b as breadcrumbDefinition, a as breadcrumbRegistries, r as registerBreadcrumb } from './shared/definition13.js';
 export { b as breadcrumbItemDefinition, a as breadcrumbItemRegistries, r as registerBreadcrumbItem } from './shared/definition14.js';
+export { b as breadcrumbDefinition, a as breadcrumbRegistries, r as registerBreadcrumb } from './shared/definition13.js';
 export { A as Appearance, e as AriaLive, C as Connotation, d as ConnotationDecorative, L as LayoutSize, P as Position, R as Role, S as Shape, a as Size, c as buttonDefinition, b as buttonRegistries, r as registerButton } from './shared/definition7.js';
-export { c as calendarDefinition, a as calendarRegistries, r as registerCalendar } from './shared/definition15.js';
 export { c as calendarEventDefinition, a as calendarEventRegistries, r as registerCalendarEvent } from './shared/definition16.js';
+export { c as calendarDefinition, a as calendarRegistries, r as registerCalendar } from './shared/definition15.js';
 export { c as cardDefinition, a as cardRegistries, r as registerCard } from './shared/definition17.js';
 export { c as checkboxDefinition, a as checkboxRegistries, r as registerCheckbox } from './shared/definition18.js';
 export { c as combobox, a as comboboxRegistries, r as registerCombobox } from './shared/definition19.js';
-export { e as emptyStateDefinition, a as emptyStateRegistries, r as registerEmptyState } from './shared/definition25.js';
-export { d as dialogDefinition, a as dialogRegistries, r as registerDialog } from './shared/definition23.js';
-export { a as dividerDefinition, d as dividerRegistries, r as registerDivider } from './shared/definition24.js';
 export { d as dataGrid, b as dataGridCell, c as dataGridElements, a as dataGridRow, r as registerDataGrid } from './shared/definition22.js';
-export { f as fabDefinition, a as fabRegistries, r as registerFab } from './shared/definition26.js';
-export { h as headerDefinition, a as headerRegistries, r as registerHeader } from './shared/definition28.js';
+export { d as datePickerDefinition, a as datePickerRegistries, r as registerDatePicker } from './shared/definition23.js';
+export { d as dialogDefinition, a as dialogRegistries, r as registerDialog } from './shared/definition26.js';
+export { a as dividerDefinition, d as dividerRegistries, r as registerDivider } from './shared/definition25.js';
+export { e as emptyStateDefinition, a as emptyStateRegistries, r as registerEmptyState } from './shared/definition27.js';
+export { f as fabDefinition, a as fabRegistries, r as registerFab } from './shared/definition28.js';
+export { f as filePickerDefinition, a as filePickerRegistries, r as registerFilePicker } from './shared/definition29.js';
+export { h as headerDefinition, a as headerRegistries, r as registerHeader } from './shared/definition30.js';
 export { a as iconDefinition, i as iconRegistries, r as registerIcon } from './shared/definition3.js';
-export { l as layoutDefinition, a as layoutRegistries, r as registerLayout } from './shared/definition29.js';
+export { l as layoutDefinition, a as layoutRegistries, r as registerLayout } from './shared/definition31.js';
+export { c as menuItemDefinition, m as menuItemRegistries, b as registerMenuItem } from './shared/definition33.js';
+export { m as menuDefinition, a as menuRegistries, r as registerMenu } from './shared/definition32.js';
+export { n as navDisclosureDefinition, a as navDisclosureRegistries, r as registerNavDisclosure } from './shared/definition35.js';
+export { n as navItemDefinition, a as navItemRegistries, r as registerNavItem } from './shared/definition36.js';
+export { n as navDefinition, a as navRegistries, r as registerNav } from './shared/definition34.js';
+export { n as noteDefinition, a as noteRegistries, r as registerNote } from './shared/definition37.js';
+export { n as numberFieldDefinition, a as numberFieldRegistries, r as registerNumberField } from './shared/definition38.js';
 export { a as listboxOptionDefinition, l as listboxOptionRegistries, r as registerOption } from './shared/definition21.js';
-export { m as menuDefinition, a as menuRegistries, r as registerMenu } from './shared/definition30.js';
-export { c as menuItemDefinition, m as menuItemRegistries, b as registerMenuItem } from './shared/definition31.js';
-export { n as navDefinition, a as navRegistries, r as registerNav } from './shared/definition32.js';
-export { n as navDisclosureDefinition, a as navDisclosureRegistries, r as registerNavDisclosure } from './shared/definition33.js';
-export { n as navItemDefinition, a as navItemRegistries, r as registerNavItem } from './shared/definition34.js';
-export { n as noteDefinition, a as noteRegistries, r as registerNote } from './shared/definition35.js';
-export { n as numberFieldDefinition, a as numberFieldRegistries, r as registerNumberField } from './shared/definition36.js';
-export { p as paginationDefinition, a as paginationRegistries, r as registerPagination } from './shared/definition37.js';
-export { p as progressDefinition, a as progressRegistries, r as registerProgress } from './shared/definition38.js';
+export { p as paginationDefinition, a as paginationRegistries, r as registerPagination } from './shared/definition39.js';
 export { a as progressRingDefinition, p as progressRingRegistries, r as registerProgressRing } from './shared/definition9.js';
-export { a as radioDefinition, b as radioRegistries, r as registerRadio } from './shared/definition39.js';
-export { a as radioGroupDefinition, b as radioGroupRegistries, r as registerRadioGroup } from './shared/definition40.js';
-export { r as registerSelect, s as selectDefinition, a as selectRegistries } from './shared/definition41.js';
-export { r as registerSideDrawer, s as sideDrawerDefinition, a as sideDrawerRegistries } from './shared/definition42.js';
-export { r as registerSlider, s as sliderDefinition, a as sliderRegistries } from './shared/definition43.js';
-export { r as registerSplitButton, s as splitButtonDefinition, a as splitButtonRegistries } from './shared/definition44.js';
-export { r as registerSwitch, s as switchDefinition, a as switchRegistries } from './shared/definition45.js';
-export { r as registerTextField, t as textFieldDefinition, a as textFieldRegistries } from './shared/definition52.js';
-export { r as registerTextArea, t as textAreaDefinition, a as textAreaRegistries } from './shared/definition51.js';
-export { r as registerToggletip, t as toggletipDefinition, a as toggletipRegistries } from './shared/definition53.js';
-export { r as registerTooltip, t as tooltipDefinition, a as tooltipRegistries } from './shared/definition54.js';
-export { r as registerTabs, t as tabsDefinition, a as tabsRegistries } from './shared/definition48.js';
-export { r as registerTab, a as tabDefinition, t as tabRegistries } from './shared/definition46.js';
-export { r as registerTabPanel, a as tabPanelDefinition, t as tabPanelRegistries } from './shared/definition47.js';
-export { r as registerTreeView, t as treeViewDefinition, a as treeViewRegistries } from './shared/definition56.js';
-export { r as registerTreeItem, t as treeItemDefinition, a as treeItemRegistries } from './shared/definition55.js';
-export { r as registerTag, t as tagDefinition } from './shared/definition49.js';
-export { r as registerTagGroup, t as tagGroupDefinition, a as tagGroupRegistries } from './shared/definition50.js';
-export { f as filePickerDefinition, a as filePickerRegistries, r as registerFilePicker } from './shared/definition27.js';
+export { p as progressDefinition, a as progressRegistries, r as registerProgress } from './shared/definition40.js';
+export { a as radioGroupDefinition, b as radioGroupRegistries, r as registerRadioGroup } from './shared/definition42.js';
+export { a as radioDefinition, b as radioRegistries, r as registerRadio } from './shared/definition41.js';
+export { r as registerSelect, s as selectDefinition, a as selectRegistries } from './shared/definition43.js';
+export { r as registerSideDrawer, s as sideDrawerDefinition, a as sideDrawerRegistries } from './shared/definition44.js';
+export { r as registerSlider, s as sliderDefinition, a as sliderRegistries } from './shared/definition45.js';
+export { r as registerSplitButton, s as splitButtonDefinition, a as splitButtonRegistries } from './shared/definition46.js';
+export { r as registerSwitch, s as switchDefinition, a as switchRegistries } from './shared/definition47.js';
+export { r as registerTabPanel, a as tabPanelDefinition, t as tabPanelRegistries } from './shared/definition49.js';
+export { r as registerTab, a as tabDefinition, t as tabRegistries } from './shared/definition48.js';
+export { r as registerTabs, t as tabsDefinition, a as tabsRegistries } from './shared/definition50.js';
+export { r as registerTagGroup, t as tagGroupDefinition, a as tagGroupRegistries } from './shared/definition52.js';
+export { r as registerTag, t as tagDefinition } from './shared/definition51.js';
+export { r as registerTextArea, t as textAreaDefinition, a as textAreaRegistries } from './shared/definition53.js';
+export { r as registerTextField, a as textFieldDefinition, t as textFieldRegistries } from './shared/definition24.js';
+export { r as registerToggletip, t as toggletipDefinition, a as toggletipRegistries } from './shared/definition54.js';
+export { r as registerTooltip, t as tooltipDefinition, a as tooltipRegistries } from './shared/definition55.js';
+export { r as registerTreeItem, t as treeItemDefinition, a as treeItemRegistries } from './shared/definition56.js';
+export { r as registerTreeView, t as treeViewDefinition, a as treeViewRegistries } from './shared/definition57.js';
 export { j as designSystem, r as registerFactory } from './shared/index.js';
-import './shared/key-codes.js';
-import './shared/numbers.js';
-import './shared/node-observation.js';
-import './shared/slotted.js';
-import './shared/class-names.js';
+export { s as setLocale } from './shared/index2.js';
 import './shared/definition4.js';
 import './shared/focus.js';
 import './shared/affix.js';
@@ -67,8 +64,12 @@ import './shared/ref.js';
 import './shared/apply-mixins.js';
 import './shared/focus2.js';
 import './shared/when.js';
+import './shared/key-codes.js';
+import './shared/numbers.js';
+import './shared/node-observation.js';
+import './shared/slotted.js';
+import './shared/class-names.js';
 import './shared/definition8.js';
-import './shared/form-elements.js';
 import './shared/button.js';
 import './shared/form-associated.js';
 import './shared/aria-global.js';
@@ -82,13 +83,14 @@ import './shared/text-field.js';
 import './shared/listbox.js';
 import './shared/strings.js';
 import './shared/select.options.js';
-import './shared/aria.js';
 import './shared/children.js';
-import './shared/dom.js';
+import './shared/aria.js';
 import './shared/direction.js';
+import './shared/dom.js';
 import './shared/text-anchor.js';
 import './shared/text-field2.js';
 import './shared/base-progress.js';
 import './shared/radio.js';
 import './shared/aria2.js';
 import './shared/tree-item.js';
+import './locales/en-US.js';

package/layout/index.js

@@ -1,4 +1,4 @@
-import { r as registerLayout } from '../shared/definition29.js';
+import { r as registerLayout } from '../shared/definition31.js';
 import '../shared/index.js';
 import '../shared/class-names.js';
 

package/lib/button/button.d.ts

@@ -6,6 +6,7 @@ export type ButtonAppearance = Extract<Appearance, Appearance.Filled | Appearanc
 export type ButtonShape = Extract<Shape, Shape.Rounded | Shape.Pill>;
 export type ButtonSize = Extract<Size, Size.SuperCondensed | Size.Condensed | Size.Normal | Size.Expanded>;
 export declare class Button extends FoundationButton {
+    title: string;
     connotation?: ButtonConnotation;
     shape?: ButtonShape;
     appearance?: ButtonAppearance;
@@ -13,6 +14,7 @@ export declare class Button extends FoundationButton {
     stacked: boolean;
     pending: boolean;
     label?: string;
+    constructor();
 }
 export interface Button extends AffixIconWithTrailing {
 }

package/lib/components.d.ts

@@ -1,53 +1,54 @@
-export * from './accordion/definition';
 export * from './accordion-item/definition';
+export * from './accordion/definition';
 export * from './action-group/definition';
+export * from './alert/definition';
 export * from './avatar/definition';
 export * from './badge/definition';
 export * from './banner/definition';
-export * from './alert/definition';
-export * from './breadcrumb/definition';
 export * from './breadcrumb-item/definition';
+export * from './breadcrumb/definition';
 export * from './button/definition';
-export * from './calendar/definition';
 export * from './calendar-event/definition';
+export * from './calendar/definition';
 export * from './card/definition';
 export * from './checkbox/definition';
 export * from './combobox/definition';
-export * from './empty-state/definition';
+export * from './data-grid/definition';
+export * from './date-picker/definition';
 export * from './dialog/definition';
 export * from './divider/definition';
-export * from './data-grid/definition';
+export * from './empty-state/definition';
 export * from './fab/definition';
+export * from './file-picker/definition';
 export * from './header/definition';
 export * from './icon/definition';
 export * from './layout/definition';
-export * from './option/definition';
-export * from './menu/definition';
 export * from './menu-item/definition';
-export * from './nav/definition';
+export * from './menu/definition';
 export * from './nav-disclosure/definition';
 export * from './nav-item/definition';
+export * from './nav/definition';
 export * from './note/definition';
 export * from './number-field/definition';
+export * from './option/definition';
 export * from './pagination/definition';
-export * from './progress/definition';
 export * from './progress-ring/definition';
-export * from './radio/definition';
+export * from './progress/definition';
 export * from './radio-group/definition';
+export * from './radio/definition';
 export * from './select/definition';
 export * from './side-drawer/definition';
 export * from './slider/definition';
 export * from './split-button/definition';
 export * from './switch/definition';
-export * from './text-field/definition';
+export * from './tab-panel/definition';
+export * from './tab/definition';
+export * from './tabs/definition';
+export * from './tag-group/definition';
+export * from './tag/definition';
 export * from './text-area/definition';
+export * from './text-field/definition';
 export * from './toggletip/definition';
 export * from './tooltip/definition';
-export * from './tabs/definition';
-export * from './tab/definition';
-export * from './tab-panel/definition';
-export * from './tree-view/definition';
 export * from './tree-item/definition';
-export * from './tag/definition';
-export * from './tag-group/definition';
-export * from './file-picker/definition';
+export * from './tree-view/definition';

package/lib/date-picker/calendar/calendarGrid.d.ts

@@ -0,0 +1,17 @@
+import type { DatePickerLocale } from '../locale';
+import { type DateStr } from './dateStr';
+import { type Month } from './month';
+export interface Weekday {
+    name: string;
+    shortName: string;
+}
+export interface CalendarGridDate {
+    date: DateStr;
+    label: string;
+    isOutsideMonth: boolean;
+}
+export type CalendarGrid = {
+    weekdays: Weekday[];
+    grid: CalendarGridDate[][];
+};
+export declare const buildCalendarGrid: (month: Month, locale: DatePickerLocale) => CalendarGrid;

package/lib/date-picker/calendar/dateStr.d.ts

@@ -0,0 +1,6 @@
+export type DateStr = string;
+export declare const formatDateStr: (date: Date) => DateStr;
+export declare const currentDateStr: (now?: Date) => DateStr;
+export declare const parseDateStr: (dateStr: DateStr) => Date;
+export declare const addDays: (dateStr: DateStr, days: number) => DateStr;
+export declare const isValidDateStr: (string: string) => boolean;

package/lib/date-picker/calendar/month.d.ts

@@ -0,0 +1,11 @@
+import { type DateStr } from './dateStr';
+export type MonthNumber = number;
+export type Month = {
+    month: MonthNumber;
+    year: number;
+};
+export declare const getCurrentMonth: (now?: Date) => Month;
+export declare const monthOfDate: (dateStr: DateStr) => Month;
+export declare const addMonths: ({ month, year }: Month, months: number) => Month;
+export declare const areMonthsEqual: (a: Month, b: Month) => boolean;
+export declare const monthToStr: ({ month, year }: Month) => string;

package/lib/date-picker/calendar/monthPickerGrid.d.ts

@@ -0,0 +1,10 @@
+import type { DatePickerLocale } from '../locale';
+import { type Month } from './month';
+export interface MonthPickerGridCell {
+    month: Month;
+    label: string;
+    monthName: string;
+}
+export type MonthPickerGrid = MonthPickerGridCell[][];
+export declare const MonthsPerRow = 4;
+export declare const buildMonthPickerGrid: (year: number, locale: DatePickerLocale) => MonthPickerGrid;

package/lib/date-picker/calendar/presentationDate.d.ts

@@ -0,0 +1,4 @@
+import type { DatePickerLocale } from '../locale';
+import { type DateStr } from './dateStr';
+export declare const formatPresentationDate: (dateStr: DateStr, locale: DatePickerLocale) => string;
+export declare const parsePresentationDate: (presentationDate: string, locale: DatePickerLocale) => DateStr;

package/lib/date-picker/date-picker.d.ts

@@ -0,0 +1,16 @@
+import { FoundationElement } from '@microsoft/fast-foundation';
+import { Localized } from '../../shared/patterns';
+import { type DateStr } from './calendar/dateStr';
+export declare class DatePicker extends FoundationElement {
+    #private;
+    label?: string;
+    helperText?: string;
+    errorText?: string;
+    value: DateStr | null;
+    disabled: boolean;
+    readOnly: boolean;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+}
+export interface DatePicker extends Localized {
+}

package/lib/date-picker/date-picker.template.d.ts

@@ -0,0 +1,4 @@
+import type { ViewTemplate } from '@microsoft/fast-element';
+import type { ElementDefinitionContext, FoundationElementDefinition } from '@microsoft/fast-foundation';
+import type { DatePicker } from './date-picker';
+export declare const DatePickerTemplate: (context: ElementDefinitionContext, definition: FoundationElementDefinition) => ViewTemplate<DatePicker>;

package/lib/date-picker/definition.d.ts

@@ -0,0 +1,3 @@
+import type { FoundationElementDefinition } from '@microsoft/fast-foundation';
+export declare const datePickerDefinition: (overrideDefinition?: import("@microsoft/fast-foundation").OverrideFoundationElementDefinition<FoundationElementDefinition> | undefined) => import("@microsoft/fast-foundation").FoundationElementRegistry<FoundationElementDefinition, import("@microsoft/fast-element").Constructable<import("@microsoft/fast-foundation").FoundationElement>>;
+export declare const registerDatePicker: (prefix?: string) => import("@microsoft/fast-foundation").DesignSystem;

package/lib/date-picker/index.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/date-picker/locale.d.ts

@@ -0,0 +1,21 @@
+export interface DatePickerLocale {
+    months: {
+        name: string[];
+        shorthand: string[];
+    };
+    weekdays: {
+        name: string[];
+        shorthand: string[];
+    };
+    firstDayOfWeek: number;
+    dateFormat: string;
+    dateFormatPlaceholder: string;
+    chooseDateLabel: string;
+    prevYearLabel: string;
+    prevMonthLabel: string;
+    nextMonthLabel: string;
+    nextYearLabel: string;
+    clearLabel: string;
+    okLabel: string;
+    invalidDateError: string;
+}

package/lib/select/select.d.ts

@@ -5,13 +5,15 @@ import type { Appearance, Shape } from '../enums';
 export type SelectAppearance = Extract<Appearance, Appearance.Fieldset | Appearance.Ghost>;
 export type SelectShape = Extract<Shape, Shape.Rounded | Shape.Pill>;
 export declare class Select extends FoundationSelect {
-    appearance?: SelectAppearance;
-    shape?: SelectShape;
     _popup: Popup;
     _anchor: HTMLElement;
+    appearance?: SelectAppearance;
+    shape?: SelectShape;
     fixedDropdown: boolean;
+    placeholder: string | undefined;
     connectedCallback(): void;
     get displayValue(): string;
+    setDefaultSelectedOption(): void;
 }
 export interface Select extends AffixIconWithTrailing, FormElement, FormElementHelperText, ErrorText, FormElementSuccessText {
 }

package/listbox/index.js

@@ -4,7 +4,7 @@ import { l as listboxOptionRegistries } from '../shared/definition21.js';
 import { b as ListboxElement, a as Listbox } from '../shared/listbox.js';
 import '../shared/affix.js';
 import { f as focusTemplateFactory } from '../shared/focus2.js';
-import '../shared/form-elements.js';
+import '../shared/index2.js';
 import { s as slotted } from '../shared/slotted.js';
 import { c as classNames } from '../shared/class-names.js';
 import '../shared/focus.js';
@@ -20,6 +20,7 @@ import '../shared/dom.js';
 import '../shared/key-codes.js';
 import '../shared/strings.js';
 import '../shared/numbers.js';
+import '../locales/en-US.js';
 import '../shared/node-observation.js';
 
 const getClasses = ({
@@ -57,7 +58,7 @@ const ListboxTemplate = context => {
 	`;
 };
 
-var css_248z = "/**\n * Do not edit directly\n * Generated on Thu, 17 Aug 2023 11:13:18 GMT\n */\n:host {\n  display: block;\n  inline-size: fit-content;\n}\n\n:host(:focus-within) {\n  outline: none;\n}\n\n.base {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  padding: 4px;\n  background-color: var(--_appearance-color-fill);\n  border-radius: 6px;\n  box-shadow: inset 0 0 0 1px var(--_appearance-color-outline);\n  contain: paint;\n  gap: 4px;\n}\n.base {\n  /* @cssprop [--vvd-listbox-accent-backdrop=var(--vvd-color-canvas)] */\n  --_connotation-color-backdrop: var(--vvd-listbox-accent-backdrop, var(--vvd-color-canvas));\n  /* @cssprop [--vvd-listbox-accent-intermediate=var(--vvd-color-neutral-500)] */\n  --_connotation-color-intermediate: var(--vvd-listbox-accent-intermediate, var(--vvd-color-neutral-500));\n  /* @cssprop [--vvd-listbox-accent-primary=var(--vvd-color-canvas-text)] */\n  --_connotation-color-primary: var(--vvd-listbox-accent-primary, var(--vvd-color-canvas-text));\n  /* @cssprop [--vvd-listbox-accent-soft=var(--vvd-color-neutral-100)] */\n  --_connotation-color-soft: var(--vvd-listbox-accent-soft, var(--vvd-color-neutral-100));\n}\n.base {\n  --_appearance-color-text: var(--vvd-color-canvas-text);\n  --_appearance-color-fill: var(--_connotation-color-backdrop);\n  --_appearance-color-outline: var(--_connotation-color-intermediate);\n}\n.base.appearance-ghost {\n  --_appearance-color-text: var(--_connotation-color-primary);\n  --_appearance-color-fill: transparent;\n  --_appearance-color-outline: transparent;\n}\n.base:where(:disabled, .disabled) {\n  --_appearance-color-text: var(--vvd-color-neutral-300);\n  --_appearance-color-fill: var(--vvd-color-neutral-100);\n  --_appearance-color-outline: var(--vvd-color-neutral-300);\n}\n.base:where(:disabled, .disabled).appearance-ghost {\n  --_appearance-color-text: var(--vvd-color-neutral-300);\n  --_appearance-color-fill: transparent;\n  --_appearance-color-outline: transparent;\n}\n\n.focus-indicator {\n  pointer-events: none;\n}\n:host(:not(:focus-within)) .focus-indicator {\n  display: none;\n}\n\n.base.disabled ::slotted([role=option]) {\n  --_option-appearance-color-text: var(--_appearance-color-outline);\n  cursor: not-allowed;\n  pointer-events: none;\n}";
+var css_248z = "/**\n * Do not edit directly\n * Generated on Tue, 22 Aug 2023 13:37:39 GMT\n */\n:host {\n  display: block;\n  inline-size: fit-content;\n}\n\n:host(:focus-within) {\n  outline: none;\n}\n\n.base {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  padding: 4px;\n  background-color: var(--_appearance-color-fill);\n  border-radius: 6px;\n  box-shadow: inset 0 0 0 1px var(--_appearance-color-outline);\n  contain: paint;\n  gap: 4px;\n}\n.base {\n  /* @cssprop [--vvd-listbox-accent-backdrop=var(--vvd-color-canvas)] */\n  --_connotation-color-backdrop: var(--vvd-listbox-accent-backdrop, var(--vvd-color-canvas));\n  /* @cssprop [--vvd-listbox-accent-intermediate=var(--vvd-color-neutral-500)] */\n  --_connotation-color-intermediate: var(--vvd-listbox-accent-intermediate, var(--vvd-color-neutral-500));\n  /* @cssprop [--vvd-listbox-accent-primary=var(--vvd-color-canvas-text)] */\n  --_connotation-color-primary: var(--vvd-listbox-accent-primary, var(--vvd-color-canvas-text));\n  /* @cssprop [--vvd-listbox-accent-soft=var(--vvd-color-neutral-100)] */\n  --_connotation-color-soft: var(--vvd-listbox-accent-soft, var(--vvd-color-neutral-100));\n}\n.base {\n  --_appearance-color-text: var(--vvd-color-canvas-text);\n  --_appearance-color-fill: var(--_connotation-color-backdrop);\n  --_appearance-color-outline: var(--_connotation-color-intermediate);\n}\n.base.appearance-ghost {\n  --_appearance-color-text: var(--_connotation-color-primary);\n  --_appearance-color-fill: transparent;\n  --_appearance-color-outline: transparent;\n}\n.base:where(:disabled, .disabled) {\n  --_appearance-color-text: var(--vvd-color-neutral-300);\n  --_appearance-color-fill: var(--vvd-color-neutral-100);\n  --_appearance-color-outline: var(--vvd-color-neutral-300);\n}\n.base:where(:disabled, .disabled).appearance-ghost {\n  --_appearance-color-text: var(--vvd-color-neutral-300);\n  --_appearance-color-fill: transparent;\n  --_appearance-color-outline: transparent;\n}\n\n.focus-indicator {\n  pointer-events: none;\n}\n:host(:not(:focus-within)) .focus-indicator {\n  display: none;\n}\n\n.base.disabled ::slotted([role=option]) {\n  --_option-appearance-color-text: var(--_appearance-color-outline);\n  cursor: not-allowed;\n  pointer-events: none;\n}";
 
 const listboxDefinition = Listbox.compose({
   baseName: 'listbox',

package/locales/en-GB.d.ts

@@ -0,0 +1,3 @@
+import type { Locale } from '../shared/localization/Locale';
+declare const enGB: Locale;
+export default enGB;

package/locales/en-GB.js

@@ -0,0 +1,25 @@
+const enGB = {
+  datePicker: {
+    months: {
+      name: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'Oktober', 'November', 'December'],
+      shorthand: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dec']
+    },
+    weekdays: {
+      name: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
+      shorthand: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
+    },
+    firstDayOfWeek: 1,
+    dateFormat: 'dd/MM/yyyy',
+    dateFormatPlaceholder: 'DD/MM/YYYY',
+    chooseDateLabel: 'Choose date',
+    prevYearLabel: 'Previous year',
+    prevMonthLabel: 'Previous month',
+    nextMonthLabel: 'Next month',
+    nextYearLabel: 'Next year',
+    clearLabel: 'Clear',
+    okLabel: 'OK',
+    invalidDateError: 'Please enter a valid date.'
+  }
+};
+
+export { enGB as default };

package/locales/en-US.d.ts

@@ -0,0 +1,3 @@
+import type { Locale } from '../shared/localization/Locale';
+declare const enUS: Locale;
+export default enUS;

package/locales/en-US.js

@@ -0,0 +1,25 @@
+const enUS = {
+  datePicker: {
+    months: {
+      name: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'Oktober', 'November', 'December'],
+      shorthand: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dec']
+    },
+    weekdays: {
+      name: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
+      shorthand: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
+    },
+    firstDayOfWeek: 0,
+    dateFormat: 'MM/dd/yyyy',
+    dateFormatPlaceholder: 'MM/DD/YYYY',
+    chooseDateLabel: 'Choose date',
+    prevYearLabel: 'Previous year',
+    prevMonthLabel: 'Previous month',
+    nextMonthLabel: 'Next month',
+    nextYearLabel: 'Next year',
+    clearLabel: 'Clear',
+    okLabel: 'OK',
+    invalidDateError: 'Please enter a valid date.'
+  }
+};
+
+export { enUS as default };

package/locales/ja-JP.d.ts

@@ -0,0 +1,3 @@
+import type { Locale } from '../shared/localization/Locale';
+declare const jaJP: Locale;
+export default jaJP;

package/locales/ja-JP.js

@@ -0,0 +1,25 @@
+const jaJP = {
+  datePicker: {
+    months: {
+      name: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
+      shorthand: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
+    },
+    weekdays: {
+      name: ['日曜日', '月曜日', '火曜日', '水曜日', '木曜日', '金曜日', '土曜日'],
+      shorthand: ['日', '月', '火', '水', '木', '金', '土']
+    },
+    firstDayOfWeek: 0,
+    dateFormat: 'yyyy年MM月dd日',
+    dateFormatPlaceholder: 'YYYY年MM月DD日',
+    chooseDateLabel: '日付を選択',
+    prevYearLabel: '前年',
+    prevMonthLabel: '前月',
+    nextMonthLabel: '次月',
+    nextYearLabel: '翌年',
+    clearLabel: 'クリア',
+    okLabel: 'OK',
+    invalidDateError: '有効な日付を入力してください。'
+  }
+};
+
+export { jaJP as default };

package/locales/zh-CN.d.ts

@@ -0,0 +1,3 @@
+import type { Locale } from '../shared/localization/Locale';
+declare const zhCN: Locale;
+export default zhCN;