@ixfx/components 0.14.7 → 0.15.1

package/dist/index.js

@@ -15,7 +15,7 @@ import { TitlebarElement } from "./titlebar.js";
 import { i as ICON_CLOSE, n as ICON_CHECK, r as ICON_CHEVRON_DOWN, t as ICON_CARET_RIGHT } from "./defaults-B4ePs4LB.js";
 import "./icons.js";
 import { t as prominenceStyles } from "./prominence-DlFShic3.js";
-import { n as buttonStyles, t as ButtonElement } from "./button-B7mgqtxR.js";
+import { n as buttonStyles, t as ButtonElement } from "./button-ikByJJPN.js";
 import { a as toGroupKey, i as resolveGroupKey, n as defaultGroupLabel, o as toggleInSet, r as partitionByGroup, t as EMPTY_GROUP_LABEL } from "./grouping-RYPnHkrS.js";
 import { a as listItemFadeKeyframes, c as captionForEntry, i as animateListItemOut, l as createDefaultListDragPreview, n as LIST_ITEM_MOTION_MS, o as prefersReducedMotion, r as animateListItemIn, s as startListItemOutAnimation, t as ListNativeDragController } from "./list-native-drag-controller-CcXoS0YX.js";
 import { n as isMultiMode, r as ListDragSelectController, t as ListSelectionController } from "./list-selection-controller-BeE70lbB.js";
@@ -23,7 +23,7 @@ import "./interaction-E-uMGHkJ.js";
 import "./menu-item-BUv8An2k.js";
 import { Checkbox } from "./checkbox.js";
 import { t as CheckedSelect } from "./checked-select-CBUidG7n.js";
-import { n as ColourPicker, t as ColourPickerPopup } from "./colour-picker-BCMU7W7R.js";
+import { n as ColourPicker, t as ColourPickerPopup } from "./colour-picker-DwAa6RDh.js";
 import { LabelledRangeInput } from "./labelled-range-input.js";
 import { t as collectDataResult } from "./data-provider-35TyWclX.js";
 import { a as TreeDataModel, c as pruneDraggedDescendants, i as TreeDropController, n as TreeListElement, o as applyTreeDrop, r as TreeBaseElement, s as dropTargetFor, t as TreeController } from "./tree-2_TRrLAV.js";
@@ -38,14 +38,14 @@ import { t as PanTextElement } from "./pan-text-CqtvjPyK.js";
 import { t as DetailListElement } from "./detail-list-q8bs67BM.js";
 import { ListGroupHeaderElement } from "./list-group-header.js";
 import { a as distribute, c as preserveRestoreWeights, d as toSnapshot, f as walk, i as buildModel, l as resolveTracks, n as SplitPanelElement, o as findPanelNode, r as applySnapshot, s as normalise, t as SplitLayoutElement, u as setPanelRestoreWeight } from "./split-layout-Deoxy47d.js";
-import { TabListElement } from "./tabs.js";
+import { t as TabListElement } from "./tab-list-R_bGbDvO.js";
 import { EditableLabel } from "./editable-label.js";
 import { t as resolveAxisStep } from "./keyboard-B5xD7Fz-.js";
 import { t as WheelNudgeMixin } from "./wheel-nudge-D5rmht3v.js";
 import { n as EditableNumber, t as LabelledSliderInput } from "./labelled-slider-input-FdCRi6st.js";
 import { VerticalListElement } from "./vertical-list.js";
 import { FlatListElement } from "./flat-list.js";
-import { t as FormElement } from "./form-CsXJX15p.js";
+import { n as formStyles, r as adoptLightDomStyles, t as FormElement } from "./form-CY0nibZ5.js";
 import { t as GridListElement } from "./grid-list-y6dWJYu3.js";
 import { PanelElement } from "./panel.js";
 import { GroupedItemListerElement } from "./grouped-item-lister.js";
