@livenetworks/ashlar 2.0.7 → 2.0.9

package/theme/config/mixins/_index.scss

@@ -1,62 +1,62 @@
-// Mixins index — @forward all in correct order
-// Primitives first, composites after (they depend on primitives)
-
-// Primitives
-@forward 'spacing';
-@forward 'breakpoints';
-@forward 'display';
-@forward 'sizing';
-@forward 'typography';
-@forward 'colors';
-@forward 'borders';
-@forward 'shadows';
-@forward 'transitions';
-@forward 'motion';
-@forward 'position';
-@forward 'interaction';
-@forward 'focus';
-
-// Composites (depend on primitives)
-@forward 'layout';
-@forward 'collapsible';
-@forward 'accordion';
-@forward 'card';
-@forward 'chip';
-@forward 'nav';
-@forward 'btn';
-@forward 'form';
-@forward 'filter';
-@forward 'modal';
-@forward 'breadcrumbs';
-@forward 'loader';
-@forward 'tabs';
-@forward 'table';
-@forward 'sort';
-@forward 'avatar';
-@forward 'footer';
-@forward 'sidebar';
-@forward 'app-shell';
-@forward 'status-badge';
-@forward 'alert';
-@forward 'empty-state';
-@forward 'page-header';
-@forward 'stepper';
-@forward 'timeline';
-@forward 'stat-card';
-@forward 'prose';
-@forward 'editor';
-@forward 'kbd';
-@forward 'tooltip';
-@forward 'popover';
-@forward 'progress';
-@forward 'link';
-@forward 'circular-progress';
-@forward 'dropdown';
-@forward 'toast';
-@forward 'upload';
-@forward 'picklist';
-@forward 'translations';
-@forward 'ln-table';
-@forward 'chart';
-@forward 'ajax';
-@forward 'diagnostics';
+// Mixins index — @forward all in correct order
+// Primitives first, composites after (they depend on primitives)
+
+// Primitives
+@forward 'spacing';
+@forward 'breakpoints';
+@forward 'display';
+@forward 'sizing';
+@forward 'typography';
+@forward 'colors';
+@forward 'borders';
+@forward 'shadows';
+@forward 'transitions';
+@forward 'motion';
+@forward 'position';
+@forward 'interaction';
+@forward 'focus';
+
+// Composites (depend on primitives)
+@forward 'layout';
+@forward 'collapsible';
+@forward 'accordion';
+@forward 'card';
+@forward 'chip';
+@forward 'nav';
+@forward 'btn';
+@forward 'form';
+@forward 'filter';
+@forward 'modal';
+@forward 'breadcrumbs';
+@forward 'loader';
+@forward 'tabs';
+@forward 'table';
+@forward 'sort';
+@forward 'avatar';
+@forward 'footer';
+@forward 'sidebar';
+@forward 'app-shell';
+@forward 'status-badge';
+@forward 'alert';
+@forward 'empty-state';
+@forward 'page-header';
+@forward 'stepper';
+@forward 'timeline';
+@forward 'stat-card';
+@forward 'prose';
+@forward 'editor';
+@forward 'kbd';
+@forward 'tooltip';
+@forward 'popover';
+@forward 'progress';
+@forward 'link';
+@forward 'circular-progress';
+@forward 'dropdown';
+@forward 'toast';
+@forward 'upload';
+@forward 'picklist';
+@forward 'translations';
+@forward 'ln-table';
+@forward 'chart';
+@forward 'ajax';
+@forward 'diagnostics';

package/theme/config/mixins/_picklist.scss

