@getufy/flint-ui 0.2.2 → 0.4.0

package/dist/_shared/{flint-snackbar-DS5F7oXF.js → flint-snackbar-D8-hpqLp.js}

@@ -5,18 +5,23 @@ import { classMap as s } from "lit/directives/class-map.js";
 //#region src/snackbar/flint-snackbar.css?inline
 var c = ":host{pointer-events:none;z-index:var(--flint-snackbar-z-index,1400);justify-content:center;align-items:center;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:fixed}:host([anchor-origin*=bottom]){bottom:var(--flint-snackbar-offset,24px)}:host([anchor-origin*=top]){top:var(--flint-snackbar-offset,24px)}:host([anchor-origin*=left]){left:var(--flint-snackbar-offset,24px)}:host([anchor-origin*=right]){right:var(--flint-snackbar-offset,24px)}:host([anchor-origin*=center]){left:50%;transform:translate(-50%)}.snackbar{background-color:var(--flint-snackbar-bg,#313131);color:var(--flint-snackbar-color,#fff);font-family:var(--flint-font-family);letter-spacing:.01071em;border-radius:var(--flint-border-radius-md);box-shadow:var(--flint-shadow-lg);min-width:var(--flint-snackbar-min-width,288px);max-width:var(--flint-snackbar-max-width,560px);pointer-events:auto;opacity:0;visibility:hidden;align-items:center;padding:6px 16px;font-size:.875rem;line-height:1.43;transition:opacity .225s cubic-bezier(.4,0,.2,1),transform .15s cubic-bezier(.4,0,.2,1);display:flex;transform:scale(.85)}.snackbar.open{opacity:1;visibility:visible;transform:scale(1)}:host([variant=info]) .snackbar{background-color:var(--flint-snackbar-bg-info,#0288d1)}:host([variant=success]) .snackbar{background-color:var(--flint-snackbar-bg-success,#2e7d32)}:host([variant=warning]) .snackbar{background-color:var(--flint-snackbar-bg-warning,#ed6c02)}:host([variant=error]) .snackbar{background-color:var(--flint-snackbar-bg-error,#d32f2f)}.message{flex-grow:1;padding:8px 0}.action{align-items:center;margin-left:8px;margin-right:-8px;padding-left:16px;display:flex}.action.hidden{display:none}.close-btn{color:inherit;cursor:pointer;opacity:.8;background:0 0;border:none;border-radius:2px;align-items:center;margin-left:8px;margin-right:-8px;padding:4px 8px;line-height:0;display:flex}.close-btn:hover{opacity:1}::slotted(flint-alert){width:100%;min-width:288px;margin-bottom:0!important}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}", l = class extends t {
 	constructor(...e) {
-		super(...e), this.open = !1, this.message = "", this.autoHideDuration = 5e3, this.anchorOrigin = "bottom-center", this.pauseOnHover = !0, this.closable = !1, this.variant = "default", this._hasAction = !1, this._timer = null, this._remainingTime = 0, this._timerStartedAt = 0;
+		super(...e), this.open = !1, this.defaultOpen = !1, this.message = "", this.autoHideDuration = 5e3, this.anchorOrigin = "bottom-center", this.pauseOnHover = !0, this.closable = !1, this.variant = "default", this._firstUpdate = !0, this._hasAction = !1, this._timer = null, this._remainingTime = 0, this._timerStartedAt = 0;
 	}
 	static {
 		this.styles = r(c);
 	}
+	willUpdate(e) {
+		this._firstUpdate && (this._firstUpdate = !1, this.defaultOpen && !this.open && (this.open = !0));
+	}
 	updated(e) {
 		e.has("open") && (this.open ? (this._remainingTime = this.autoHideDuration, this._startTimer(this._remainingTime), this.dispatchEvent(new CustomEvent("flint-snackbar-open", {
 			bubbles: !0,
-			composed: !0
+			composed: !0,
+			detail: { open: !0 }
 		}))) : (this._clearTimer(), this.dispatchEvent(new CustomEvent("flint-snackbar-close", {
 			bubbles: !0,
-			composed: !0
+			composed: !0,
+			detail: { open: !1 }
 		}))));
 	}
 	disconnectedCallback() {
@@ -81,7 +86,10 @@ var c = ":host{pointer-events:none;z-index:var(--flint-snackbar-z-index,1400);ju
 e([a({
 	type: Boolean,
 	reflect: !0
-})], l.prototype, "open", void 0), e([a({ type: String })], l.prototype, "message", void 0), e([a({
+})], l.prototype, "open", void 0), e([a({
+	type: Boolean,
+	attribute: "default-open"
+})], l.prototype, "defaultOpen", void 0), e([a({ type: String })], l.prototype, "message", void 0), e([a({
 	type: Number,
 	attribute: "auto-hide-duration"
 })], l.prototype, "autoHideDuration", void 0), e([a({

package/dist/_shared/{flint-speed-dial-DTZ2WaBh.js → flint-speed-dial-DYU66D0P.js}

@@ -140,7 +140,8 @@ var f = class extends t {
 	_setOpen(e) {
 		this.open = e, this._updateActionTooltips(), this.dispatchEvent(new CustomEvent(e ? "flint-speed-dial-open" : "flint-speed-dial-close", {
 			bubbles: !0,
-			composed: !0
+			composed: !0,
+			detail: { open: e }
 		}));
 	}
 	_toggle() {

package/dist/_shared/{flint-stepper-DdkEEVXE.js → flint-stepper-J1h_Y0-1.js}

@@ -74,7 +74,7 @@ var y = class extends t {
 	}
 	_fire() {
 		this.disabled || this.dispatchEvent(new CustomEvent("flint-step-click", {
-			detail: { index: this.stepIndex },
+			detail: { step: this.stepIndex },
 			bubbles: !0,
 			composed: !0
 		}));
@@ -162,9 +162,9 @@ e([o({
 })], y.prototype, "prevCompleted", void 0), y = e([a("flint-step")], y);
 var b = class extends t {
 	constructor(...e) {
-		super(...e), this.activeStep = 0, this.orientation = "horizontal", this.alternativeLabel = !1, this.nonLinear = !1, this.label = "steps", this._onStepClick = (e) => {
-			this.activeStep = e.detail.index, this.dispatchEvent(new CustomEvent("flint-step-change", {
-				detail: { step: e.detail.index },
+		super(...e), this.activeStep = 0, this.orientation = "horizontal", this.alternativeLabel = !1, this.nonLinear = !1, this.label = "steps", this._firstUpdate = !0, this._onStepClick = (e) => {
+			this.activeStep = e.detail.step, this.dispatchEvent(new CustomEvent("flint-step-change", {
+				detail: { step: this.activeStep },
 				bubbles: !0,
 				composed: !0
 			})), this._syncSteps();
@@ -173,6 +173,9 @@ var b = class extends t {
 	static {
 		this.styles = i(f);
 	}
+	willUpdate(e) {
+		this._firstUpdate && (this._firstUpdate = !1, this.defaultActiveStep !== void 0 && (this.activeStep = this.defaultActiveStep));
+	}
 	_syncSteps() {
 		let e = Array.from(this.querySelectorAll(":scope > flint-step"));
 		e.forEach((t, n) => {
@@ -204,6 +207,9 @@ e([o({
 	type: Number,
 	attribute: "active-step"
 })], b.prototype, "activeStep", void 0), e([o({
+	type: Number,
+	attribute: "default-active-step"
+})], b.prototype, "defaultActiveStep", void 0), e([o({
 	type: String,
 	reflect: !0
 })], b.prototype, "orientation", void 0), e([o({

package/dist/_shared/{flint-text-field-DlLvuIJW.js → flint-text-field-CqiHradH.js}

@@ -3,22 +3,25 @@ import { LitElement as t, html as n, unsafeCSS as r } from "lit";
 import { customElement as i, property as a, state as o } from "lit/decorators.js";
 import { classMap as s } from "lit/directives/class-map.js";
 //#region src/text-field/flint-text-field.css?inline
-var c = ":host{font-family:var(--flint-font-family);margin-bottom:1rem;display:block}.field-container{flex-direction:column;gap:.5rem;display:flex}.label{color:var(--flint-label-color);font-size:.875rem;font-weight:500;transition:color .2s}.input-wrapper{background-color:var(--flint-input-bg);border:1px solid var(--flint-input-border-color);border-radius:var(--flint-input-border-radius);align-items:center;transition:all .2s;display:flex;position:relative;overflow:hidden}.input-wrapper:hover:not(.disabled):not(.error){border-color:var(--flint-input-border-hover-color)}.input-wrapper.focused:not(.error){border-color:var(--flint-primary-color);box-shadow:0 0 0 3px var(--flint-primary-focus-ring)}.input-wrapper.error{border-color:var(--flint-error-color)}.input-wrapper.error.focused{box-shadow:0 0 0 3px var(--flint-error-focus-ring)}.input-wrapper.disabled{background-color:var(--flint-input-disabled-bg);cursor:not-allowed;opacity:.7}input{width:100%;color:inherit;background:0 0;border:none;outline:none;flex:1;padding:.625rem .875rem;font-family:inherit;font-size:1rem}input:disabled{cursor:not-allowed}input::placeholder{color:var(--flint-input-placeholder-color)}.icon-leading,.icon-trailing{color:var(--flint-text-color-muted);justify-content:center;align-items:center;padding:0 .75rem;display:flex}.icon-leading{padding-right:0}.icon-trailing{padding-left:0}.helper-text{color:var(--flint-help-text-color);font-size:.75rem}.error-text{color:var(--flint-error-color)}.filled .input-wrapper{background-color:var(--flint-surface-2);border-bottom:2px solid var(--flint-input-border-color);border-top:none;border-left:none;border-right:none;border-radius:4px 4px 0 0}.filled .input-wrapper.focused{border-bottom-color:var(--flint-primary-color);background-color:var(--flint-hover-color)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}", l = class extends t {
+var c = ":host{font-family:var(--flint-font-family);margin-bottom:var(--flint-text-field-margin-bottom,0);display:block}.field-container{flex-direction:column;gap:.5rem;display:flex}.label{color:var(--flint-label-color);font-size:.875rem;font-weight:500;transition:color .2s}.input-wrapper{background-color:var(--flint-input-bg);border:1px solid var(--flint-input-border-color);border-radius:var(--flint-input-border-radius);align-items:center;transition:all .2s;display:flex;position:relative;overflow:hidden}.input-wrapper:hover:not(.disabled):not(.error){border-color:var(--flint-input-border-hover-color)}.input-wrapper.focused:not(.error){border-color:var(--flint-primary-color);box-shadow:0 0 0 3px var(--flint-primary-focus-ring)}.input-wrapper.error{border-color:var(--flint-error-color)}.input-wrapper.error.focused{box-shadow:0 0 0 3px var(--flint-error-focus-ring)}.input-wrapper.disabled{background-color:var(--flint-input-disabled-bg);cursor:not-allowed;opacity:.7}input{width:100%;color:inherit;background:0 0;border:none;outline:none;flex:1;padding:.625rem .875rem;font-family:inherit;font-size:1rem}input:disabled{cursor:not-allowed}input::placeholder{color:var(--flint-input-placeholder-color)}.icon-leading,.icon-trailing{color:var(--flint-text-color-muted);justify-content:center;align-items:center;padding:0 .75rem;display:flex}.icon-leading{padding-right:0}.icon-trailing{padding-left:0}.helper-text{color:var(--flint-help-text-color);font-size:.75rem}.error-text{color:var(--flint-error-color)}.filled .input-wrapper{background-color:var(--flint-surface-2);border-bottom:2px solid var(--flint-input-border-color);border-top:none;border-left:none;border-right:none;border-radius:4px 4px 0 0}.filled .input-wrapper.focused{border-bottom-color:var(--flint-primary-color);background-color:var(--flint-hover-color)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}", l = class extends t {
 	constructor(...e) {
-		super(...e), this.label = "", this.value = "", this.placeholder = "", this.type = "text", this.variant = "outlined", this.disabled = !1, this.error = !1, this.helperText = "", this.errorMessage = "", this._focused = !1;
+		super(...e), this.label = "", this.value = "", this.placeholder = "", this.type = "text", this.variant = "outlined", this.disabled = !1, this.error = !1, this.helperText = "", this.errorMessage = "", this.defaultValue = "", this._focused = !1, this._firstUpdate = !0;
 	}
 	static {
 		this.styles = r(c);
 	}
+	willUpdate(e) {
+		super.willUpdate(e), this._firstUpdate && (this._firstUpdate = !1, this.defaultValue && !this.value && (this.value = this.defaultValue));
+	}
 	_handleInput(e) {
-		this.value = e.target.value, this.dispatchEvent(new CustomEvent("input", {
+		this.value = e.target.value, this.dispatchEvent(new CustomEvent("flint-text-field-input", {
 			detail: { value: this.value },
 			bubbles: !0,
 			composed: !0
 		}));
 	}
 	_handleChange(e) {
-		this.value = e.target.value, this.dispatchEvent(new CustomEvent("change", {
+		this.value = e.target.value, this.dispatchEvent(new CustomEvent("flint-text-field-change", {
 			detail: { value: this.value },
 			bubbles: !0,
 			composed: !0
@@ -71,6 +74,9 @@ var c = ":host{font-family:var(--flint-font-family);margin-bottom:1rem;display:b
     `;
 	}
 };
-e([a({ type: String })], l.prototype, "label", void 0), e([a({ type: String })], l.prototype, "value", void 0), e([a({ type: String })], l.prototype, "placeholder", void 0), e([a({ type: String })], l.prototype, "type", void 0), e([a({ type: String })], l.prototype, "variant", void 0), e([a({ type: Boolean })], l.prototype, "disabled", void 0), e([a({ type: Boolean })], l.prototype, "error", void 0), e([a({ type: String })], l.prototype, "helperText", void 0), e([a({ type: String })], l.prototype, "errorMessage", void 0), e([o()], l.prototype, "_focused", void 0), l = e([i("flint-text-field")], l);
+e([a({ type: String })], l.prototype, "label", void 0), e([a({ type: String })], l.prototype, "value", void 0), e([a({ type: String })], l.prototype, "placeholder", void 0), e([a({ type: String })], l.prototype, "type", void 0), e([a({ type: String })], l.prototype, "variant", void 0), e([a({ type: Boolean })], l.prototype, "disabled", void 0), e([a({ type: Boolean })], l.prototype, "error", void 0), e([a({ type: String })], l.prototype, "helperText", void 0), e([a({ type: String })], l.prototype, "errorMessage", void 0), e([a({
+	type: String,
+	attribute: "default-value"
+})], l.prototype, "defaultValue", void 0), e([o()], l.prototype, "_focused", void 0), l = e([i("flint-text-field")], l);
 //#endregion
 export { l as t };

package/dist/_shared/{flint-textarea-wDEUC9Bt.js → flint-textarea-D15Eq154.js}

@@ -10,7 +10,7 @@ var u = ":host{font-family:var(--flint-font-family);display:block}.textarea-wrap
 		this.styles = a(u);
 	}
 	constructor() {
-		super(), this.value = "", this.placeholder = "", this.disabled = !1, this.readonly = !1, this.required = !1, this.error = !1, this.errorMessage = "", this.helpText = "", this.label = "", this.size = "default", this.rows = 3, this.maxlength = void 0, this.minlength = void 0, this.name = "", this.autocomplete = "", this.resize = "vertical", this.defaultValue = "", this.ariaLabel = null, d++, this._textareaId = `flint-textarea-${d}`, this._descId = `flint-textarea-desc-${d}`;
+		super(), this.value = "", this.placeholder = "", this.disabled = !1, this.readonly = !1, this.required = !1, this.error = !1, this.errorMessage = "", this.helperText = "", this.label = "", this.size = "default", this.rows = 3, this.maxlength = void 0, this.minlength = void 0, this.name = "", this.autocomplete = "", this.resize = "vertical", this.defaultValue = "", this.ariaLabel = null, d++, this._textareaId = `flint-textarea-${d}`, this._descId = `flint-textarea-desc-${d}`;
 	}
 	get textareaElement() {
 		return this.shadowRoot?.querySelector("textarea") ?? null;
@@ -40,7 +40,7 @@ var u = ":host{font-family:var(--flint-font-family);display:block}.textarea-wrap
 		}));
 	}
 	render() {
-		let e = this.error || !!this.errorMessage, t = e && !!this.errorMessage || !!this.helpText;
+		let e = this.error || !!this.errorMessage, t = e && !!this.errorMessage || !!this.helperText;
 		return r`
       <div class="textarea-wrapper" part="wrapper">
         ${this.label ? r`
@@ -69,7 +69,7 @@ var u = ":host{font-family:var(--flint-font-family);display:block}.textarea-wrap
           @change=${this._handleChange}
         ></textarea>
 
-        ${e && this.errorMessage ? r`<p id=${this._descId} class="help-text error-text" part="error-text" role="alert">${this.errorMessage}</p>` : this.helpText ? r`<p id=${this._descId} class="help-text" part="help-text">${this.helpText}</p>` : i}
+        ${e && this.errorMessage ? r`<p id=${this._descId} class="help-text error-text" part="error-text" role="alert">${this.errorMessage}</p>` : this.helperText ? r`<p id=${this._descId} class="help-text" part="help-text">${this.helperText}</p>` : i}
       </div>
     `;
 	}
@@ -88,8 +88,8 @@ e([s({ type: String })], f.prototype, "value", void 0), e([s({ type: String })],
 	attribute: "error-message"
 })], f.prototype, "errorMessage", void 0), e([s({
 	type: String,
-	attribute: "help-text"
-})], f.prototype, "helpText", void 0), e([s({ type: String })], f.prototype, "label", void 0), e([s({
+	attribute: "helper-text"
+})], f.prototype, "helperText", void 0), e([s({ type: String })], f.prototype, "label", void 0), e([s({
 	type: String,
 	reflect: !0
 })], f.prototype, "size", void 0), e([s({ type: Number })], f.prototype, "rows", void 0), e([s({ type: Number })], f.prototype, "maxlength", void 0), e([s({ type: Number })], f.prototype, "minlength", void 0), e([s({ type: String })], f.prototype, "name", void 0), e([s({ type: String })], f.prototype, "autocomplete", void 0), e([s({

package/dist/_shared/{flint-time-picker-DcFN6DJD.js → flint-time-picker-CgOz2hSp.js}

@@ -50,7 +50,7 @@ function T(e, t, n = 140, r = 140) {
 }
 var E = class extends t {
 	constructor(...e) {
-		super(...e), this.value = "", this.label = "", this.ampm = !0, this.seconds = !1, this.disabled = !1, this.readonly = !1, this.error = !1, this.helperText = "", this._h = null, this._m = null, this._s = null, this._mer = "AM", this._active = null, this._focused = !1, this._buf = "";
+		super(...e), this.value = "", this.label = "", this.ampm = !0, this.seconds = !1, this.disabled = !1, this.readonly = !1, this.error = !1, this.helperText = "", this.errorMessage = "", this._h = null, this._m = null, this._s = null, this._mer = "AM", this._active = null, this._focused = !1, this._buf = "";
 	}
 	static {
 		this.styles = o(f);
@@ -77,7 +77,7 @@ var E = class extends t {
 	_emit() {
 		if (this._h === null || this._m === null) return;
 		let e = b(this.ampm ? S(this._h, this._mer) : this._h, this._m, this._s ?? 0);
-		e !== this.value && (this.value = e, this.dispatchEvent(new CustomEvent("change", {
+		e !== this.value && (this.value = e, this.dispatchEvent(new CustomEvent("flint-time-field-change", {
 			detail: { value: e },
 			bubbles: !0,
 			composed: !0
@@ -230,7 +230,7 @@ var E = class extends t {
 			e.stopPropagation(), this.clear();
 		}}>✕</button>` : i}
       </div>
-      ${this.helperText ? r`<small class="helper">${this.helperText}</small>` : i}
+      ${this.error && this.errorMessage ? r`<small class="helper error-text" role="alert">${this.errorMessage}</small>` : this.helperText ? r`<small class="helper">${this.helperText}</small>` : i}
     `;
 	}
 };
@@ -246,7 +246,10 @@ e([c({ type: String })], E.prototype, "value", void 0), e([c({ type: String })],
 })], E.prototype, "error", void 0), e([c({
 	type: String,
 	attribute: "helper-text"
-})], E.prototype, "helperText", void 0), e([l()], E.prototype, "_h", void 0), e([l()], E.prototype, "_m", void 0), e([l()], E.prototype, "_s", void 0), e([l()], E.prototype, "_mer", void 0), e([l()], E.prototype, "_active", void 0), e([l()], E.prototype, "_focused", void 0), e([l()], E.prototype, "_buf", void 0), E = e([s("flint-time-field")], E);
+})], E.prototype, "helperText", void 0), e([c({
+	type: String,
+	attribute: "error-message"
+})], E.prototype, "errorMessage", void 0), e([l()], E.prototype, "_h", void 0), e([l()], E.prototype, "_m", void 0), e([l()], E.prototype, "_s", void 0), e([l()], E.prototype, "_mer", void 0), e([l()], E.prototype, "_active", void 0), e([l()], E.prototype, "_focused", void 0), e([l()], E.prototype, "_buf", void 0), E = e([s("flint-time-field")], E);
 var D = class extends t {
 	constructor(...e) {
 		super(...e), this.value = "", this.step = 30, this.ampm = !0;
@@ -266,7 +269,7 @@ var D = class extends t {
 		return C(e, this.ampm);
 	}
 	_select(e) {
-		this.dispatchEvent(new CustomEvent("change", {
+		this.dispatchEvent(new CustomEvent("flint-digital-clock-change", {
 			detail: { value: e },
 			bubbles: !0,
 			composed: !0
@@ -322,7 +325,7 @@ var O = class extends t {
 	}
 	_set(e, t, n) {
 		let r = b(e, t, n);
-		this.dispatchEvent(new CustomEvent("change", {
+		this.dispatchEvent(new CustomEvent("flint-multi-section-digital-clock-change", {
 			detail: { value: r },
 			bubbles: !0,
 			composed: !0
@@ -464,7 +467,7 @@ var k = class extends t {
 	}
 	_emit(e, t, n) {
 		let r = b(e, t, n);
-		this.dispatchEvent(new CustomEvent("change", {
+		this.dispatchEvent(new CustomEvent("flint-time-clock-change", {
 			detail: { value: r },
 			bubbles: !0,
 			composed: !0
@@ -645,13 +648,13 @@ var A = n`
   .btn-ok:hover { background:var(--flint-primary-color-hover,#2563eb); }
 `, j = class extends t {
 	constructor(...e) {
-		super(...e), this.value = "", this.label = "Time", this.ampm = !0, this.seconds = !1, this.disabled = !1, this.readonly = !1, this.error = !1, this.helperText = "", this._open = !1;
+		super(...e), this.value = "", this.label = "Time", this.ampm = !0, this.seconds = !1, this.disabled = !1, this.readonly = !1, this.error = !1, this.helperText = "", this.errorMessage = "", this._open = !1;
 	}
 	static {
 		this.styles = [A];
 	}
 	_commit(e) {
-		this.value = e, this.dispatchEvent(new CustomEvent("change", {
+		this.value = e, this.dispatchEvent(new CustomEvent("flint-desktop-time-picker-change", {
 			detail: { value: e },
 			bubbles: !0,
 			composed: !0
@@ -661,8 +664,8 @@ var A = n`
 		return r`
       <div class="popover-anchor">
         <flint-time-field .value=${this.value} .label=${this.label} .ampm=${this.ampm} ?seconds=${this.seconds}
-          ?disabled=${this.disabled} ?readonly=${this.readonly} ?error=${this.error} helper-text=${this.helperText}
-          @change=${(e) => this._commit(e.detail.value)}
+          ?disabled=${this.disabled} ?readonly=${this.readonly} ?error=${this.error} helper-text=${this.helperText} error-message=${this.errorMessage}
+          @flint-time-field-change=${(e) => this._commit(e.detail.value)}
           @focus=${() => {
 			!this.disabled && !this.readonly && (this._open = !0);
 		}}
@@ -670,7 +673,7 @@ var A = n`
         <div class="click-away ${this._open ? "open" : ""}" @click=${() => this._open = !1}></div>
         <div class="popover ${this._open ? "open" : ""}" role="dialog" aria-label="Time picker">
           <flint-multi-section-digital-clock .value=${this.value || b(12, 0)} .ampm=${this.ampm} ?seconds=${this.seconds}
-            @change=${(e) => {
+            @flint-multi-section-digital-clock-change=${(e) => {
 			this.value = e.detail.value;
 		}}
           ></flint-multi-section-digital-clock>
@@ -695,10 +698,13 @@ e([c({ type: String })], j.prototype, "value", void 0), e([c({ type: String })],
 })], j.prototype, "error", void 0), e([c({
 	type: String,
 	attribute: "helper-text"
-})], j.prototype, "helperText", void 0), e([l()], j.prototype, "_open", void 0), j = e([s("flint-desktop-time-picker")], j);
+})], j.prototype, "helperText", void 0), e([c({
+	type: String,
+	attribute: "error-message"
+})], j.prototype, "errorMessage", void 0), e([l()], j.prototype, "_open", void 0), j = e([s("flint-desktop-time-picker")], j);
 var M = class extends t {
 	constructor(...e) {
-		super(...e), this.value = "", this.label = "Time", this.ampm = !0, this.seconds = !1, this.disabled = !1, this.error = !1, this.helperText = "", this._open = !1, this._pending = "", this._view = "hours";
+		super(...e), this.value = "", this.label = "Time", this.ampm = !0, this.seconds = !1, this.disabled = !1, this.error = !1, this.helperText = "", this.errorMessage = "", this._open = !1, this._pending = "", this._view = "hours";
 	}
 	static {
 		this.styles = [A];
@@ -706,23 +712,23 @@ var M = class extends t {
 	render() {
 		return r`
       <flint-time-field .value=${this.value} .label=${this.label} .ampm=${this.ampm} ?seconds=${this.seconds}
-        ?disabled=${this.disabled} ?error=${this.error} helper-text=${this.helperText} readonly
+        ?disabled=${this.disabled} ?error=${this.error} helper-text=${this.helperText} error-message=${this.errorMessage} readonly
         @focus=${() => {
 			this.disabled || (this._pending = this.value, this._view = "hours", this._open = !0);
 		}}
-        @change=${(e) => {
-			this.value = e.detail.value, this.dispatchEvent(new CustomEvent("change", {
+        @flint-time-field-change=${(e) => {
+			this.value = e.detail.value, this.dispatchEvent(new CustomEvent("flint-mobile-time-picker-change", {
 				detail: e.detail,
 				bubbles: !0,
 				composed: !0
 			}));
 		}}
       ></flint-time-field>
-      <flint-dialog .open=${this._open} disable-backdrop-close @close=${() => this._open = !1} style="--flint-dialog-width:320px">
+      <flint-dialog .open=${this._open} disable-backdrop-close @flint-dialog-close=${() => this._open = !1} style="--flint-dialog-width:320px">
         <flint-dialog-title>Select Time</flint-dialog-title>
         <flint-dialog-content style="padding:12px;display:flex;justify-content:center;">
           <flint-time-clock .value=${this._pending || this.value || b(12, 0)} .ampm=${this.ampm} ?seconds=${this.seconds} .view=${this._view}
-            @change=${(e) => {
+            @flint-time-clock-change=${(e) => {
 			this._pending = e.detail.value;
 		}}
             @flint-time-clock-view-change=${(e) => {
@@ -736,7 +742,7 @@ var M = class extends t {
 		}}>Cancel</button>
           <button class="btn btn-ok" @click=${() => {
 			let e = this._pending || this.value;
-			this.value = e, this.dispatchEvent(new CustomEvent("change", {
+			this.value = e, this.dispatchEvent(new CustomEvent("flint-mobile-time-picker-change", {
 				detail: { value: e },
 				bubbles: !0,
 				composed: !0
@@ -756,7 +762,10 @@ e([c({ type: String })], M.prototype, "value", void 0), e([c({ type: String })],
 })], M.prototype, "error", void 0), e([c({
 	type: String,
 	attribute: "helper-text"
-})], M.prototype, "helperText", void 0), e([l()], M.prototype, "_open", void 0), e([l()], M.prototype, "_pending", void 0), e([l()], M.prototype, "_view", void 0), M = e([s("flint-mobile-time-picker")], M);
+})], M.prototype, "helperText", void 0), e([c({
+	type: String,
+	attribute: "error-message"
+})], M.prototype, "errorMessage", void 0), e([l()], M.prototype, "_open", void 0), e([l()], M.prototype, "_pending", void 0), e([l()], M.prototype, "_view", void 0), M = e([s("flint-mobile-time-picker")], M);
 var N = class extends t {
 	constructor(...e) {
 		super(...e), this.value = "", this.ampm = !0, this.seconds = !1;
@@ -768,8 +777,8 @@ var N = class extends t {
 		return r`
       <div class="surface">
         <flint-multi-section-digital-clock .value=${this.value || b(12, 0)} .ampm=${this.ampm} ?seconds=${this.seconds}
-          @change=${(e) => {
-			this.value = e.detail.value, this.dispatchEvent(new CustomEvent("change", {
+          @flint-multi-section-digital-clock-change=${(e) => {
+			this.value = e.detail.value, this.dispatchEvent(new CustomEvent("flint-static-time-picker-change", {
 				detail: e.detail,
 				bubbles: !0,
 				composed: !0
@@ -783,7 +792,7 @@ var N = class extends t {
 e([c({ type: String })], N.prototype, "value", void 0), e([c({ type: Boolean })], N.prototype, "ampm", void 0), e([c({ type: Boolean })], N.prototype, "seconds", void 0), N = e([s("flint-static-time-picker")], N);
 var P = class extends t {
 	constructor(...e) {
-		super(...e), this.value = "", this.label = "Time", this.variant = "desktop", this.ampm = !0, this.seconds = !1, this.disabled = !1, this.error = !1, this.helperText = "";
+		super(...e), this.value = "", this.label = "Time", this.variant = "desktop", this.ampm = !0, this.seconds = !1, this.disabled = !1, this.error = !1, this.helperText = "", this.errorMessage = "";
 	}
 	static {
 		this.styles = o(_);
@@ -792,7 +801,7 @@ var P = class extends t {
 		return this.variant === "auto" ? window.matchMedia("(pointer:coarse)").matches ? "mobile" : "desktop" : this.variant;
 	}
 	_onChange(e) {
-		this.value = e.detail.value, this.dispatchEvent(new CustomEvent("change", {
+		this.value = e.detail.value, this.dispatchEvent(new CustomEvent("flint-time-picker-change", {
 			detail: e.detail,
 			bubbles: !0,
 			composed: !0
@@ -800,7 +809,7 @@ var P = class extends t {
 	}
 	render() {
 		let e = this._v;
-		return e === "static" ? r`<flint-static-time-picker .value=${this.value} .ampm=${this.ampm} ?seconds=${this.seconds} @change=${this._onChange}></flint-static-time-picker>` : e === "mobile" ? r`<flint-mobile-time-picker .value=${this.value} .label=${this.label} .ampm=${this.ampm} ?seconds=${this.seconds} ?disabled=${this.disabled} ?error=${this.error} helper-text=${this.helperText} @change=${this._onChange}></flint-mobile-time-picker>` : r`<flint-desktop-time-picker .value=${this.value} .label=${this.label} .ampm=${this.ampm} ?seconds=${this.seconds} ?disabled=${this.disabled} ?error=${this.error} helper-text=${this.helperText} @change=${this._onChange}></flint-desktop-time-picker>`;
+		return e === "static" ? r`<flint-static-time-picker .value=${this.value} .ampm=${this.ampm} ?seconds=${this.seconds} @flint-static-time-picker-change=${this._onChange}></flint-static-time-picker>` : e === "mobile" ? r`<flint-mobile-time-picker .value=${this.value} .label=${this.label} .ampm=${this.ampm} ?seconds=${this.seconds} ?disabled=${this.disabled} ?error=${this.error} helper-text=${this.helperText} error-message=${this.errorMessage} @flint-mobile-time-picker-change=${this._onChange}></flint-mobile-time-picker>` : r`<flint-desktop-time-picker .value=${this.value} .label=${this.label} .ampm=${this.ampm} ?seconds=${this.seconds} ?disabled=${this.disabled} ?error=${this.error} helper-text=${this.helperText} error-message=${this.errorMessage} @flint-desktop-time-picker-change=${this._onChange}></flint-desktop-time-picker>`;
 	}
 };
 e([c({ type: String })], P.prototype, "value", void 0), e([c({ type: String })], P.prototype, "label", void 0), e([c({ type: String })], P.prototype, "variant", void 0), e([c({ type: Boolean })], P.prototype, "ampm", void 0), e([c({ type: Boolean })], P.prototype, "seconds", void 0), e([c({
@@ -812,6 +821,9 @@ e([c({ type: String })], P.prototype, "value", void 0), e([c({ type: String })],
 })], P.prototype, "error", void 0), e([c({
 	type: String,
 	attribute: "helper-text"
-})], P.prototype, "helperText", void 0), P = e([s("flint-time-picker")], P);
+})], P.prototype, "helperText", void 0), e([c({
+	type: String,
+	attribute: "error-message"
+})], P.prototype, "errorMessage", void 0), P = e([s("flint-time-picker")], P);
 //#endregion
 export { N as a, P as c, O as i, D as n, k as o, M as r, E as s, j as t };

package/dist/_shared/{flint-toggle-button-group-Cp9x0wSj.js → flint-toggle-button-group-Bb9ysTf-.js}

@@ -4,11 +4,14 @@ import { customElement as i, property as a } from "lit/decorators.js";
 //#region src/button/flint-toggle-button-group.css?inline
 var o = ":host{vertical-align:middle;display:inline-flex}", s = class extends t {
 	constructor(...e) {
-		super(...e), this.value = "", this.exclusive = !0;
+		super(...e), this.value = "", this.defaultValue = "", this.exclusive = !0, this._firstUpdate = !0;
 	}
 	static {
 		this.styles = r(o);
 	}
+	willUpdate(e) {
+		this._firstUpdate && (this._firstUpdate = !1, this.defaultValue !== "" && (this.value = this.defaultValue));
+	}
 	connectedCallback() {
 		super.connectedCallback(), this.addEventListener("flint-toggle-button-change", this._handleToggleClick), this._updateChildren();
 	}
@@ -47,6 +50,6 @@ var o = ":host{vertical-align:middle;display:inline-flex}", s = class extends t
 		return n`<slot @slotchange=${this._updateChildren}></slot>`;
 	}
 };
-e([a({ type: String })], s.prototype, "value", void 0), e([a({ type: Boolean })], s.prototype, "exclusive", void 0), s = e([i("flint-toggle-button-group")], s);
+e([a({ type: String })], s.prototype, "value", void 0), e([a({ attribute: "default-value" })], s.prototype, "defaultValue", void 0), e([a({ type: Boolean })], s.prototype, "exclusive", void 0), s = e([i("flint-toggle-button-group")], s);
 //#endregion
 export { s as t };

package/dist/_shared/{flint-transfer-list-DZsAcF0l.js → flint-transfer-list-CVm0jvtR.js}

@@ -33,7 +33,7 @@ var l = ":host{--flint-transfer-list-height:300px;--flint-transfer-list-width:20
 		this.disabled || (this.value = [], this.leftChecked = [], this.rightChecked = [], this._dispatchChange());
 	}
 	_dispatchChange() {
-		this.dispatchEvent(new CustomEvent("change", {
+		this.dispatchEvent(new CustomEvent("flint-transfer-list-change", {
 			detail: { value: this.value },
 			bubbles: !0,
 			composed: !0

package/dist/accordion/flint-accordion.d.ts

@@ -2,6 +2,8 @@ import { LitElement, PropertyValues } from 'lit';
 /**
  * Accordion: the wrapper for grouping related components.
  *
+ * @slot - FlintAccordionSummary and FlintAccordionDetails.
+ *
  * @fires flint-accordion-change - Fired when the accordion's expanded state changes.
  */
 export declare class FlintAccordion extends LitElement {
@@ -10,12 +12,19 @@ export declare class FlintAccordion extends LitElement {
      * If true, expands the accordion by default.
      */
     expanded: boolean;
+    /**
+     * Initial expanded state for uncontrolled usage.
+     * Has no effect after the element has connected to the DOM.
+     */
+    defaultExpanded: boolean;
     /**
      * If true, the accordion is disabled.
      */
     disabled: boolean;
     /** Unique ID used to link the region to its summary heading. */
     private readonly _uid;
+    private _firstUpdate;
+    willUpdate(changed: PropertyValues): void;
     updated(changed: PropertyValues): void;
     private _handleToggle;
     constructor();
@@ -25,6 +34,9 @@ export declare class FlintAccordion extends LitElement {
 /**
  * Accordion Summary: the wrapper for the Accordion header.
  *
+ * @slot expandIcon - Custom expand/collapse icon.
+ * @slot - Summary content.
+ *
  * @fires flint-accordion-toggle - Fired when the summary is clicked or activated via keyboard.
  */
 export declare class FlintAccordionSummary extends LitElement {
@@ -38,6 +50,8 @@ export declare class FlintAccordionSummary extends LitElement {
 }
 /**
  * Accordion Details: the wrapper for the Accordion content.
+ *
+ * @slot - Detail content.
  */
 export declare class FlintAccordionDetails extends LitElement {
     static styles: import("lit").CSSResult;

package/dist/accordion/flint-accordion.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"flint-accordion.d.ts","sourceRoot":"","sources":["../../src/accordion/flint-accordion.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAmB,cAAc,EAAE,MAAM,KAAK,CAAC;AASlE;;;;GAIG;AACH,qBACa,cAAe,SAAQ,UAAU;IAC1C,MAAM,CAAC,MAAM,0BAAgC;IAE7C;;OAEG;IACyC,QAAQ,UAAS;IAE7D;;OAEG;IACyC,QAAQ,UAAS;IAE7D,gEAAgE;IAChE,OAAO,CAAC,QAAQ,CAAC,IAAI,CAA4C;IAExD,OAAO,CAAC,OAAO,EAAE,cAAc;IAYxC,OAAO,CAAC,aAAa,CAQnB;;IAOO,oBAAoB;IAK7B,MAAM;CAOT;AAED;;;;GAIG;AACH,qBACa,qBAAsB,SAAQ,UAAU;IACjD,MAAM,CAAC,MAAM,0BAAuC;IAEpD,OAAO,CAAC,eAAe,CAKrB;IAEF,OAAO,CAAC,cAAc,CAKpB;;IAQO,oBAAoB;IAMpB,iBAAiB;IAW1B,MAAM;CAcT;AAED;;GAEG;AACH,qBACa,qBAAsB,SAAQ,UAAU;IACjD,MAAM,CAAC,MAAM,0BAAuC;IAEpD,MAAM;CAST;AAED;;GAEG;AACH,qBACa,qBAAsB,SAAQ,UAAU;IACjD,MAAM,CAAC,MAAM,0BAAuC;IAEpD,MAAM;CAGT;AAED,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,iBAAiB,EAAE,cAAc,CAAC;QAClC,yBAAyB,EAAE,qBAAqB,CAAC;QACjD,yBAAyB,EAAE,qBAAqB,CAAC;QACjD,yBAAyB,EAAE,qBAAqB,CAAC;KACpD;CACJ"}
+{"version":3,"file":"flint-accordion.d.ts","sourceRoot":"","sources":["../../src/accordion/flint-accordion.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAmB,cAAc,EAAE,MAAM,KAAK,CAAC;AASlE;;;;;;GAMG;AACH,qBACa,cAAe,SAAQ,UAAU;IAC1C,MAAM,CAAC,MAAM,0BAAgC;IAE7C;;OAEG;IACyC,QAAQ,UAAS;IAE7D;;;OAGG;IACyD,eAAe,UAAS;IAEpF;;OAEG;IACyC,QAAQ,UAAS;IAE7D,gEAAgE;IAChE,OAAO,CAAC,QAAQ,CAAC,IAAI,CAA4C;IAEjE,OAAO,CAAC,YAAY,CAAQ;IAEnB,UAAU,CAAC,OAAO,EAAE,cAAc;IAalC,OAAO,CAAC,OAAO,EAAE,cAAc;IAYxC,OAAO,CAAC,aAAa,CAQnB;;IAOO,oBAAoB;IAK7B,MAAM;CAOT;AAED;;;;;;;GAOG;AACH,qBACa,qBAAsB,SAAQ,UAAU;IACjD,MAAM,CAAC,MAAM,0BAAuC;IAEpD,OAAO,CAAC,eAAe,CAKrB;IAEF,OAAO,CAAC,cAAc,CAKpB;;IAQO,oBAAoB;IAMpB,iBAAiB;IAW1B,MAAM;CAcT;AAED;;;;GAIG;AACH,qBACa,qBAAsB,SAAQ,UAAU;IACjD,MAAM,CAAC,MAAM,0BAAuC;IAEpD,MAAM;CAST;AAED;;GAEG;AACH,qBACa,qBAAsB,SAAQ,UAAU;IACjD,MAAM,CAAC,MAAM,0BAAuC;IAEpD,MAAM;CAGT;AAED,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,iBAAiB,EAAE,cAAc,CAAC;QAClC,yBAAyB,EAAE,qBAAqB,CAAC;QACjD,yBAAyB,EAAE,qBAAqB,CAAC;QACjD,yBAAyB,EAAE,qBAAqB,CAAC;KACpD;CACJ"}

package/dist/accordion/flint-accordion.js

@@ -1,2 +1,2 @@
-import { i as e, n as t, r as n, t as r } from "../_shared/flint-accordion-CnXIksxN.js";
+import { i as e, n as t, r as n, t as r } from "../_shared/flint-accordion-C1ZeUTPt.js";
 export { r as FlintAccordion, t as FlintAccordionActions, n as FlintAccordionDetails, e as FlintAccordionSummary };

package/dist/alert/flint-alert.d.ts

@@ -5,7 +5,7 @@ import { LitElement } from 'lit';
  * @slot - The message content of the alert.
  * @slot icon - Optional icon to display instead of the default severity icon.
  *
- * @fires flint-alert-close - Fired when the alert's close button is clicked.
+ * @fires flint-alert-close - Fired when the alert's close button is clicked. detail: `{ open: false, severity: string }`
  */
 export declare class FlintAlert extends LitElement {
     static styles: import("lit").CSSResult;

package/dist/alert/flint-alert.js

@@ -1,2 +1,2 @@
-import { t as e } from "../_shared/flint-alert-DNcwWxQL.js";
+import { t as e } from "../_shared/flint-alert-XVhCfLTJ.js";
 export { e as FlintAlert };

package/dist/app-bar/flint-app-bar.d.ts

@@ -1,6 +1,10 @@
 import { LitElement } from 'lit';
 /**
  * flint-app-bar: The top App bar provides content and actions related to the current screen.
+ *
+ * @slot navigation - Left section, e.g. menu button.
+ * @slot title - Center section next to the title prop.
+ * @slot actions - Right section, e.g. action buttons.
  */
 export declare class FlintAppBar extends LitElement {
     static styles: import("lit").CSSResult;

package/dist/app-bar/flint-app-bar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"flint-app-bar.d.ts","sourceRoot":"","sources":["../../src/app-bar/flint-app-bar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAmB,MAAM,KAAK,CAAC;AAKlD;;GAEG;AACH,qBACa,WAAY,SAAQ,UAAU;IACzC,MAAM,CAAC,MAAM,0BAA6B;IAE1C,yDAAyD;IAC7B,KAAK,SAAM;IACvC,+CAA+C;IACJ,QAAQ,EAAE,QAAQ,GAAG,OAAO,GAAG,UAAU,GAAG,QAAQ,CAAY;IAC3G,2CAA2C;IACA,OAAO,EAAE,SAAS,GAAG,UAAU,CAAa;IAEvF,MAAM;CAmBP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,WAAW,CAAC;KAC9B;CACF"}
+{"version":3,"file":"flint-app-bar.d.ts","sourceRoot":"","sources":["../../src/app-bar/flint-app-bar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAmB,MAAM,KAAK,CAAC;AAKlD;;;;;;GAMG;AACH,qBACa,WAAY,SAAQ,UAAU;IACzC,MAAM,CAAC,MAAM,0BAA6B;IAE1C,yDAAyD;IAC7B,KAAK,SAAM;IACvC,+CAA+C;IACJ,QAAQ,EAAE,QAAQ,GAAG,OAAO,GAAG,UAAU,GAAG,QAAQ,CAAY;IAC3G,2CAA2C;IACA,OAAO,EAAE,SAAS,GAAG,UAAU,CAAa;IAEvF,MAAM;CAmBP;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,WAAW,CAAC;KAC9B;CACF"}

package/dist/backdrop/flint-backdrop.d.ts

@@ -2,7 +2,7 @@ import { LitElement } from 'lit';
 /**
  * A backdrop component that narrows the user's focus to a particular element.
  *
- * @fires flint-backdrop-close - Dispatched when the backdrop is clicked or Escape is pressed.
+ * @fires flint-backdrop-close - Dispatched when the backdrop is clicked or Escape is pressed. detail: `{ open: false }`
  * @slot - Content to display in the foreground.
  */
 export declare class FlintBackdrop extends LitElement {

package/dist/backdrop/flint-backdrop.js

@@ -1,2 +1,2 @@
-import { t as e } from "../_shared/flint-backdrop-BszHm5cJ.js";
+import { t as e } from "../_shared/flint-backdrop-B28XJbZN.js";
 export { e as FlintBackdrop };

package/dist/bottom-navigation/flint-bottom-navigation-action.d.ts

@@ -1,6 +1,9 @@
 import { LitElement, PropertyValues } from 'lit';
 /**
  * Bottom Navigation Action: Individual navigation item.
+ *
+ * @slot icon - Icon element.
+ * @slot - Label text.
  */
 export declare class FlintBottomNavigationAction extends LitElement {
     static styles: import("lit").CSSResult;

package/dist/bottom-navigation/flint-bottom-navigation-action.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"flint-bottom-navigation-action.d.ts","sourceRoot":"","sources":["../../src/bottom-navigation/flint-bottom-navigation-action.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAmB,cAAc,EAAE,MAAM,KAAK,CAAC;AAKlE;;GAEG;AACH,qBACa,2BAA4B,SAAQ,UAAU;IACvD,MAAM,CAAC,MAAM,0BAA6C;IAE1D;;OAEG;IACyB,KAAK,SAAM;IAEvC;;OAEG;IACS,KAAK,EAAE,OAAO,CAAC;IAE3B;;OAEG;IACyC,MAAM,UAAS;IAE3D;;OAEG;IAC0B,SAAS,UAAQ;IAE9C,iBAAiB;IAWjB,oBAAoB;IAKpB,SAAS,CAAC,OAAO,CAAC,iBAAiB,EAAE,cAAc;IAMnD,OAAO,CAAC,cAAc,CAKpB;IAEF,MAAM;CAWT;AAED,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,gCAAgC,EAAE,2BAA2B,CAAC;KACjE;CACJ"}
+{"version":3,"file":"flint-bottom-navigation-action.d.ts","sourceRoot":"","sources":["../../src/bottom-navigation/flint-bottom-navigation-action.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAmB,cAAc,EAAE,MAAM,KAAK,CAAC;AAKlE;;;;;GAKG;AACH,qBACa,2BAA4B,SAAQ,UAAU;IACvD,MAAM,CAAC,MAAM,0BAA6C;IAE1D;;OAEG;IACyB,KAAK,SAAM;IAEvC;;OAEG;IACS,KAAK,EAAE,OAAO,CAAC;IAE3B;;OAEG;IACyC,MAAM,UAAS;IAE3D;;OAEG;IAC0B,SAAS,UAAQ;IAE9C,iBAAiB;IAWjB,oBAAoB;IAKpB,SAAS,CAAC,OAAO,CAAC,iBAAiB,EAAE,cAAc;IAMnD,OAAO,CAAC,cAAc,CAKpB;IAEF,MAAM;CAWT;AAED,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,gCAAgC,EAAE,2BAA2B,CAAC;KACjE;CACJ"}

package/dist/bottom-navigation/flint-bottom-navigation.d.ts

@@ -3,7 +3,7 @@ import { LitElement, PropertyValues } from 'lit';
  * Bottom Navigation bars allow movement between primary destinations in an app.
  *
  * @slot - destinations (flint-bottom-navigation-action).
- * @fires flint-bottom-navigation-change - Dispatched when the selected value changes.
+ * @fires flint-bottom-navigation-change - Dispatched when the selected value changes. detail: `{ value: number | string }`
  */
 export declare class FlintBottomNavigation extends LitElement {
     static styles: import("lit").CSSResult;
@@ -11,10 +11,17 @@ export declare class FlintBottomNavigation extends LitElement {
      * The value of the currently selected action.
      */
     value: unknown;
+    /**
+     * Initial selected value for uncontrolled usage.
+     * Has no effect after the element has connected to the DOM.
+     */
+    defaultValue?: unknown;
     /**
      * If true, all labels are shown at all times.
      */
     showLabels: boolean;
+    private _firstUpdate;
+    protected willUpdate(changed: PropertyValues): void;
     private _actions;
     protected updated(changedProperties: PropertyValues): void;
     private _handleSlotChange;

package/dist/bottom-navigation/flint-bottom-navigation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"flint-bottom-navigation.d.ts","sourceRoot":"","sources":["../../src/bottom-navigation/flint-bottom-navigation.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAmB,cAAc,EAAE,MAAM,KAAK,CAAC;AAKlE;;;;;GAKG;AACH,qBACa,qBAAsB,SAAQ,UAAU;IACjD,MAAM,CAAC,MAAM,0BAAuC;IAEpD;;OAEG;IACS,KAAK,EAAE,OAAO,CAAC;IAE3B;;OAEG;IACoD,UAAU,UAAS;IAG1E,OAAO,CAAC,QAAQ,CAAsC;IAEtD,SAAS,CAAC,OAAO,CAAC,iBAAiB,EAAE,cAAc;IAMnD,OAAO,CAAC,iBAAiB;IAIzB,OAAO,CAAC,cAAc;IAUtB,OAAO,CAAC,mBAAmB;IAc3B,MAAM;CAOT;AAED,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,yBAAyB,EAAE,qBAAqB,CAAC;KACpD;CACJ"}
+{"version":3,"file":"flint-bottom-navigation.d.ts","sourceRoot":"","sources":["../../src/bottom-navigation/flint-bottom-navigation.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAmB,cAAc,EAAE,MAAM,KAAK,CAAC;AAKlE;;;;;GAKG;AACH,qBACa,qBAAsB,SAAQ,UAAU;IACjD,MAAM,CAAC,MAAM,0BAAuC;IAEpD;;OAEG;IACS,KAAK,EAAE,OAAO,CAAC;IAE3B;;;OAGG;IACuC,YAAY,CAAC,EAAE,OAAO,CAAC;IAEjE;;OAEG;IACoD,UAAU,UAAS;IAE1E,OAAO,CAAC,YAAY,CAAQ;cAET,UAAU,CAAC,OAAO,EAAE,cAAc;IAWrD,OAAO,CAAC,QAAQ,CAAsC;IAEtD,SAAS,CAAC,OAAO,CAAC,iBAAiB,EAAE,cAAc;IAMnD,OAAO,CAAC,iBAAiB;IAIzB,OAAO,CAAC,cAAc;IAUtB,OAAO,CAAC,mBAAmB;IAc3B,MAAM;CAOT;AAED,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,yBAAyB,EAAE,qBAAqB,CAAC;KACpD;CACJ"}

package/dist/bottom-navigation/flint-bottom-navigation.js

@@ -1,2 +1,2 @@
-import { t as e } from "../_shared/flint-bottom-navigation-B4-3_1w7.js";
+import { t as e } from "../_shared/flint-bottom-navigation-_0CMIMiw.js";
 export { e as FlintBottomNavigation };

package/dist/button/flint-toggle-button-group.d.ts

@@ -8,8 +8,15 @@ export declare class FlintToggleButtonGroup extends LitElement {
     static styles: import("lit").CSSResult;
     /** Currently selected value(s). A string when exclusive, an array otherwise. */
     value: string | string[];
+    /**
+     * Initial selected value(s) for uncontrolled usage.
+     * Has no effect after the element has connected to the DOM.
+     */
+    defaultValue: string | string[];
     /** Whether only one button can be selected at a time. */
     exclusive: boolean;
+    private _firstUpdate;
+    willUpdate(changed: PropertyValues): void;
     connectedCallback(): void;
     disconnectedCallback(): void;
     private _handleToggleClick;

package/dist/button/flint-toggle-button-group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"flint-toggle-button-group.d.ts","sourceRoot":"","sources":["../../src/button/flint-toggle-button-group.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAmB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAKvE;;;;GAIG;AACH,qBACa,sBAAuB,SAAQ,UAAU;IAClD,MAAM,CAAC,MAAM,0BAAwC;IAErD,gFAAgF;IACpD,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,CAAM;IAC1D,yDAAyD;IAC5B,SAAS,UAAQ;IAE9C,iBAAiB;IAMjB,oBAAoB;IAKpB,OAAO,CAAC,kBAAkB;IAyB1B,OAAO,CAAC,eAAe;IAyBvB,OAAO,CAAC,iBAAiB,EAAE,cAAc;IAMzC,MAAM;CAGT;AAED,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,2BAA2B,EAAE,sBAAsB,CAAC;KACvD;CACJ"}
+{"version":3,"file":"flint-toggle-button-group.d.ts","sourceRoot":"","sources":["../../src/button/flint-toggle-button-group.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAmB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAKvE;;;;GAIG;AACH,qBACa,sBAAuB,SAAQ,UAAU;IAClD,MAAM,CAAC,MAAM,0BAAwC;IAErD,gFAAgF;IACpD,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,CAAM;IAC1D;;;OAGG;IACuC,YAAY,EAAE,MAAM,GAAG,MAAM,EAAE,CAAM;IAC/E,yDAAyD;IAC5B,SAAS,UAAQ;IAE9C,OAAO,CAAC,YAAY,CAAQ;IAEnB,UAAU,CAAC,OAAO,EAAE,cAAc;IAU3C,iBAAiB;IAMjB,oBAAoB;IAKpB,OAAO,CAAC,kBAAkB;IAyB1B,OAAO,CAAC,eAAe;IAyBvB,OAAO,CAAC,iBAAiB,EAAE,cAAc;IAMzC,MAAM;CAGT;AAED,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,2BAA2B,EAAE,sBAAsB,CAAC;KACvD;CACJ"}