@@ -3652,6 +3652,7 @@ let TabListItemElement = class TabListItemElement extends LitElement {
         --selected-background: var(--ixfx-tab-selected-background, var(--surface-5));
         --tab-padding: var(--ixfx-tab-padding, var(--space-s));
         display: inline-flex;
+        position: relative;
         min-width: 0;
         user-select: none;
         box-sizing: border-box;
@@ -3703,6 +3704,47 @@ let TabListItemElement = class TabListItemElement extends LitElement {
         text-decoration-offset: var(--selected-tab-text-decoration-offset);
       }
 
+      /* Sliding underline, drawn as the host's ::after so it can take part in
+         a view transition: names set inside a shadow root are ignored, so the
+         view-transition-name comes from a document-level stylesheet
+         (see indicator-transition.ts) targeting this same pseudo-element.
+         Zero thickness (the default) means off. The list sets indicator-edge
+         from orientation/flip and a unique --ixfx-tab-indicator-name. */
+      :host([selected])::after {
+        content: "";
+        position: absolute;
+        pointer-events: none;
+        left: var(--ixfx-tab-indicator-inset, 0px);
+        right: var(--ixfx-tab-indicator-inset, 0px);
+        bottom: var(--ixfx-tab-indicator-offset, 0px);
+        height: var(--ixfx-tab-indicator-thickness, 0px);
+        background: var(--ixfx-tab-indicator-colour, var(--accent));
+        border-radius: var(--ixfx-tab-indicator-radius, 0px);
+      }
+
+      :host([selected][indicator-edge="top"])::after {
+        top: var(--ixfx-tab-indicator-offset, 0px);
+        bottom: auto;
+      }
+
+      :host([selected][indicator-edge="left"])::after,
+      :host([selected][indicator-edge="right"])::after {
+        top: var(--ixfx-tab-indicator-inset, 0px);
+        bottom: var(--ixfx-tab-indicator-inset, 0px);
+        left: auto;
+        right: auto;
+        height: auto;
+        width: var(--ixfx-tab-indicator-thickness, 0px);
+      }
+
+      :host([selected][indicator-edge="left"])::after {
+        left: var(--ixfx-tab-indicator-offset, 0px);
+      }
+
+      :host([selected][indicator-edge="right"])::after {
+        right: var(--ixfx-tab-indicator-offset, 0px);
+      }
+
       .label {
         overflow: var(--allow-overflow, hidden);
         text-overflow: ellipsis;
@@ -5534,19 +5576,34 @@ let FormGroupElement = class FormGroupElement extends LitElement {
 	}
 	connectedCallback() {
 		super.connectedCallback();
-		this._observer = new MutationObserver(() => this._moveChildren());
+		adoptLightDomStyles(this, formStyles);
+		this._observer = new MutationObserver(() => this._sync());
 	}
 	firstUpdated() {
 		this._fieldset = this.querySelector(`fieldset`) ?? void 0;
 		if (this._fieldset) {
-			this._observer?.observe(this, { childList: true });
-			this._moveChildren();
+			this._observer?.observe(this, {
+				childList: true,
+				subtree: true
+			});
+			this._sync();
 		}
 	}
 	disconnectedCallback() {
 		super.disconnectedCallback();
 		this._observer?.disconnect();
 	}
+	_sync() {
+		this._moveChildren();
+		this._updatePairs();
+	}
+	/** Sets the number of label/input pairs in the widest shared row, used for the wide grid columns. */
+	_updatePairs() {
+		if (!this._fieldset) return;
+		const counts = Array.from(this._fieldset.querySelectorAll(`:scope > ixfx-form-row`)).map((row) => row.querySelectorAll(`:scope > ixfx-form-part`).length);
+		const pairs = Math.max(1, ...counts);
+		this._fieldset.style.setProperty(`--ixfx-form-pairs`, String(pairs));
+	}
 	_moveChildren() {
 		if (!this._fieldset) return;
 		Array.from(this.children).filter((el) => el.tagName !== `FIELDSET`).forEach((el) => {
@@ -5558,8 +5615,56 @@ let FormGroupElement = class FormGroupElement extends LitElement {
 	}
 };
 __decorate([property({ type: String })], FormGroupElement.prototype, "label", void 0);
+__decorate([property({
+	type: String,
+	attribute: `label-align`,
+	reflect: true
+})], FormGroupElement.prototype, "labelAlign", void 0);
 FormGroupElement = __decorate([safeCustomElement(`ixfx-form-group`)], FormGroupElement);
 //#endregion
+//#region src/form/form-options.ts
+let idCounter$1 = 0;
+let FormOptionsElement = class FormOptionsElement extends LitElement {
+	constructor(..._args) {
+		super(..._args);
+		this.label = ``;
+		this.orientation = `horizontal`;
+		this._labelId = `ixfx-form-options-${++idCounter$1}`;
+	}
+	createRenderRoot() {
+		return this;
+	}
+	connectedCallback() {
+		super.connectedCallback();
+		adoptLightDomStyles(this, formStyles);
+		this.setAttribute(`role`, `group`);
+		this.setAttribute(`aria-labelledby`, this._labelId);
+		this._observer = new MutationObserver(() => this._moveChildren());
+	}
+	firstUpdated() {
+		this._observer?.observe(this, { childList: true });
+		this._moveChildren();
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		this._observer?.disconnect();
+	}
+	_moveChildren() {
+		const items = this.querySelector(`:scope > .ixfx-form-options-items`);
+		if (!items) return;
+		Array.from(this.children).filter((el) => !el.classList.contains(`ixfx-form-options-items`) && !el.classList.contains(`ixfx-form-options-label`)).forEach((el) => items.appendChild(el));
+	}
+	render() {
+		return html`<span class="ixfx-form-options-label" id=${this._labelId}>${this.label}</span><div class="ixfx-form-options-items"></div>`;
+	}
+};
+__decorate([property({ type: String })], FormOptionsElement.prototype, "label", void 0);
+__decorate([property({
+	type: String,
+	reflect: true
+})], FormOptionsElement.prototype, "orientation", void 0);
+FormOptionsElement = __decorate([safeCustomElement(`ixfx-form-options`)], FormOptionsElement);
+//#endregion
 //#region src/form/form-part.ts
 let idCounter = 0;
 let FormPartElement = class FormPartElement extends LitElement {
@@ -5572,6 +5677,7 @@ let FormPartElement = class FormPartElement extends LitElement {
 	}
 	connectedCallback() {
 		super.connectedCallback();
+		adoptLightDomStyles(this, formStyles);
 		this._ensureId();
 	}
 	_ensureId() {
@@ -5590,6 +5696,30 @@ let FormPartElement = class FormPartElement extends LitElement {
 __decorate([property({ type: String })], FormPartElement.prototype, "label", void 0);
 FormPartElement = __decorate([safeCustomElement(`ixfx-form-part`)], FormPartElement);
 //#endregion
+//#region src/form/form-row.ts
+let FormRowElement = class FormRowElement extends LitElement {
+	createRenderRoot() {
+		return this;
+	}
+	connectedCallback() {
+		super.connectedCallback();
+		adoptLightDomStyles(this, formStyles);
+		this._observer = new MutationObserver(() => this._indexParts());
+		this._observer.observe(this, { childList: true });
+		this._indexParts();
+	}
+	disconnectedCallback() {
+		super.disconnectedCallback();
+		this._observer?.disconnect();
+	}
+	_indexParts() {
+		Array.from(this.children).filter((el) => el.tagName === `IXFX-FORM-PART`).forEach((part, index) => {
+			part.style.setProperty(`--ixfx-form-part-index`, String(index + 1));
+		});
+	}
+};
+FormRowElement = __decorate([safeCustomElement(`ixfx-form-row`)], FormRowElement);
+//#endregion
 //#region src/grouped-item-lister/tree-list-adapter.ts
 /**
 * Creates an `HTMLElement` that implements `IGroupedSubComponent<T>` by wrapping
@@ -15916,4 +16046,4 @@ function init() {
 	console.log(`Init`);
 }
 //#endregion
-export { AcTextElement, AcTokenElement, BottomDrawerElement, ButtonElement, Checkbox, CheckedSelect, ColourPicker, ColourPickerPopup, CrumbNavigationElement, CrumbPathController, CrumbPathElement, DEFAULT_SIBLING_SPACING, DataController, DataDisplayComponent, DataGridElement, DataTableElement, DetailListElement, DockHostElement, DockPanelElement, EMPTY_GROUP_LABEL, EditableLabel, EditableNumber, FlatListElement, FormElement, FormGroupElement, FormPartElement, GridListElement, GroupedItemListerElement, HyperbolicTreeListElement, ICON_CARET_RIGHT, ICON_CHECK, ICON_CHEVRON_DOWN, ICON_CLOSE, IcicleTreeListElement, IncrSearchTreeController as IncrSearchMillerController, IncrSearchTreeController, IxfxHexEditorElement, IxfxIconElement, IxfxTimelineElement, KeyedElementIndex, LIST_ITEM_MOTION_MS, LIST_SEARCH_COMMAND_IDS, LIST_SEARCH_MODES, LabelledRadialInput, LabelledRangeInput, LabelledSliderInput, LedElement, ListDragSelectController, ListGroupHeaderElement, ListNativeDragController, ListSearchController, ListSelectionController, menu_exports as Menu, MillerBaseElement, MillerListElement, MillerTreeController, MulticolListElement, NarrowedTextElement, NotificationManager, NotificationPillElement, PanTextElement, PanelElement, PanelGroupElement, PlotDataSeries, PlotHistogram, PlotMultiAxis, PlotSingleAxis, PlotXyAxis, PolarPad, RadialInputElement, RadioGroup, RangeElement, RangeInput, RangeMultiElement, RatingElement, SelectHorizElement, ShapefillValueElement, SliderInputElement, SlidingNumberElement, SnackbarElement, SnapContainer, SplitButton, SplitLayoutElement, SplitPanelElement, SwipeElement, TabController, TabListElement, TabListItemElement, TabPanelElement, TabPanelsElement, TextShimmerElement, TickledController, TimelineController, TimelineTrackTabElement, TitlebarElement, ToolbarElement, ToolbarGroupElement, TooltipElement, TransitoryLabelElement, TreeBaseElement, TreeController, TreeDataModel, TreeDropController, TreeKeyboardNavController, TreeListElement, TreemapListElement, TwoSplitLayoutElement, VerticalListElement, XyPad, addPanelToStack, animateListItemIn, animateListItemOut, applyAgeModification, applyHighlights, applyIsometry, applySnapshot, applyTreeDrop, attachTimelineInteractions, bottomDrawerCommandId, buildHighlightTargets, buildModel, captionForEntry, clampToDisk, clearHighlights, collectContainerNames, collectDataResult, collectPanelIds, collectStackPaths, composeIsometry, computeCanonicalPositions, computeColour, computeHyperbolicLayout, computeIcicleLayout, computeLeafGeoms, computeTreemapLayout, createAcCompletionProvider, createDataListSearchAdapter, createDefaultListDragPreview, createElementIncrSearch, createElementListSearchAdapter, createEmptyLayout, createEmptyStack, createFuzzySearch, createIncrSearch, createPillRenderer, createSplit, createStack, createTreeListAdapter, createTreeListSearchAdapter, createVerticalListAdapter, decomposeViewIsometry, defaultGroupLabel, distribute, dropTargetFor, euclideanRadiusForHyperbolicDistance, extractStack, findHyperbolicIdOf, findHyperbolicKeyPath, findHyperbolicNode, findHyperbolicPath, findHyperbolicPathById, findIcicleNode, findIciclePath, findNode, findPanelNode, findParentOf, findStackOf, findStackPathByName, findTreemapNode, findTreemapPath, geodesicInterpolate, geodesicPath, geodesicSegment, getActiveDragPanelId, getIcon, getIconEntry, getIconFont, getLeafNeighbours, hasIcon, hyperbolicBranchId, hyperbolicChildIds, hyperbolicDistanceForEuclideanRadius, hyperbolicIdDepth, hyperbolicRelativeFrame, iconBus, identityIsometry, init, insertBeside, invertIsometry, isDragging, isHyperbolicDescendantId, isMultiMode, isSplit, isStack, keyForElement, listItemFadeKeyframes, listSearchStyles, mobiusAdd, mobiusFromOrigin, mobiusToOrigin, monitorIndeterminate, moveLeafNodeToEdge, moveLeafStep, norm, normalise, normaliseValue, normalize, panelGapIndex, parseColourScaleAttr, parseLayout, partitionByGroup, poincareDistance, pointerOverAnyHost, prefersReducedMotion, preserveRestoreWeights, pruneDraggedDescendants, readBaseColour, registerFontIcon, registerIcon, registerListSearchCommands, removePanelFromStack, resolveCssVars, resolveGrid, resolveGroupKey, resolveLeafPath, resolveTracks, rotationIsometry, serializeLayout, setActive, setIconFont, setPanelRestoreWeight, startListItemOutAnimation, svgToDataUri, swapLeaves, tickledItemStyles, tickledStyles, timelineStyles, toGroupKey, toSnapshot, toggleInSet, toolbarGapIndex, translationFromOrigin, viewIsometry, walk, wrapRoot };
+export { AcTextElement, AcTokenElement, BottomDrawerElement, ButtonElement, Checkbox, CheckedSelect, ColourPicker, ColourPickerPopup, CrumbNavigationElement, CrumbPathController, CrumbPathElement, DEFAULT_SIBLING_SPACING, DataController, DataDisplayComponent, DataGridElement, DataTableElement, DetailListElement, DockHostElement, DockPanelElement, EMPTY_GROUP_LABEL, EditableLabel, EditableNumber, FlatListElement, FormElement, FormGroupElement, FormOptionsElement, FormPartElement, FormRowElement, GridListElement, GroupedItemListerElement, HyperbolicTreeListElement, ICON_CARET_RIGHT, ICON_CHECK, ICON_CHEVRON_DOWN, ICON_CLOSE, IcicleTreeListElement, IncrSearchTreeController as IncrSearchMillerController, IncrSearchTreeController, IxfxHexEditorElement, IxfxIconElement, IxfxTimelineElement, KeyedElementIndex, LIST_ITEM_MOTION_MS, LIST_SEARCH_COMMAND_IDS, LIST_SEARCH_MODES, LabelledRadialInput, LabelledRangeInput, LabelledSliderInput, LedElement, ListDragSelectController, ListGroupHeaderElement, ListNativeDragController, ListSearchController, ListSelectionController, menu_exports as Menu, MillerBaseElement, MillerListElement, MillerTreeController, MulticolListElement, NarrowedTextElement, NotificationManager, NotificationPillElement, PanTextElement, PanelElement, PanelGroupElement, PlotDataSeries, PlotHistogram, PlotMultiAxis, PlotSingleAxis, PlotXyAxis, PolarPad, RadialInputElement, RadioGroup, RangeElement, RangeInput, RangeMultiElement, RatingElement, SelectHorizElement, ShapefillValueElement, SliderInputElement, SlidingNumberElement, SnackbarElement, SnapContainer, SplitButton, SplitLayoutElement, SplitPanelElement, SwipeElement, TabController, TabListElement, TabListItemElement, TabPanelElement, TabPanelsElement, TextShimmerElement, TickledController, TimelineController, TimelineTrackTabElement, TitlebarElement, ToolbarElement, ToolbarGroupElement, TooltipElement, TransitoryLabelElement, TreeBaseElement, TreeController, TreeDataModel, TreeDropController, TreeKeyboardNavController, TreeListElement, TreemapListElement, TwoSplitLayoutElement, VerticalListElement, XyPad, addPanelToStack, animateListItemIn, animateListItemOut, applyAgeModification, applyHighlights, applyIsometry, applySnapshot, applyTreeDrop, attachTimelineInteractions, bottomDrawerCommandId, buildHighlightTargets, buildModel, captionForEntry, clampToDisk, clearHighlights, collectContainerNames, collectDataResult, collectPanelIds, collectStackPaths, composeIsometry, computeCanonicalPositions, computeColour, computeHyperbolicLayout, computeIcicleLayout, computeLeafGeoms, computeTreemapLayout, createAcCompletionProvider, createDataListSearchAdapter, createDefaultListDragPreview, createElementIncrSearch, createElementListSearchAdapter, createEmptyLayout, createEmptyStack, createFuzzySearch, createIncrSearch, createPillRenderer, createSplit, createStack, createTreeListAdapter, createTreeListSearchAdapter, createVerticalListAdapter, decomposeViewIsometry, defaultGroupLabel, distribute, dropTargetFor, euclideanRadiusForHyperbolicDistance, extractStack, findHyperbolicIdOf, findHyperbolicKeyPath, findHyperbolicNode, findHyperbolicPath, findHyperbolicPathById, findIcicleNode, findIciclePath, findNode, findPanelNode, findParentOf, findStackOf, findStackPathByName, findTreemapNode, findTreemapPath, geodesicInterpolate, geodesicPath, geodesicSegment, getActiveDragPanelId, getIcon, getIconEntry, getIconFont, getLeafNeighbours, hasIcon, hyperbolicBranchId, hyperbolicChildIds, hyperbolicDistanceForEuclideanRadius, hyperbolicIdDepth, hyperbolicRelativeFrame, iconBus, identityIsometry, init, insertBeside, invertIsometry, isDragging, isHyperbolicDescendantId, isMultiMode, isSplit, isStack, keyForElement, listItemFadeKeyframes, listSearchStyles, mobiusAdd, mobiusFromOrigin, mobiusToOrigin, monitorIndeterminate, moveLeafNodeToEdge, moveLeafStep, norm, normalise, normaliseValue, normalize, panelGapIndex, parseColourScaleAttr, parseLayout, partitionByGroup, poincareDistance, pointerOverAnyHost, prefersReducedMotion, preserveRestoreWeights, pruneDraggedDescendants, readBaseColour, registerFontIcon, registerIcon, registerListSearchCommands, removePanelFromStack, resolveCssVars, resolveGrid, resolveGroupKey, resolveLeafPath, resolveTracks, rotationIsometry, serializeLayout, setActive, setIconFont, setPanelRestoreWeight, startListItemOutAnimation, svgToDataUri, swapLeaves, tickledItemStyles, tickledStyles, timelineStyles, toGroupKey, toSnapshot, toggleInSet, toolbarGapIndex, translationFromOrigin, viewIsometry, walk, wrapRoot };

package/dist/style.css

@@ -43,8 +43,8 @@
   --radius-m: 4px;
   --radius-l: 6px;
   --radius-xl: 8px;
-  --shadow-m: light-dark(0 2px 8px #0000001a, 0 4px 12px #0000004d);
-  --shadow-l: light-dark(0 4px 16px #00000026, 0 4px 24px #00000080);
+  --shadow-m: 0 3px 10px light-dark(#0000001a, #0000004d);
+  --shadow-l: 0 4px 20px light-dark(#00000026, #00000080);
   --disabled-opacity: .5;
   --transition: .15s ease-out;
   --prominence-idle-opacity: light-dark(.55, .6);
@@ -96,83 +96,3 @@
 ixfx-grouped-item-lister {
   display: block;
 }
-ixfx-form {
-  display: block;
-}
-
-ixfx-form-group {
-  display: block;
-  container-type: inline-size;
-}
-
-ixfx-form-group fieldset {
-  gap: var(--space-m) var(--space-l);
-  margin: 0;
-  border: 0;
-  grid-template-columns: 1fr;
-  min-inline-size: 0;
-  margin-block-start: var(--space-m);
-  margin-block-end: var(--space-m);
-  padding: 0;
-  display: grid;
-}
-
-ixfx-form-group fieldset > legend:empty {
-  display: none;
-}
-
-ixfx-form-group fieldset > legend {
-  font-weight: var(--font-weight-bold);
-  grid-column: 1 / -1;
-  margin-block-start: var(--space-m);
-  margin-block-end: var(--space-s);
-  padding: 0;
-}
-
-ixfx-form-group fieldset > :not(ixfx-form-part) {
-  grid-column: 1 / -1;
-}
-
-ixfx-form-part {
-  grid-column: 1 / -1;
-  grid-template-columns: 1fr;
-  align-items: start;
-  display: grid;
-}
-
-ixfx-form-part > label {
-  font-size: var(--ixfx-form-label-font-size, var(--text-s));
-  font-weight: var(--ixfx-form-label-font-weight, inherit);
-  font-family: var(--ixfx-form-label-font-family, inherit);
-  color: var(--ixfx-form-label-color, inherit);
-  text-transform: var(--ixfx-form-label-text-transform, uppercase);
-  padding-bottom: var(--space-xs);
-  grid-area: 1 / 1;
-}
-
-ixfx-form-part > input, ixfx-form-part > select, ixfx-form-part > textarea {
-  grid-area: 2 / 1;
-}
-
-@container (width >= 30rem) {
-  ixfx-form-group fieldset {
-    grid-template-columns: max-content 1fr;
-  }
-
-  ixfx-form-part {
-    grid-column: 1 / -1;
-    grid-template-columns: subgrid;
-    align-items: baseline;
-    display: grid;
-  }
-
-  ixfx-form-part > label {
-    padding-right: var(--space-xs);
-    grid-area: 1 / 1;
-    padding-bottom: 0;
-  }
-
-  ixfx-form-part > input, ixfx-form-part > select, ixfx-form-part > textarea {
-    grid-area: 1 / 2;
-  }
-}

package/dist/{tab-list-CexFFg6O.d.ts → tab-list-Df371rqw.d.ts}

@@ -103,6 +103,7 @@ declare class TabListElement extends LitElement {
   render(): import("lit").TemplateResult<1>;
   firstUpdated(): void;
   updated(changedProperties: PropertyValues): void;
+  connectedCallback(): void;
   getSelectedElement(): TabListItemElement | undefined;
   selectElement(el: HTMLElement): void;
   static styles: import("lit").CSSResult[];