@@ -1,66 +1,66 @@
-@use 'layout' as *;
-@use 'form' as *;
-@use 'display' as *;
-@use 'borders' as *;
-@use 'focus' as *;
-@use 'interaction' as *;
-
-// ─── Picklist ──────────────────────────────────────────────────
-// Two lists side by side: available on the left, selected on the
-// right. Checking an item moves it across (ln-picklist), so both
-// lists look the same — a vertical stack of checkbox pills.
-//
-// Structure:
-//   [data-ln-picklist]
-//     > *                              a pane (author's own markup)
-//       > ul[data-ln-picklist-list]    the items
-//         > li > label > input         one checkbox pill
-//
-// Deliberately `check-list-outline`, NOT `check-list`: @mixin pill
-// hides the input with `display: none`, which drops the checkbox out
-// of the tab order — and here the checkbox IS the control, not a
-// decorative marker. `pill-outline` keeps it visible and focusable.
-//
-// Usage:
-//   [data-ln-picklist] { @include picklist; }
-
-@mixin picklist {
-	@include grid-2;
-	--gap: var(--size-md);
-
-	[data-ln-picklist-list] {
-		@include check-list-outline;
-		@include flex-col;
-		@include border;
-
-		// pill-outline draws a border per item; this keeps them apart.
-		--row-gap: var(--size-2xs);
-		gap: var(--row-gap);
-
-		border-radius: var(--radius);
-		--padding-y: var(--size-xs);
-		--padding-x: var(--size-xs);
-		padding: var(--padding-y) var(--padding-x);
-
-		// A hundred items must not stretch the page.
-		--max-height: 20rem;
-		max-height: var(--max-height);
-		overflow-y: auto;
-	}
-
-	// The input stays visible (pill-outline reverts pill's display:none),
-	// so the ring belongs on the pill that surrounds it.
-	[data-ln-picklist-list] li label:has(> input:focus-visible) {
-		@include focus-ring;
-	}
-
-	// The component's own state, expressed as the attribute value it writes.
-	&[data-ln-picklist="disabled"] [data-ln-picklist-list] {
-		--color-fg: var(--fg-muted);
-		color: var(--color-fg);
-
-		li label {
-			@include cursor-not-allowed;
-		}
-	}
-}
+@use 'layout' as *;
+@use 'form' as *;
+@use 'display' as *;
+@use 'borders' as *;
+@use 'focus' as *;
+@use 'interaction' as *;
+
+// ─── Picklist ──────────────────────────────────────────────────
+// Two lists side by side: available on the left, selected on the
+// right. Checking an item moves it across (ln-picklist), so both
+// lists look the same — a vertical stack of checkbox pills.
+//
+// Structure:
+//   [data-ln-picklist]
+//     > *                              a pane (author's own markup)
+//       > ul[data-ln-picklist-list]    the items
+//         > li > label > input         one checkbox pill
+//
+// Deliberately `check-list-outline`, NOT `check-list`: @mixin pill
+// hides the input with `display: none`, which drops the checkbox out
+// of the tab order — and here the checkbox IS the control, not a
+// decorative marker. `pill-outline` keeps it visible and focusable.
+//
+// Usage:
+//   [data-ln-picklist] { @include picklist; }
+
+@mixin picklist {
+	@include grid-2;
+	--gap: var(--size-md);
+
+	[data-ln-picklist-list] {
+		@include check-list-outline;
+		@include flex-col;
+		@include border;
+
+		// pill-outline draws a border per item; this keeps them apart.
+		--row-gap: var(--size-2xs);
+		gap: var(--row-gap);
+
+		border-radius: var(--radius);
+		--padding-y: var(--size-xs);
+		--padding-x: var(--size-xs);
+		padding: var(--padding-y) var(--padding-x);
+
+		// A hundred items must not stretch the page.
+		--max-height: 20rem;
+		max-height: var(--max-height);
+		overflow-y: auto;
+	}
+
+	// The input stays visible (pill-outline reverts pill's display:none),
+	// so the ring belongs on the pill that surrounds it.
+	[data-ln-picklist-list] li label:has(> input:focus-visible) {
+		@include focus-ring;
+	}
+
+	// The component's own state, expressed as the attribute value it writes.
+	&[data-ln-picklist="disabled"] [data-ln-picklist-list] {
+		--color-fg: var(--fg-muted);
+		color: var(--color-fg);
+
+		li label {
+			@include cursor-not-allowed;
+		}
+	}
+}

package/theme/ln-ashlar-dev.scss

