@meshmakers/octo-ui 3.3.610 → 3.3.620

package/lib/runtime-browser/styles/_kendo-theme.scss

@@ -1,224 +0,0 @@
-// ============================================================================
-// RUNTIME BROWSER - Kendo Theme Integration (optional)
-// Import this ONLY when your app does NOT already import a Kendo theme.
-// When Kendo is already imported, use _index.scss (base) - it applies
-// CSS variable overrides that work with the host's Kendo theme.
-// ============================================================================
-
-@use "sass:map";
-@use "variables" as vars;
-
-// Slim Kendo theme: import only modules needed for runtime-browser components
-@use "@progress/kendo-theme-material/scss/core/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/typography/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/icons/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/messagebox/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/draggable/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/list/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/listgroup/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/action-buttons/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/overlay/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/popup/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/ripple/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/table/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/virtual-scroller/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/no-data/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/suggestion/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/bubble/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/column-menu/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/badge/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/chip/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/loader/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/skeleton/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/tooltip/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/forms/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/validator/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/floating-label/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/button/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/input/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/textbox/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/textarea/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/checkbox/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/listbox/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/progressbar/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/radio/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/calendar/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/timeselector/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/autocomplete/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/dateinput/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/datepicker/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/timepicker/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/datetimepicker/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/dropdownlist/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/multiselect/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/numerictextbox/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/upload/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/dropzone/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/menu/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/toolbar/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/window/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/dialog/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/drawer/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/notification/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/pager/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/tabstrip/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/treeview/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/card/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/expansion-panel/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/splitter/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/tilelayout/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/gridlayout/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/stacklayout/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/adaptive/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/grid/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/filter/_index.scss" as *;
-@use "@progress/kendo-theme-material/scss/utils/_index.scss" as *;
-
-// ----------------------------------------------------------------------------
-// KENDO THEME COLOR CONFIGURATION (LCARS palette)
-// ----------------------------------------------------------------------------
-$kendo-colors: map.merge(
-  $kendo-colors,
-  (
-    primary: var(--octo-mint),
-    surface: var(--iron-navy),
-    surface-alt: var(--surface-elevated),
-    app-surface: var(--deep-sea),
-    on-app-surface: var(--octo-text-color),
-    subtle: var(--ash-blue),
-  )
-);
-
-$kendo-colors: map.merge(
-  $kendo-colors,
-  k-generate-color-variations("base", vars.$ash-blue, "material")
-);
-$kendo-colors: map.merge(
-  $kendo-colors,
-  k-generate-color-variations("primary", vars.$octo-mint, "material")
-);
-$kendo-colors: map.merge(
-  $kendo-colors,
-  k-generate-color-variations("secondary", vars.$neo-cyan, "material")
-);
-$kendo-colors: map.merge(
-  $kendo-colors,
-  k-generate-color-variations("tertiary", vars.$toffee, "material")
-);
-$kendo-colors: map.merge(
-  $kendo-colors,
-  k-generate-color-variations("light", vars.$ash-blue, "material")
-);
-$kendo-colors: map.merge(
-  $kendo-colors,
-  k-generate-color-variations("dark", vars.$iron-navy, "material")
-);
-$kendo-colors: map.merge(
-  $kendo-colors,
-  k-generate-color-variations("inverse", vars.$kendo-inverse, "material")
-);
-$kendo-colors: map.merge(
-  $kendo-colors,
-  k-generate-color-variations("info", vars.$indigogo, "material")
-);
-$kendo-colors: map.merge(
-  $kendo-colors,
-  k-generate-color-variations("success", vars.$kendo-success, "material")
-);
-$kendo-colors: map.merge(
-  $kendo-colors,
-  k-generate-color-variations("warning", vars.$toffee, "material")
-);
-$kendo-colors: map.merge(
-  $kendo-colors,
-  k-generate-color-variations("error", vars.$bubblegum, "material")
-);
-
-$kendo-colors: map.merge(
-  $kendo-colors,
-  k-generate-color-variations("series-a", vars.$octo-mint, "material")
-);
-$kendo-colors: map.merge(
-  $kendo-colors,
-  k-generate-color-variations("series-b", vars.$neo-cyan, "material")
-);
-$kendo-colors: map.merge(
-  $kendo-colors,
-  k-generate-color-variations("series-c", vars.$lilac-glow, "material")
-);
-$kendo-colors: map.merge(
-  $kendo-colors,
-  k-generate-color-variations("series-d", vars.$royal-violet, "material")
-);
-$kendo-colors: map.merge(
-  $kendo-colors,
-  k-generate-color-variations("series-e", vars.$bubblegum, "material")
-);
-$kendo-colors: map.merge(
-  $kendo-colors,
-  k-generate-color-variations("series-f", vars.$toffee, "material")
-);
-
-// Include Kendo component styles
-@include core-styles();
-@include kendo-typography--styles();
-@include kendo-icon--styles();
-@include kendo-messagebox--styles();
-@include kendo-draggable--styles();
-@include kendo-list--styles();
-@include kendo-listgroup--styles();
-@include kendo-action-buttons--styles();
-@include kendo-overlay--styles();
-@include kendo-popup--styles();
-@include kendo-ripple--styles();
-@include kendo-table--styles();
-@include kendo-virtual-scroller--styles();
-@include kendo-no-data--styles();
-@include kendo-suggestion--styles();
-@include kendo-bubble--styles();
-@include kendo-column-menu--styles();
-@include kendo-badge--styles();
-@include kendo-chip--styles();
-@include kendo-loader--styles();
-@include kendo-skeleton--styles();
-@include kendo-tooltip--styles();
-@include kendo-form--styles();
-@include kendo-validator--styles();
-@include kendo-floating-label--styles();
-@include kendo-button--styles();
-@include kendo-input--styles();
-@include kendo-textbox--styles();
-@include kendo-textarea--styles();
-@include kendo-checkbox--styles();
-@include kendo-listbox--styles();
-@include kendo-progressbar--styles();
-@include kendo-radio--styles();
-@include kendo-calendar--styles();
-@include kendo-time-selector--styles();
-@include kendo-autocomplete--styles();
-@include kendo-date-input--styles();
-@include kendo-date-picker--styles();
-@include kendo-time-picker--styles();
-@include kendo-date-time-picker--styles();
-@include kendo-dropdown-list--styles();
-@include kendo-multiselect--styles();
-@include kendo-numeric-textbox--styles();
-@include kendo-upload--styles();
-@include kendo-dropzone--styles();
-@include kendo-menu--styles();
-@include kendo-toolbar--styles();
-@include kendo-window--styles();
-@include kendo-dialog--styles();
-@include kendo-drawer--styles();
-@include kendo-notification--styles();
-@include kendo-pager--styles();
-@include kendo-tabstrip--styles();
-@include kendo-treeview--styles();
-@include kendo-card--styles();
-@include kendo-expander--styles();
-@include kendo-splitter--styles();
-@include kendo-tile-layout--styles();
-@include kendo-grid-layout--styles();
-@include kendo-stack-layout--styles();
-@include kendo-grid--styles();
-@include kendo-filter--styles();

