@sbb-esta/lyne-elements-dev 5.0.0-next.3-dev.1779265349 → 5.0.0-next.3-dev.1779268556

package/core/mixins/named-slot-list-mixin.js

@@ -1,20 +1,20 @@
 import { __esDecorate as e, __runInitializers as t } from "tslib";
 import { html as n, nothing as r } from "lit";
 import { state as i } from "lit/decorators.js";
-import { screenReaderOnlyStyles as a } from "../styles/styles.js";
+import { listResetStyles as a, screenReaderOnlyStyles as o } from "../styles/styles.js";
 //#region src/elements/core/mixins/named-slot-list-mixin.ts
-var o = "data-ssr-child-count", s = "li", c = (c) => (() => {
-	let l = c, u, d = [], f = [];
-	return class extends l {
+var s = "data-ssr-child-count", c = "li", l = (l) => (() => {
+	let u = l, d, f = [], p = [];
+	return class extends u {
 		constructor() {
-			super(...arguments), this.#e = t(this, d, []), this._handleSlotchange = (t(this, f), () => {
+			super(...arguments), this.#e = t(this, f, []), this._handleSlotchange = (t(this, p), () => {
 				let e = Array.from(this.children ?? []).filter((e) => this.listChildLocalNames.includes(e.localName));
-				e.length === this.listChildren.length && this.listChildren.every((t, n) => e[n] === t) || (this.listChildren.filter((t) => !e.includes(t)).forEach((e) => e.removeAttribute("slot")), this.listChildren = e, this.removeAttribute(o));
+				e.length === this.listChildren.length && this.listChildren.every((t, n) => e[n] === t) || (this.listChildren.filter((t) => !e.includes(t)).forEach((e) => e.removeAttribute("slot")), this.listChildren = e, this.removeAttribute(s));
 			});
 		}
 		static {
-			let t = typeof Symbol == "function" && Symbol.metadata ? Object.create(l[Symbol.metadata] ?? null) : void 0;
-			u = [i()], e(this, null, u, {
+			let t = typeof Symbol == "function" && Symbol.metadata ? Object.create(u[Symbol.metadata] ?? null) : void 0;
+			d = [i()], e(this, null, d, {
 				kind: "accessor",
 				name: "listChildren",
 				static: !1,
@@ -27,7 +27,7 @@ var o = "data-ssr-child-count", s = "li", c = (c) => (() => {
 					}
 				},
 				metadata: t
-			}, d, f), t && Object.defineProperty(this, Symbol.metadata, {
+			}, f, p), t && Object.defineProperty(this, Symbol.metadata, {
 				enumerable: !0,
 				configurable: !0,
 				writable: !0,
@@ -38,7 +38,7 @@ var o = "data-ssr-child-count", s = "li", c = (c) => (() => {
 			this.elementDependencies = [];
 		}
 		static {
-			this.styles = [a];
+			this.styles = [a, o];
 		}
 		#e;
 		get listChildren() {
@@ -54,7 +54,7 @@ var o = "data-ssr-child-count", s = "li", c = (c) => (() => {
 			super.disconnectedCallback(), this.shadowRoot?.removeEventListener("slotchange", this._handleSlotchange);
 		}
 		updated(e) {
-			super.updated(e), e.has("listChildren") && this.listChildren.forEach((e, t) => e.setAttribute("slot", `${s}-${t}`));
+			super.updated(e), e.has("listChildren") && this.listChildren.forEach((e, t) => e.setAttribute("slot", `${c}-${t}`));
 		}
 		renderList(e = {}, t = {}) {
 			let i = this.listSlotEntries(t);
@@ -78,8 +78,8 @@ var o = "data-ssr-child-count", s = "li", c = (c) => (() => {
           ${this.renderHiddenSlot()} ` : this.renderHiddenSlot();
 		}
 		listSlotEntries(e) {
-			return (this.listChildren.length ? this.listChildren : Array.from({ length: +(this.getAttribute(o) ?? 0) })).map((t, n) => ({
-				name: `${s}-${n}`,
+			return (this.listChildren.length ? this.listChildren : Array.from({ length: +(this.getAttribute(s) ?? 0) })).map((t, n) => ({
+				name: `${c}-${n}`,
 				ariaHidden: e?.localNameVisualOnly?.includes(t.localName) ?? !1
 			}));
 		}
@@ -89,4 +89,4 @@ var o = "data-ssr-child-count", s = "li", c = (c) => (() => {
 	};
 })();
 //#endregion
-export { c as SbbNamedSlotListMixin };
+export { l as SbbNamedSlotListMixin };

package/core/styles/_index.scss

@@ -3,22 +3,11 @@
 
 @forward './mixins/a11y';
 @forward './mixins/animation';
-@forward './mixins/badge';
-@forward './mixins/buttons';
-@forward './mixins/card';
 @forward './mixins/font-face';
 @forward './mixins/helpers';
-@forward './mixins/image';
-@forward './mixins/inputs';
 @forward './mixins/layout';
-@forward './mixins/link';
 @forward './mixins/lists';
-@forward './mixins/panel';
 @forward './mixins/pearl-chain-bullet';
-@forward './mixins/popover';
+@forward './mixins/reset';
 @forward './mixins/scrollbar';
-@forward './mixins/table';
 @forward './mixins/typo';
-
-// Internals
-@forward './mixins/dev_and_debug';

package/core/styles/_theme.scss

@@ -0,0 +1,16 @@
+$theme: 'standard' !default;
+
+@use './_index' as sbb;
+
+@use './features/normalize';
+@use './features/core' with (
+  $theme: $theme
+);
+@use './features/a11y';
+@use './features/animation';
+@use './features/color-scheme';
+@use './features/image';
+@use './features/layout';
+@use './features/lists';
+@use './features/scrollbar';
+@use './features/typography';

package/core/styles/core/functions.scss

@@ -8,14 +8,6 @@
   @return ((math.div($size, 16)) * 1rem);
 }
 
-@function theme-select($theme-values, $theme) {
-  @if map.has-key($theme-values, $theme) {
-    @return map.get($theme-values, $theme);
-  } @else {
-    @return map.get($theme-values, 'standard');
-  }
-}
-
 @function theme-pattern-select($theme-values, $theme) {
   @each $sub-theme, $value in $theme-values {
     @if string.index($theme, $sub-theme) {

package/core/styles/{a11y.scss → features/a11y.scss}

@@ -1,5 +1,5 @@
-@use './mixins/a11y';
-@use './screen-reader-only';
+@use '../mixins/a11y';
+@use '../internals/screen-reader-only';
 
 :is(.sbb-focus-outline, .sbb-focus-outline-dark):focus-visible {
   @include a11y.focus-outline;

package/core/styles/{animation.scss → features/animation.scss}

@@ -1,4 +1,4 @@
-@use './mixins/animation';
+@use '../mixins/animation';
 
 .sbb-disable-animation {
   @include animation.disable-animation;

package/core/styles/features/color-scheme.scss

@@ -0,0 +1,11 @@
+.sbb-dark {
+  color-scheme: dark;
+}
+
+.sbb-light {
+  color-scheme: light;
+}
+
+.sbb-light-dark {
+  color-scheme: light dark;
+}