@@ -1,66 +1,66 @@
-// ==========================================================================
-// Dev & Validation Diagnostics — ln-ashlar
-// ==========================================================================
-// This stylesheet contains diagnostic CSS tools to validate correct HTML 
-// structure, missing integration attributes, and accessibility warnings during 
-// development. Do not compile or deploy this file to production.
-// ==========================================================================
-
-@use 'config/mixins' as *;
-
-// --- Modular Component Diagnostics ---
-@use '../components/ln-accordion/ln-accordion-dev';
-@use '../components/ln-ajax/ln-ajax-dev';
-@use '../components/ln-autoresize/ln-autoresize-dev';
-@use '../components/ln-autosave/ln-autosave-dev';
-@use '../components/ln-chart/ln-chart-dev';
-@use '../components/ln-circular-progress/ln-circular-progress-dev';
-@use '../components/ln-confirm/ln-confirm-dev';
-@use '../components/ln-data-coordinator/ln-data-coordinator-dev';
-@use '../components/ln-data-store/ln-data-store-dev';
-@use '../components/ln-date/ln-date-dev';
-@use '../components/ln-dropdown/ln-dropdown-dev';
-@use '../components/ln-editor/ln-editor-dev';
-@use '../components/ln-filter/ln-filter-dev';
-@use '../components/ln-form/ln-form-dev';
-@use '../components/ln-include/ln-include-dev';
-@use '../components/ln-key/ln-key-dev';
-@use '../components/ln-link/ln-link-dev';
-@use '../components/ln-list/ln-list-dev';
-@use '../components/ln-modal/ln-modal-dev';
-@use '../components/ln-number/ln-number-dev';
-@use '../components/ln-options/ln-options-dev';
-@use '../components/ln-picklist/ln-picklist-dev';
-@use '../components/ln-popover/ln-popover-dev';
-@use '../components/ln-progress/ln-progress-dev';
-@use '../components/ln-router/ln-router-dev';
-@use '../components/ln-search/ln-search-dev';
-@use '../components/ln-slug/ln-slug-dev';
-@use '../components/ln-sort/ln-sort-dev';
-@use '../components/ln-sortable/ln-sortable-dev';
-@use '../components/ln-stat/ln-stat-dev';
-@use '../components/ln-table/ln-table-dev';
-@use '../components/ln-tabs/ln-tabs-dev';
-@use '../components/ln-time/ln-time-dev';
-@use '../components/ln-toast/ln-toast-dev';
-@use '../components/ln-toggle/ln-toggle-dev';
-@use '../components/ln-tooltip/ln-tooltip-dev';
-@use '../components/ln-translations/ln-translations-dev';
-@use '../components/ln-ui-coordinator/ln-ui-coordinator-dev';
-@use '../components/ln-upload/ln-upload-dev';
-@use '../components/ln-validate/ln-validate-dev';
-
-// --- General HTML/Accessibility Diagnostics ---
-[data-ln-debug] {
-	// 1. Image Missing Alt: accessibility warning
-	// Flags an <img> with NO alt attribute (empty alt="" is the valid decorative pattern and is intentionally NOT flagged)
-	img:not([alt]) {
-		@include dev-replaced-error;
-	}
-
-	// 2. Abbr Missing Title: accessibility warning
-	// Flags an <abbr> with no title — the abbreviation has no expansion and is meaningless to readers
-	abbr:not([title]) {
-		@include dev-inline-error("abbr is missing a title attribute");
-	}
-}
+// ==========================================================================
+// Dev & Validation Diagnostics — ln-ashlar
+// ==========================================================================
+// This stylesheet contains diagnostic CSS tools to validate correct HTML 
+// structure, missing integration attributes, and accessibility warnings during 
+// development. Do not compile or deploy this file to production.
+// ==========================================================================
+
+@use 'config/mixins' as *;
+
+// --- Modular Component Diagnostics ---
+@use '../components/ln-accordion/ln-accordion-dev';
+@use '../components/ln-ajax/ln-ajax-dev';
+@use '../components/ln-autoresize/ln-autoresize-dev';
+@use '../components/ln-autosave/ln-autosave-dev';
+@use '../components/ln-chart/ln-chart-dev';
+@use '../components/ln-circular-progress/ln-circular-progress-dev';
+@use '../components/ln-confirm/ln-confirm-dev';
+@use '../components/ln-data-coordinator/ln-data-coordinator-dev';
+@use '../components/ln-data-store/ln-data-store-dev';
+@use '../components/ln-date/ln-date-dev';
+@use '../components/ln-dropdown/ln-dropdown-dev';
+@use '../components/ln-editor/ln-editor-dev';
+@use '../components/ln-filter/ln-filter-dev';
+@use '../components/ln-form/ln-form-dev';
+@use '../components/ln-include/ln-include-dev';
+@use '../components/ln-key/ln-key-dev';
+@use '../components/ln-link/ln-link-dev';
+@use '../components/ln-list/ln-list-dev';
+@use '../components/ln-modal/ln-modal-dev';
+@use '../components/ln-number/ln-number-dev';
+@use '../components/ln-options/ln-options-dev';
+@use '../components/ln-picklist/ln-picklist-dev';
+@use '../components/ln-popover/ln-popover-dev';
+@use '../components/ln-progress/ln-progress-dev';
+@use '../components/ln-router/ln-router-dev';
+@use '../components/ln-search/ln-search-dev';
+@use '../components/ln-slug/ln-slug-dev';
+@use '../components/ln-sort/ln-sort-dev';
+@use '../components/ln-sortable/ln-sortable-dev';
+@use '../components/ln-stat/ln-stat-dev';
+@use '../components/ln-table/ln-table-dev';
+@use '../components/ln-tabs/ln-tabs-dev';
+@use '../components/ln-time/ln-time-dev';
+@use '../components/ln-toast/ln-toast-dev';
+@use '../components/ln-toggle/ln-toggle-dev';
+@use '../components/ln-tooltip/ln-tooltip-dev';
+@use '../components/ln-translations/ln-translations-dev';
+@use '../components/ln-ui-coordinator/ln-ui-coordinator-dev';
+@use '../components/ln-upload/ln-upload-dev';
+@use '../components/ln-validate/ln-validate-dev';
+
+// --- General HTML/Accessibility Diagnostics ---
+[data-ln-debug] {
+	// 1. Image Missing Alt: accessibility warning
+	// Flags an <img> with NO alt attribute (empty alt="" is the valid decorative pattern and is intentionally NOT flagged)
+	img:not([alt]) {
+		@include dev-replaced-error;
+	}
+
+	// 2. Abbr Missing Title: accessibility warning
+	// Flags an <abbr> with no title — the abbreviation has no expansion and is meaningless to readers
+	abbr:not([title]) {
+		@include dev-inline-error("abbr is missing a title attribute");
+	}
+}