package/lib/runtime-browser/styles/_variables.scss

@@ -1,196 +0,0 @@
-// ============================================================================
-// RUNTIME BROWSER - Design Tokens (Kendo-independent)
-// LCARS-inspired theme variables. Use with Kendo when host imports Kendo theme.
-// ============================================================================
-
-// ----------------------------------------------------------------------------
-// LCARS DESIGN TOKENS - Brand color palette (SCSS variables for reuse)
-// ----------------------------------------------------------------------------
-$octo-mint: #8ca3a1;
-$neo-cyan: #7f97ad;
-$indigogo: #6e7f99;
-$toffee: #b8a184;
-$bubblegum: #b38f9f;
-$lilac-glow: #a3a0b6;
-$royal-violet: #8f85a8;
-$ash-blue: #9aa4b2;
-$iron-navy: #3b4657;
-$deep-sea: #1a2230;
-$surface-elevated: #243042;
-$octo-text-color: #ffffff;
-$lcars-border-color: #64ceb9;
-$pink: #ec658f;
-
-// Additional theme colors (used when Kendo theme is applied)
-$kendo-inverse: #3d3d3d;
-$kendo-success: #37b400;
-
-/// Applies CSS custom properties for the LCARS theme.
-/// Include this on :host or a container (e.g. .kendo-theme-provider).
-/// When Kendo is imported by the host, these variables override Kendo's defaults.
-@mixin variables {
-  // Typography
-  --lcars-font-primary: "Montserrat", "Roboto", "Helvetica Neue", sans-serif;
-  --lcars-font-mono: "Roboto Mono", "Consolas", monospace;
-  --lcars-border-color: #{$lcars-border-color};
-
-  --pink: #{$pink};
-
-  // Brand Colors as CSS Variables
-  --octo-mint: #{$octo-mint};
-  --neo-cyan: #{$neo-cyan};
-  --indigogo: #{$indigogo};
-  --toffee: #{$toffee};
-  --bubblegum: #{$bubblegum};
-  --lilac-glow: #{$lilac-glow};
-  --royal-violet: #{$royal-violet};
-  --ash-blue: #{$ash-blue};
-  --iron-navy: #{$iron-navy};
-  --deep-sea: #{$deep-sea};
-  --surface-elevated: #{$surface-elevated};
-  --octo-text-color: #{$octo-text-color};
-  --kendo-success: #{$kendo-success};
-
-  // Kendo variable overrides - applied when Kendo is imported by host
-  --kendo-color-primary: var(--octo-mint);
-  --kendo-color-primary-on-surface: var(--octo-mint);
-  --kendo-color-app-surface: var(--deep-sea);
-  --kendo-color-on-app-surface: var(--octo-text-color);
-  font-family: var(--lcars-font-primary);
-
-  // Derived colors for gradients/overlays (theme-aware)
-  --octo-mint-05: color-mix(in srgb, var(--octo-mint) 5%, transparent);
-  --octo-mint-03: color-mix(in srgb, var(--octo-mint) 3%, transparent);
-  --octo-mint-08: color-mix(in srgb, var(--octo-mint) 8%, transparent);
-  --octo-mint-10: color-mix(in srgb, var(--octo-mint) 10%, transparent);
-  --octo-mint-15: color-mix(in srgb, var(--octo-mint) 15%, transparent);
-  --octo-mint-20: color-mix(in srgb, var(--octo-mint) 20%, transparent);
-  --octo-mint-25: color-mix(in srgb, var(--octo-mint) 25%, transparent);
-  --octo-mint-30: color-mix(in srgb, var(--octo-mint) 30%, transparent);
-  --octo-mint-35: color-mix(in srgb, var(--octo-mint) 35%, transparent);
-  --octo-mint-40: color-mix(in srgb, var(--octo-mint) 40%, transparent);
-  --octo-mint-45: color-mix(in srgb, var(--octo-mint) 45%, transparent);
-  --octo-mint-50: color-mix(in srgb, var(--octo-mint) 50%, transparent);
-  --octo-mint-60: color-mix(in srgb, var(--octo-mint) 60%, transparent);
-  --octo-mint-80: color-mix(in srgb, var(--octo-mint) 80%, transparent);
-  --octo-mint-dark-10: color-mix(in srgb, var(--octo-mint), black 10%);
-  --octo-mint-light-5: color-mix(in srgb, var(--octo-mint), white 5%);
-  --octo-mint-light-10: color-mix(in srgb, var(--octo-mint), white 10%);
-
-  --bubblegum-05: color-mix(in srgb, var(--bubblegum) 5%, transparent);
-  --bubblegum-10: color-mix(in srgb, var(--bubblegum) 10%, transparent);
-  --bubblegum-15: color-mix(in srgb, var(--bubblegum) 15%, transparent);
-  --bubblegum-20: color-mix(in srgb, var(--bubblegum) 20%, transparent);
-  --bubblegum-30: color-mix(in srgb, var(--bubblegum) 30%, transparent);
-  --bubblegum-40: color-mix(in srgb, var(--bubblegum) 40%, transparent);
-  --bubblegum-50: color-mix(in srgb, var(--bubblegum) 50%, transparent);
-  --bubblegum-60: color-mix(in srgb, var(--bubblegum) 60%, transparent);
-
-  --toffee-15: color-mix(in srgb, var(--toffee) 15%, transparent);
-  --toffee-30: color-mix(in srgb, var(--toffee) 30%, transparent);
-  --toffee-40: color-mix(in srgb, var(--toffee) 40%, transparent);
-  --toffee-50: color-mix(in srgb, var(--toffee) 50%, transparent);
-
-  --royal-violet-15: color-mix(in srgb, var(--royal-violet) 15%, transparent);
-  --royal-violet-30: color-mix(in srgb, var(--royal-violet) 30%, transparent);
-  --royal-violet-40: color-mix(in srgb, var(--royal-violet) 40%, transparent);
-  --royal-violet-50: color-mix(in srgb, var(--royal-violet) 50%, transparent);
-  --royal-violet-light-20: color-mix(in srgb, var(--royal-violet), white 20%);
-
-  --neo-cyan-05: color-mix(in srgb, var(--neo-cyan) 5%, transparent);
-  --neo-cyan-10: color-mix(in srgb, var(--neo-cyan) 10%, transparent);
-  --neo-cyan-30: color-mix(in srgb, var(--neo-cyan) 30%, transparent);
-  --neo-cyan-40: color-mix(in srgb, var(--neo-cyan) 40%, transparent);
-  --neo-cyan-dark-10: color-mix(in srgb, var(--neo-cyan), black 10%);
-
-  --iron-navy-60: color-mix(in srgb, var(--iron-navy) 60%, transparent);
-  --iron-navy-80: color-mix(in srgb, var(--iron-navy) 80%, transparent);
-  --iron-navy-50: color-mix(in srgb, var(--iron-navy) 50%, transparent);
-  --iron-navy-70: color-mix(in srgb, var(--iron-navy) 70%, transparent);
-  --iron-navy-dark-5: color-mix(in srgb, var(--iron-navy), black 5%);
-
-  --deep-sea-40: color-mix(in srgb, var(--deep-sea) 40%, transparent);
-  --deep-sea-50: color-mix(in srgb, var(--deep-sea) 50%, transparent);
-  --deep-sea-60: color-mix(in srgb, var(--deep-sea) 60%, transparent);
-  --deep-sea-80: color-mix(in srgb, var(--deep-sea) 80%, transparent);
-  --deep-sea-90: color-mix(in srgb, var(--deep-sea) 90%, transparent);
-  --deep-sea-95: color-mix(in srgb, var(--deep-sea) 95%, transparent);
-
-  --ash-blue-10: color-mix(in srgb, var(--ash-blue) 10%, transparent);
-  --ash-blue-15: color-mix(in srgb, var(--ash-blue) 15%, transparent);
-  --ash-blue-20: color-mix(in srgb, var(--ash-blue) 20%, transparent);
-  --ash-blue-30: color-mix(in srgb, var(--ash-blue) 30%, transparent);
-  --ash-blue-50: color-mix(in srgb, var(--ash-blue) 50%, transparent);
-  --ash-blue-70: color-mix(in srgb, var(--ash-blue) 70%, transparent);
-  --ash-blue-80: color-mix(in srgb, var(--ash-blue) 80%, transparent);
-
-  --surface-elevated-40: color-mix(
-    in srgb,
-    var(--surface-elevated) 40%,
-    transparent
-  );
-  --surface-elevated-50: color-mix(
-    in srgb,
-    var(--surface-elevated) 50%,
-    transparent
-  );
-  --surface-elevated-90: color-mix(
-    in srgb,
-    var(--surface-elevated) 90%,
-    transparent
-  );
-  --surface-elevated-60: color-mix(
-    in srgb,
-    var(--surface-elevated) 60%,
-    transparent
-  );
-  --surface-elevated-80: color-mix(
-    in srgb,
-    var(--surface-elevated) 80%,
-    transparent
-  );
-
-  // LCARS-specific design tokens
-  --lcars-glow-primary: 0 0 10px var(--octo-mint-40);
-  --lcars-glow-cyan: 0 0 10px var(--neo-cyan-40);
-  --lcars-glow-violet: 0 0 10px var(--royal-violet-40);
-  --lcars-glow-pink: 0 0 10px var(--bubblegum-40);
-
-  // LCARS Border Radius (asymmetric is characteristic)
-  --lcars-radius-sm: 4px;
-  --lcars-radius-md: 8px;
-  --lcars-radius-lg: 16px;
-  --lcars-radius-xl: 24px;
-  --lcars-radius-pill: 50px;
-
-  // Panel styling
-  --lcars-panel-border: 1px solid var(--octo-mint-20);
-  --lcars-panel-bg: var(--surface-elevated-60);
-
-  // Transitions
-  --lcars-transition-fast: 150ms ease;
-  --lcars-transition-normal: 250ms ease;
-
-  // Designer/Symbol Editor Panel Variables (LCARS theme)
-  --designer-panel-bg: var(--surface-elevated);
-  --designer-panel-bg-elevated: var(--iron-navy);
-  --designer-panel-border: var(--octo-mint-20);
-  --designer-panel-text: var(--octo-text-color);
-  --designer-panel-text-secondary: var(--ash-blue);
-  --designer-panel-text-muted: color-mix(
-    in srgb,
-    var(--ash-blue) 70%,
-    transparent
-  );
-  --designer-panel-accent: var(--octo-mint);
-  --designer-panel-accent-hover-bg: var(--octo-mint-15);
-  --designer-panel-input-bg: var(--deep-sea);
-  --designer-panel-delete-hover-bg: var(--bubblegum-20);
-  --designer-panel-delete-color: var(--bubblegum);
-
-  // Cron Expression Cell Variables (LCARS theme for list view)
-  --mm-cron-code-bg: var(--deep-sea-80);
-  --mm-cron-code-text: var(--octo-mint);
-  --mm-cron-text-secondary: var(--ash-blue);
-  --mm-cron-success: var(--kendo-success);
-}

package/styles/_index.scss

@@ -1,3 +0,0 @@
-// Global Octo UI styles entrypoint.
-// Forward runtime-browser styles so consumers can configure theme variables.
-@forward "../lib/runtime-browser/styles/index";

package/styles/_with-kendo.scss

@@ -1,8 +0,0 @@
-// ============================================================================
-// RUNTIME BROWSER - Styles WITH Kendo Theme (for apps that don't import Kendo)
-// Use this entry point when your app does NOT already import a Kendo theme.
-// When Kendo is already imported, use _index.scss instead.
-// ============================================================================
-
-@use "../lib/runtime-browser/styles/kendo-theme";
-@forward "../lib/runtime-browser/styles/index";