package/theme/ln-ashlar-landing.scss

@@ -1,56 +1,56 @@
-// ==========================================================================
-// ln-ashlar Landing & Presentation Stylesheet — Visual Design System
-// ==========================================================================
-// Modern, high-impact presentation design system for marketing web pages,
-// hero sections, bento grids, pricing tables, fluid display typography, and CTAs.
-// Retains 100% compatibility with ln-ashlar's orthogonal 3-axis architecture:
-//   data-mode  (light, dark, scoped islands)
-//   data-theme (ocean, sunset, midnight, glass, aurora, violet, cyber)
-//   data-skin  (default, glass, soft, outline)
-// ==========================================================================
-
-// 1. Core Functional Primitives
-@use 'ln-ashlar-core';
-
-// 2. Ashlar Configuration & Theming Engine
-@use 'config/tokens';
-@use 'config/breakpoints';
-@use 'config/density';
-@use 'config/theme';
-@use 'config/icons';
-
-// 3. Resets & Base Canvas
-@use 'base/reset';
-@use 'base/global';
-
-// 4. Presentation System Tokens & Components
-@use 'presentation/tokens' as *;
-@use 'presentation/typography';
-@use 'presentation/effects';
-@use 'presentation/layout';
-@use 'presentation/navbar';
-@use 'presentation/hero';
-@use 'presentation/features';
-@use 'presentation/bento';
-@use 'presentation/pricing';
-@use 'presentation/testimonials';
-@use 'presentation/stats';
-@use 'presentation/cta';
-@use 'presentation/footer';
-
-// 5. Ashlar Interactive Components (used on marketing pages)
-@use 'components/button';
-@use 'components/accordion';
-@use 'components/modal';
-@use 'components/tabs';
-@use 'components/toggle';
-@use 'components/tooltip';
-@use 'components/dropdown';
-@use 'components/popover';
-@use 'components/avatar';
-@use 'components/chip';
-@use 'components/status-badge';
-
-// 6. Utilities & Motion
-@use 'utilities/utilities';
-@use 'utilities/animations';
+// ==========================================================================
+// ln-ashlar Landing & Presentation Stylesheet — Visual Design System
+// ==========================================================================
+// Modern, high-impact presentation design system for marketing web pages,
+// hero sections, bento grids, pricing tables, fluid display typography, and CTAs.
+// Retains 100% compatibility with ln-ashlar's orthogonal 3-axis architecture:
+//   data-mode  (light, dark, scoped islands)
+//   data-theme (ocean, sunset, midnight, glass, aurora, violet, cyber)
+//   data-skin  (default, glass, soft, outline)
+// ==========================================================================
+
+// 1. Core Functional Primitives
+@use 'ln-ashlar-core';
+
+// 2. Ashlar Configuration & Theming Engine
+@use 'config/tokens';
+@use 'config/breakpoints';
+@use 'config/density';
+@use 'config/theme';
+@use 'config/icons';
+
+// 3. Resets & Base Canvas
+@use 'base/reset';
+@use 'base/global';
+
+// 4. Presentation System Tokens & Components
+@use 'presentation/tokens' as *;
+@use 'presentation/typography';
+@use 'presentation/effects';
+@use 'presentation/layout';
+@use 'presentation/navbar';
+@use 'presentation/hero';
+@use 'presentation/features';
+@use 'presentation/bento';
+@use 'presentation/pricing';
+@use 'presentation/testimonials';
+@use 'presentation/stats';
+@use 'presentation/cta';
+@use 'presentation/footer';
+
+// 5. Ashlar Interactive Components (used on marketing pages)
+@use 'components/button';
+@use 'components/accordion';
+@use 'components/modal';
+@use 'components/tabs';
+@use 'components/toggle';
+@use 'components/tooltip';
+@use 'components/dropdown';
+@use 'components/popover';
+@use 'components/avatar';
+@use 'components/chip';
+@use 'components/status-badge';
+
+// 6. Utilities & Motion
+@use 'utilities/utilities';
+@use 'utilities/animations';

package/theme/ln-ashlar-theme.scss

@@ -1,63 +1,63 @@
-// ==========================================================================
-// ln-ashlar Theme Stylesheet — Visual Design System
-// ==========================================================================
-// Contains design tokens, global resets, typography, and visual skin for components.
-// ==========================================================================
-
-@use 'config/tokens';
-@use 'config/breakpoints';
-@use 'config/density';
-@use 'config/theme';
-@use 'config/icons';
-
-@use 'base/reset';
-@use 'base/global';
-@use 'base/typography';
-
-@use 'components/button';
-@use 'components/form';
-@use 'components/date';
-@use 'components/layout';
-@use 'components/table';
-@use 'components/sort';
-@use 'components/tabs';
-@use 'components/toggle';
-@use 'components/accordion';
-@use 'components/card';
-@use 'components/sections';
-@use 'components/nav';
-@use 'components/sidebar';
-@use 'components/app-shell';
-@use 'components/breadcrumbs';
-@use 'components/avatar';
-@use 'components/status-badge';
-@use 'components/alert';
-@use 'components/empty-state';
-@use 'components/page-header';
-@use 'components/stepper';
-@use 'components/timeline';
-@use 'components/stat-card';
-@use 'components/prose';
-@use 'components/editor';
-@use 'components/scrollbar';
-@use 'components/tooltip';
-@use 'components/popover';
-@use 'components/filter';
-@use 'components/chip';
-@use 'components/loader';
-@use 'components/progress';
-@use 'components/link';
-@use 'components/confirm';
-@use 'components/circular-progress';
-@use 'components/modal';
-@use 'components/dropdown';
-@use 'components/toast';
-@use 'components/upload';
-@use 'components/picklist';
-@use 'components/translations';
-@use 'components/ln-table';
-@use 'components/chart';
-@use 'components/ajax';
-
-@use 'utilities/utilities';
-@use 'utilities/animations';
+// ==========================================================================
+// ln-ashlar Theme Stylesheet — Visual Design System
+// ==========================================================================
+// Contains design tokens, global resets, typography, and visual skin for components.
+// ==========================================================================
+
+@use 'config/tokens';
+@use 'config/breakpoints';
+@use 'config/density';
+@use 'config/theme';
+@use 'config/icons';
+
+@use 'base/reset';
+@use 'base/global';
+@use 'base/typography';
+
+@use 'components/button';
+@use 'components/form';
+@use 'components/date';
+@use 'components/layout';
+@use 'components/table';
+@use 'components/sort';
+@use 'components/tabs';
+@use 'components/toggle';
+@use 'components/accordion';
+@use 'components/card';
+@use 'components/sections';
+@use 'components/nav';
+@use 'components/sidebar';
+@use 'components/app-shell';
+@use 'components/breadcrumbs';
+@use 'components/avatar';
+@use 'components/status-badge';
+@use 'components/alert';
+@use 'components/empty-state';
+@use 'components/page-header';
+@use 'components/stepper';
+@use 'components/timeline';
+@use 'components/stat-card';
+@use 'components/prose';
+@use 'components/editor';
+@use 'components/scrollbar';
+@use 'components/tooltip';
+@use 'components/popover';
+@use 'components/filter';
+@use 'components/chip';
+@use 'components/loader';
+@use 'components/progress';
+@use 'components/link';
+@use 'components/confirm';
+@use 'components/circular-progress';
+@use 'components/modal';
+@use 'components/dropdown';
+@use 'components/toast';
+@use 'components/upload';
+@use 'components/picklist';
+@use 'components/translations';
+@use 'components/ln-table';
+@use 'components/chart';
+@use 'components/ajax';
+
+@use 'utilities/utilities';
+@use 'utilities/animations';