scb-wc 0.1.10 → 0.1.11

package/README.md

@@ -1,9 +1,6 @@
-# Om SCB Web Components Preview
+# Om SCB Web Components
 
-> ⚠️ **Previewkanal**  
-> Installera `scb-wc` via `@next` för komponenter under utveckling. API, utseende och beteende kan ändras eller tas bort mellan versioner.
-
-SCB Web Components(test) finns för att underlätta skapandet av enhetliga, tillgängliga och användbara webbapplikationer.
+SCB Web Components finns för att underlätta skapandet av enhetliga, tillgängliga och användbara webbapplikationer.
 
 Komponenterna bygger på:
 - [Lit](https://lit.dev/)
@@ -11,32 +8,45 @@ Komponenterna bygger på:
 
 ## Storybook och dokumentation (internt)
 
-Previewkomponenterna dokumenteras och demonstreras i Storybook på SCB:s interna testadress:
+Produktionskomponenterna dokumenteras och demonstreras i Storybook på SCB:s interna adress:
 
-- Test: <https://webcomponentstest.scb.intra>
+- Prod: https://webcomponents.scb.intra
 
-Den publika/stabila Storybooken finns på:
+Testkomponenterna finns på:
 
-- Prod: <https://webcomponents.scb.intra>
+- Test: https://webcomponentstest.scb.intra
 
 ---
 
 ## Kom igång
 
-> **Obs:** Kör alla kommandon i mappen där din `package.json` ligger.  
-> Har du ingen? Kör `npm init -y` i projektroten (eller annan lämplig mapp).
+Rekommenderad startväg:
+
+```sh
+npx scb-wc init html my-app
+npx scb-wc init react my-react-app
+npx scb-wc init blazor my-blazor-app
+```
+
+Det skapar en liten starterapp med:
+- `scb-header`
+- `scb-footer`
+- `scb-grid`
+- några vanliga komponenter
+
+Välj sedan den starter som ligger närmast din app och kör `npm install` i den nya mappen.
 
-Installera previewkanalen:
+Om du redan har en app med `package.json`, kör kommandon i den mappen och installera paketet:
 
 ```sh
-npm install scb-wc@next
+npm install scb-wc
 ```
 
 ---
 
 ## Alternativ 1: Använd som ES‑moduler (t.ex. i React, Vue, SPA)
 
-Importera CSS och de testkomponenter du använder (bäst för tree‑shaking):
+Importera CSS och de komponenter du använder (bäst för tree‑shaking):
 
 ```js
 // Global CSS + tokens (måste bara importeras en gång)
@@ -72,7 +82,7 @@ Då används paketets egna fontfiler under `node_modules/scb-wc/fonts/`.
 
 ## Alternativ 2: Använd i MVC/MPA via `<script type="module">`
 
-Det här läget använder den färdig‑splittade **MVC‑ESM**‑builden som följer med paketet under:
+Det här läget använder den färdig‑splittrade **MVC‑ESM**‑builden som följer med paketet under:
 
 ```text
 node_modules/scb-wc/mvc/
@@ -85,7 +95,7 @@ Lägg till i din apps `package.json`:
 ```jsonc
 {
   "scripts": {
-    "ui:install": "node -e \"const fs=require('fs'),p=require('path');const src=p.resolve('node_modules/scb-wc/mvc');if(!fs.existsSync(src)){console.error('Hittar inte '+src+'. Har du kört npm install scb-wc@next?');process.exit(1);}const start=process.env.INIT_CWD||process.cwd();const ov=process.env.npm_config_ui_wwwroot;function findBase(){if(ov){return p.isAbsolute(ov)?ov:p.resolve(start,ov);}let d=start;while(true){const cand=p.join(d,'wwwroot');if(fs.existsSync(cand)) return cand;const up=p.dirname(d);if(up===d) return p.resolve(start,'wwwroot');d=up;}}const base=findBase();const dst=p.resolve(base,'ui');fs.rmSync(dst,{recursive:true,force:true});fs.mkdirSync(base,{recursive:true});fs.cpSync(src,dst,{recursive:true});console.log('Kopierade '+src+' → '+dst);\""
+    "ui:install": "node -e \"const fs=require('fs'),p=require('path');const src=p.resolve('node_modules/scb-wc/mvc');if(!fs.existsSync(src)){console.error('Hittar inte '+src+'. Har du kört npm install scb-wc?');process.exit(1);}const start=process.env.INIT_CWD||process.cwd();const ov=process.env.npm_config_ui_wwwroot;function findBase(){if(ov){return p.isAbsolute(ov)?ov:p.resolve(start,ov);}let d=start;while(true){const cand=p.join(d,'wwwroot');if(fs.existsSync(cand)) return cand;const up=p.dirname(d);if(up===d) return p.resolve(start,'wwwroot');d=up;}}const base=findBase();const dst=p.resolve(base,'ui');fs.rmSync(dst,{recursive:true,force:true});fs.mkdirSync(base,{recursive:true});fs.cpSync(src,dst,{recursive:true});console.log('Kopierade '+src+' → '+dst);\""
   }
 }
 ```
@@ -132,7 +142,7 @@ Behöver du en annan webbrotsökväg (t.ex. om din `wwwroot` ligger någon annan
 
 ## Alternativ 3: Bundlad version (IIFE) för äldre miljöer
 
-Om ESM inte stöds kan du använda den bundlade test‑varianten från paketroten.  
+Om ESM inte stöds kan du använda den bundlade varianten från paketroten.  
 Flytta följande två filer från `node_modules/scb-wc` och använd dem i applikationen:
 
 ```text
@@ -154,7 +164,7 @@ node_modules/scb-wc/scb-wc.css
 
 SCB Web Components fungerar även i Blazor‑appar när du vill använda samma komponenter i både MVC/MPA och Blazor.
 
-Grundprincipen är samma som för `scb-wc`:
+Grundprincipen är:
 
 1. Använd MVC‑ESM‑builden (`node_modules/scb-wc/mvc`) och kopiera den till `wwwroot/ui` med `ui:install`.
 2. Ladda `scb-blazor-bridge.js` från `wwwroot/ui` i din Blazor‑layout.
@@ -167,8 +177,8 @@ Lägg till ett script som kopierar interop-filen från `node_modules` till ditt
 ```jsonc
 {
   "scripts": {
-    "ui:install": "node -e \"const fs=require('fs'),p=require('path');const src=p.resolve('node_modules/scb-wc/mvc');if(!fs.existsSync(src)){console.error('Hittar inte '+src+'. Har du kört npm install scb-wc@next?');process.exit(1);}const start=process.env.INIT_CWD||process.cwd();const ov=process.env.npm_config_ui_wwwroot;function findBase(){if(ov){return p.isAbsolute(ov)?ov:p.resolve(start,ov);}let d=start;while(true){const cand=p.join(d,'wwwroot');if(fs.existsSync(cand)) return cand;const up=p.dirname(d);if(up===d) return p.resolve(start,'wwwroot');d=up;}}const base=findBase();const dst=p.resolve(base,'ui');fs.rmSync(dst,{recursive:true,force:true});fs.mkdirSync(base,{recursive:true});fs.cpSync(src,dst,{recursive:true});console.log('Kopierade '+src+' → '+dst);\"",
-    "ui:blazor:interop": "node -e \"const fs=require('fs'),p=require('path');const start=process.env.INIT_CWD||process.cwd();const src=p.resolve('node_modules/scb-wc/blazor/ScbBlazorInteropBase.cs');if(!fs.existsSync(src)){console.error('Hittar inte '+src+'. Har du kört npm install scb-wc@next?');process.exit(1);}const dst=p.resolve(start,'ScbBlazor/ScbBlazorInteropBase.cs');fs.mkdirSync(p.dirname(dst),{recursive:true});fs.copyFileSync(src,dst);console.log('Kopierade '+src+' → '+dst);\""
+    "ui:install": "node -e \"const fs=require('fs'),p=require('path');const src=p.resolve('node_modules/scb-wc/mvc');if(!fs.existsSync(src)){console.error('Hittar inte '+src+'. Har du kört npm install scb-wc?');process.exit(1);}const start=process.env.INIT_CWD||process.cwd();const ov=process.env.npm_config_ui_wwwroot;function findBase(){if(ov){return p.isAbsolute(ov)?ov:p.resolve(start,ov);}let d=start;while(true){const cand=p.join(d,'wwwroot');if(fs.existsSync(cand)) return cand;const up=p.dirname(d);if(up===d) return p.resolve(start,'wwwroot');d=up;}}const base=findBase();const dst=p.resolve(base,'ui');fs.rmSync(dst,{recursive:true,force:true});fs.mkdirSync(base,{recursive:true});fs.cpSync(src,dst,{recursive:true});console.log('Kopierade '+src+' → '+dst);\"",
+    "ui:blazor:interop": "node -e \"const fs=require('fs'),p=require('path');const start=process.env.INIT_CWD||process.cwd();const src=p.resolve('node_modules/scb-wc/blazor/ScbBlazorInteropBase.cs');if(!fs.existsSync(src)){console.error('Hittar inte '+src+'. Har du kört npm install scb-wc?');process.exit(1);}const dst=p.resolve(start,'ScbBlazor/ScbBlazorInteropBase.cs');fs.mkdirSync(p.dirname(dst),{recursive:true});fs.copyFileSync(src,dst);console.log('Kopierade '+src+' → '+dst);\""
   }
 }
 ```
@@ -182,13 +192,13 @@ Exempel på layout:
 <script type="module" src="~/ui/scb-blazor-bridge.js"></script>
 ```
 
-`ScbBlazorInteropBase` är samma bas‑klass i preview- och public-kanalen. Du kan därför dela samma C#‑fil mellan projekt som använder `scb-wc@next` och `scb-wc@latest`.
+`ScbBlazorInteropBase` kan återanvändas mellan projekt som använder både `scb-wc@latest` och `scb-wc@next`.
 
 ---
 
 ## Viktigt
 
-- `scb-wc@next` är **previewkanalen**. Komponenter kan ändras eller tas bort mellan versioner. Använd `scb-wc@latest` i externa produktionsmiljöer.  
+- `scb-wc@latest` är produktionskanalen. Använd `scb-wc@next` för komponenter under utveckling och experiment.  
 - **Kör kommandon i mappen med din `package.json`.** Placeringen av `package.json` styr standardmål för `ui:install` (rot → `wwwroot/ui`, `ClientApp/` → använd `--ui_wwwroot=../wwwroot`).  
 - **Blanda inte MVC‑ESM och IIFE på samma sida.** Välj en distributionsform per sida/app.  
 - **Blazor:** Se till att `scb-blazor-bridge.js` laddas efter att komponent‑JS:et finns på sidan, och att `ScbBlazorInteropBase` inte dupliceras i flera namespaces i samma lösning.

package/index.js

@@ -1,91 +1,88 @@
-import { ScbChevron as e } from "./scb-chevron/scb-chevron.js";
-import { ScbAccordionItem as t } from "./scb-accordion/scb-accordion-item.js";
-import { ScbButton as n } from "./scb-button/scb-button.js";
-import { ScbAccordion as r } from "./scb-accordion/scb-accordion.js";
-import { ScbIconButton as i } from "./scb-icon-button/scb-icon-button.js";
-import { ScbListItem as a } from "./scb-list/scb-list-item.js";
-import { ScbList as o } from "./scb-list/scb-list.js";
-import { ScbSearch as s } from "./scb-search/scb-search.js";
-import { ScbAvatar as c } from "./scb-avatar/scb-avatar.js";
-import { ScbAppBar as l } from "./scb-app-bar/scb-app-bar.js";
-import { ScbBadge as u } from "./scb-badge/scb-badge.js";
-import { ScbLink as d } from "./scb-link/scb-link.js";
-import { SCBBreadcrumbItem as f } from "./scb-breadcrumb/scb-breadcrumb-item.js";
-import { SCBBreadcrumb as p } from "./scb-breadcrumb/scb-breadcrumb.js";
-import { ScbCalendarEvent as m } from "./scb-calendar/scb-calendar-event.js";
-import { ScbDivider as h } from "./scb-divider/scb-divider.js";
-import { ScbDatepicker as g } from "./scb-datepicker/scb-datepicker.js";
-import { ScbTextField as _ } from "./scb-textfield/scb-textfield.js";
-import { ScbCheckboxGroup as v } from "./scb-checkbox/scb-checkbox-group.js";
-import { ScbCheckbox as y } from "./scb-checkbox/scb-checkbox.js";
-import { ScbRadioGroup as b } from "./scb-radio-button/scb-radio-group.js";
-import { ScbRadioButton as x } from "./scb-radio-button/scb-radio-button.js";
-import { ScbSwitch as S } from "./scb-switch/scb-switch.js";
-import { ScbChip as C } from "./scb-chip/scb-chip.js";
-import { ScbDialog as w } from "./scb-dialog/scb-dialog.js";
-import { ScbCalendar as T } from "./scb-calendar/scb-calendar.js";
-import { ScbCalendarCard as E } from "./scb-calendar-card/scb-calendar-card.js";
-import { ScbTooltip as D } from "./scb-tooltip/scb-tooltip.js";
-import { ScbVignette as O } from "./scb-vignette/scb-vignette.js";
-import { ScbCard as k } from "./scb-card/scb-card.js";
-import { ScbCollapse as A } from "./scb-collapse/scb-collapse.js";
-import { ScbCookiesConsent as j } from "./scb-cookies-consent/scb-cookies-consent.js";
-import { ScbDrawer as M } from "./scb-drawer/scb-drawer.js";
-import { ScbDropZone as N } from "./scb-drop-zone/scb-drop-zone.js";
-import { ScbOptionsMenuItem as P } from "./scb-options-menu/scb-options-menu-item.js";
-import { ScbOptionsSubMenu as F } from "./scb-options-menu/scb-options-sub-menu.js";
-import { ScbOptionsMenu as I } from "./scb-options-menu/scb-options-menu.js";
-import { ScbDropdown as L } from "./scb-dropdown/scb-dropdown.js";
-import { ScbFab as R } from "./scb-fab/scb-fab.js";
-import { ScbFactCardContent as z } from "./scb-fact-card/scb-fact-card-content.js";
-import { ScbFactCard as B } from "./scb-fact-card/scb-fact-card.js";
-import { ScbFooterSection as V } from "./scb-footer/scb-footer-section.js";
-import { ScbGridItem as H } from "./scb-grid/scb-grid-item.js";
-import { ScbStack as U } from "./scb-grid/scb-stack.js";
-import { ScbGrid as W } from "./scb-grid/scb-grid.js";
-import { ScbFooter as G } from "./scb-footer/scb-footer.js";
-import { ScbHorizontalScroller as K } from "./scb-horizontal-scroller/scb-horizontal-scroller.js";
-import { ScbOverlay as q } from "./scb-overlay/scb-overlay.js";
-import { ScbGalleryGrid as J } from "./scb-gallery-grid/scb-gallery-grid.js";
-import { ScbHeaderMenuGroup as Y } from "./scb-header/scb-header-menu-group.js";
-import { ScbHeaderMenuItem as X } from "./scb-header/scb-header-menu-item.js";
-import { ScbHeaderTab as Z } from "./scb-header/scb-header-tab.js";
-import { ScbHeaderUtility as Q } from "./scb-header/scb-header-utility.js";
-import { ScbMenuItem as $ } from "./scb-menu/scb-menu-item.js";
-import { ScbmenuSection as ee } from "./scb-menu/scb-menu-section.js";
-import { ScbSubmenu as te } from "./scb-menu/scb-sub-menu.js";
-import { ScbMenu as ne } from "./scb-menu/scb-menu.js";
-import { ScbSkeleton as re } from "./scb-skeleton/scb-skeleton.js";
-import { ScbHeader as ie } from "./scb-header/scb-header.js";
-import { ScbKeyFigureCard as ae } from "./scb-keyfigure-card/scb-keyfigure-card.js";
-import { ScbNavItem as oe } from "./scb-nav/scb-nav-item.js";
-import { ScbNav as se } from "./scb-nav/scb-nav.js";
-import { ScbNotificationCard as ce } from "./scb-notification-card/scb-notification-card.js";
-import { ScbPagination as le } from "./scb-pagination/scb-pagination.js";
-import { ScbProgressIndicator as ue } from "./scb-progress-indicator/scb-progress-indicator.js";
-import { ScbProgressStep as de } from "./scb-progress-stepper/scb-progress-step.js";
-import { ScbProgressStepper as fe } from "./scb-progress-stepper/scb-progress-stepper.js";
-import { ScbScrollspy as pe } from "./scb-scrollspy/scb-scrollspy.js";
-import { ScbSegmentedItem as me } from "./scb-segmented-button/scb-segmented-item.js";
-import { ScbSegmentedButton as he } from "./scb-segmented-button/scb-segmented-button.js";
-import { ScbSelectOption as ge } from "./scb-select/scb-select-option.js";
-import { ScbSelect as _e } from "./scb-select/scb-select.js";
-import { ScbSlider as ve } from "./scb-slider/scb-slider.js";
-import { ScbSnackbar as ye } from "./scb-snackbar/scb-snackbar.js";
-import { ScbStatusPill as be } from "./scb-status-pill/scb-status-pill.js";
-import { ScbStep as xe } from "./scb-stepper/scb-step.js";
-import { ScbStepper as Se } from "./scb-stepper/scb-stepper.js";
-import { ScbTable as Ce } from "./scb-table/scb-table.js";
-import { ScbTableAdvanced as we } from "./scb-table-advanced/scb-table-advanced.js";
-import { ScbPrimaryTab as Te } from "./scb-tabs/scb-primary-tab.js";
-import { ScbSecondaryTab as Ee } from "./scb-tabs/scb-secondary-tab.js";
-import { ScbTabs as De } from "./scb-tabs/scb-tabs.js";
-import { ScbTocItem as Oe } from "./scb-toc/scb-toc-item.js";
-import { ScbToc as ke } from "./scb-toc/scb-toc.js";
-import { buildScbVizExportFileName as Ae, createScbVizCsvBlob as je, createScbVizRasterBlobFromElement as Me, createScbVizRasterDataUrlFromElement as Ne, downloadScbVizBlob as Pe, getScbVizCurrentFullscreenElement as Fe, getScbVizExportBaseFileName as Ie, getScbVizFullscreenDocument as Le, isScbVizFullscreenSupported as Re, openScbVizPrintFrame as ze, runWithScbVizForcedPrintLightMode as Be, toggleScbVizFullscreen as Ve } from "./scb-viz/scb-viz-actions-runtime.js";
-import { buildScbVizPrintDocumentHtml as He, buildScbVizPrintableFooterHtml as Ue, buildScbVizPrintableTableHtml as We } from "./scb-viz/scb-viz-print-runtime.js";
-import { appendScbVizSeriesDifferentiationPatternMarks as Ge, getScbVizSeriesDifferentiationPatternDefinition as Ke, getScbVizSeriesDifferentiationPatternKinds as qe, getScbVizSeriesDifferentiationRegistry as Je, getScbVizSeriesDifferentiationVariant as Ye, scbVizSeriesDifferentiationRegistry as Xe } from "./scb-viz/scb-viz-series-differentiation-registry.js";
-import { clearScbVizSeriesDifferentiationColorClass as Ze, clearScbVizSeriesDifferentiationMetadata as Qe, ensureScbVizGroupedSeriesDifferentiationStore as $e, ensureScbVizStyledModeSeriesPattern as et, getScbVizGroupedSeriesDifferentiationKey as tt, getScbVizGroupedSeriesDifferentiationVariant as nt, getScbVizGroupedSeriesDifferentiationVariantIndex as rt, getScbVizHighchartsColorClassName as it, getScbVizHighchartsSvgElement as at, getScbVizHighchartsSvgRoot as ot, getScbVizLegendSeriesDifferentiationTargets as st, getScbVizSeriesDifferentiationColorIndex as ct, getScbVizSeriesDifferentiationVariantByIndex as lt, isScbVizGroupedSeriesDifferentiationChart as ut, isScbVizHighchartsStyledMode as dt, setScbVizSeriesDifferentiationColorClass as ft, setScbVizSeriesDifferentiationMetadata as pt, shouldShowScbVizSeriesDifferentiationAction as mt, usesScbVizGroupedPointDifferentiation as ht } from "./scb-viz/scb-viz-series-differentiation-runtime.js";
-import { buildScbVizResolvedTableView as gt, createScbVizCsvRows as _t, inferScbVizTableAlignments as vt, normalizeScbVizRenderableCell as yt, readScbVizTableDataFromSlot as bt } from "./scb-viz/scb-viz-table-runtime.js";
-import { ScbViz as xt } from "./scb-viz/scb-viz.js";
-export { p as SCBBreadcrumb, f as SCBBreadcrumbItem, r as ScbAccordion, t as ScbAccordionItem, l as ScbAppBar, c as ScbAvatar, u as ScbBadge, n as ScbButton, T as ScbCalendar, E as ScbCalendarCard, m as ScbCalendarEvent, k as ScbCard, y as ScbCheckbox, v as ScbCheckboxGroup, e as ScbChevron, C as ScbChip, A as ScbCollapse, j as ScbCookiesConsent, g as ScbDatepicker, w as ScbDialog, h as ScbDivider, M as ScbDrawer, N as ScbDropZone, L as ScbDropdown, R as ScbFab, B as ScbFactCard, z as ScbFactCardContent, G as ScbFooter, V as ScbFooterSection, J as ScbGalleryGrid, W as ScbGrid, H as ScbGridItem, ie as ScbHeader, Y as ScbHeaderMenuGroup, X as ScbHeaderMenuItem, Z as ScbHeaderTab, Q as ScbHeaderUtility, K as ScbHorizontalScroller, i as ScbIconButton, ae as ScbKeyFigureCard, d as ScbLink, o as ScbList, a as ScbListItem, ne as ScbMenu, $ as ScbMenuItem, se as ScbNav, oe as ScbNavItem, ce as ScbNotificationCard, I as ScbOptionsMenu, P as ScbOptionsMenuItem, F as ScbOptionsSubMenu, q as ScbOverlay, le as ScbPagination, Te as ScbPrimaryTab, ue as ScbProgressIndicator, de as ScbProgressStep, fe as ScbProgressStepper, x as ScbRadioButton, b as ScbRadioGroup, pe as ScbScrollspy, s as ScbSearch, Ee as ScbSecondaryTab, he as ScbSegmentedButton, me as ScbSegmentedItem, _e as ScbSelect, ge as ScbSelectOption, re as ScbSkeleton, ve as ScbSlider, ye as ScbSnackbar, U as ScbStack, be as ScbStatusPill, xe as ScbStep, Se as ScbStepper, te as ScbSubmenu, S as ScbSwitch, Ce as ScbTable, we as ScbTableAdvanced, De as ScbTabs, _ as ScbTextField, ke as ScbToc, Oe as ScbTocItem, D as ScbTooltip, O as ScbVignette, xt as ScbViz, ee as ScbmenuSection, Ge as appendScbVizSeriesDifferentiationPatternMarks, Ae as buildScbVizExportFileName, He as buildScbVizPrintDocumentHtml, Ue as buildScbVizPrintableFooterHtml, We as buildScbVizPrintableTableHtml, gt as buildScbVizResolvedTableView, Ze as clearScbVizSeriesDifferentiationColorClass, Qe as clearScbVizSeriesDifferentiationMetadata, je as createScbVizCsvBlob, _t as createScbVizCsvRows, Me as createScbVizRasterBlobFromElement, Ne as createScbVizRasterDataUrlFromElement, Pe as downloadScbVizBlob, $e as ensureScbVizGroupedSeriesDifferentiationStore, et as ensureScbVizStyledModeSeriesPattern, Fe as getScbVizCurrentFullscreenElement, Ie as getScbVizExportBaseFileName, Le as getScbVizFullscreenDocument, tt as getScbVizGroupedSeriesDifferentiationKey, nt as getScbVizGroupedSeriesDifferentiationVariant, rt as getScbVizGroupedSeriesDifferentiationVariantIndex, it as getScbVizHighchartsColorClassName, at as getScbVizHighchartsSvgElement, ot as getScbVizHighchartsSvgRoot, st as getScbVizLegendSeriesDifferentiationTargets, ct as getScbVizSeriesDifferentiationColorIndex, Ke as getScbVizSeriesDifferentiationPatternDefinition, qe as getScbVizSeriesDifferentiationPatternKinds, Je as getScbVizSeriesDifferentiationRegistry, Ye as getScbVizSeriesDifferentiationVariant, lt as getScbVizSeriesDifferentiationVariantByIndex, vt as inferScbVizTableAlignments, Re as isScbVizFullscreenSupported, ut as isScbVizGroupedSeriesDifferentiationChart, dt as isScbVizHighchartsStyledMode, yt as normalizeScbVizRenderableCell, ze as openScbVizPrintFrame, bt as readScbVizTableDataFromSlot, Be as runWithScbVizForcedPrintLightMode, Xe as scbVizSeriesDifferentiationRegistry, ft as setScbVizSeriesDifferentiationColorClass, pt as setScbVizSeriesDifferentiationMetadata, mt as shouldShowScbVizSeriesDifferentiationAction, Ve as toggleScbVizFullscreen, ht as usesScbVizGroupedPointDifferentiation };
+import { ScbAccordionItem as e } from "./scb-accordion/scb-accordion-item.js";
+import { ScbButton as t } from "./scb-button/scb-button.js";
+import { ScbAccordion as n } from "./scb-accordion/scb-accordion.js";
+import { ScbIconButton as r } from "./scb-icon-button/scb-icon-button.js";
+import { ScbListItem as i } from "./scb-list/scb-list-item.js";
+import { ScbList as a } from "./scb-list/scb-list.js";
+import { ScbSearch as o } from "./scb-search/scb-search.js";
+import { ScbAvatar as s } from "./scb-avatar/scb-avatar.js";
+import { ScbAppBar as c } from "./scb-app-bar/scb-app-bar.js";
+import { ScbBadge as l } from "./scb-badge/scb-badge.js";
+import { ScbLink as u } from "./scb-link/scb-link.js";
+import { SCBBreadcrumbItem as d } from "./scb-breadcrumb/scb-breadcrumb-item.js";
+import { SCBBreadcrumb as f } from "./scb-breadcrumb/scb-breadcrumb.js";
+import { ScbCalendarEvent as p } from "./scb-calendar/scb-calendar-event.js";
+import { ScbDivider as m } from "./scb-divider/scb-divider.js";
+import { ScbTextField as h } from "./scb-textfield/scb-textfield.js";
+import { ScbCheckboxGroup as g } from "./scb-checkbox/scb-checkbox-group.js";
+import { ScbCheckbox as _ } from "./scb-checkbox/scb-checkbox.js";
+import { ScbRadioGroup as v } from "./scb-radio-button/scb-radio-group.js";
+import { ScbRadioButton as y } from "./scb-radio-button/scb-radio-button.js";
+import { ScbSwitch as b } from "./scb-switch/scb-switch.js";
+import { ScbChip as x } from "./scb-chip/scb-chip.js";
+import { ScbDialog as S } from "./scb-dialog/scb-dialog.js";
+import { ScbCalendar as C } from "./scb-calendar/scb-calendar.js";
+import { ScbCalendarCard as w } from "./scb-calendar-card/scb-calendar-card.js";
+import { ScbTooltip as T } from "./scb-tooltip/scb-tooltip.js";
+import { ScbCard as E } from "./scb-card/scb-card.js";
+import { ScbCollapse as D } from "./scb-collapse/scb-collapse.js";
+import { ScbCookiesConsent as O } from "./scb-cookies-consent/scb-cookies-consent.js";
+import { ScbDrawer as k } from "./scb-drawer/scb-drawer.js";
+import { ScbDropZone as A } from "./scb-drop-zone/scb-drop-zone.js";
+import { ScbOptionsMenuItem as j } from "./scb-options-menu/scb-options-menu-item.js";
+import { ScbOptionsSubMenu as M } from "./scb-options-menu/scb-options-sub-menu.js";
+import { ScbOptionsMenu as N } from "./scb-options-menu/scb-options-menu.js";
+import { ScbDropdown as P } from "./scb-dropdown/scb-dropdown.js";
+import { ScbFab as F } from "./scb-fab/scb-fab.js";
+import { ScbFactCardContent as I } from "./scb-fact-card/scb-fact-card-content.js";
+import { ScbFactCard as L } from "./scb-fact-card/scb-fact-card.js";
+import { ScbFooterSection as R } from "./scb-footer/scb-footer-section.js";
+import { ScbGridItem as z } from "./scb-grid/scb-grid-item.js";
+import { ScbStack as B } from "./scb-grid/scb-stack.js";
+import { ScbGrid as V } from "./scb-grid/scb-grid.js";
+import { ScbFooter as H } from "./scb-footer/scb-footer.js";
+import { ScbHorizontalScroller as U } from "./scb-horizontal-scroller/scb-horizontal-scroller.js";
+import { ScbOverlay as W } from "./scb-overlay/scb-overlay.js";
+import { ScbGalleryGrid as G } from "./scb-gallery-grid/scb-gallery-grid.js";
+import { ScbHeaderMenuGroup as K } from "./scb-header/scb-header-menu-group.js";
+import { ScbHeaderMenuItem as q } from "./scb-header/scb-header-menu-item.js";
+import { ScbHeaderTab as J } from "./scb-header/scb-header-tab.js";
+import { ScbHeaderUtility as Y } from "./scb-header/scb-header-utility.js";
+import { ScbMenuItem as X } from "./scb-menu/scb-menu-item.js";
+import { ScbmenuSection as Z } from "./scb-menu/scb-menu-section.js";
+import { ScbSubmenu as Q } from "./scb-menu/scb-sub-menu.js";
+import { ScbMenu as $ } from "./scb-menu/scb-menu.js";
+import { ScbSkeleton as ee } from "./scb-skeleton/scb-skeleton.js";
+import { ScbHeader as te } from "./scb-header/scb-header.js";
+import { ScbKeyFigureCard as ne } from "./scb-keyfigure-card/scb-keyfigure-card.js";
+import { ScbNavItem as re } from "./scb-nav/scb-nav-item.js";
+import { ScbNav as ie } from "./scb-nav/scb-nav.js";
+import { ScbNotificationCard as ae } from "./scb-notification-card/scb-notification-card.js";
+import { ScbPagination as oe } from "./scb-pagination/scb-pagination.js";
+import { ScbProgressIndicator as se } from "./scb-progress-indicator/scb-progress-indicator.js";
+import { ScbProgressStep as ce } from "./scb-progress-stepper/scb-progress-step.js";
+import { ScbProgressStepper as le } from "./scb-progress-stepper/scb-progress-stepper.js";
+import { ScbScrollspy as ue } from "./scb-scrollspy/scb-scrollspy.js";
+import { ScbSegmentedItem as de } from "./scb-segmented-button/scb-segmented-item.js";
+import { ScbSegmentedButton as fe } from "./scb-segmented-button/scb-segmented-button.js";
+import { ScbSelectOption as pe } from "./scb-select/scb-select-option.js";
+import { ScbSelect as me } from "./scb-select/scb-select.js";
+import { ScbSlider as he } from "./scb-slider/scb-slider.js";
+import { ScbSnackbar as ge } from "./scb-snackbar/scb-snackbar.js";
+import { ScbStatusPill as _e } from "./scb-status-pill/scb-status-pill.js";
+import { ScbStep as ve } from "./scb-stepper/scb-step.js";
+import { ScbStepper as ye } from "./scb-stepper/scb-stepper.js";
+import { ScbTable as be } from "./scb-table/scb-table.js";
+import { ScbTableAdvanced as xe } from "./scb-table-advanced/scb-table-advanced.js";
+import { ScbPrimaryTab as Se } from "./scb-tabs/scb-primary-tab.js";
+import { ScbSecondaryTab as Ce } from "./scb-tabs/scb-secondary-tab.js";
+import { ScbTabs as we } from "./scb-tabs/scb-tabs.js";
+import { ScbTocItem as Te } from "./scb-toc/scb-toc-item.js";
+import { ScbToc as Ee } from "./scb-toc/scb-toc.js";
+import { buildScbVizExportFileName as De, createScbVizCsvBlob as Oe, createScbVizRasterBlobFromElement as ke, createScbVizRasterDataUrlFromElement as Ae, downloadScbVizBlob as je, getScbVizCurrentFullscreenElement as Me, getScbVizExportBaseFileName as Ne, getScbVizFullscreenDocument as Pe, isScbVizFullscreenSupported as Fe, openScbVizPrintFrame as Ie, runWithScbVizForcedPrintLightMode as Le, toggleScbVizFullscreen as Re } from "./scb-viz/scb-viz-actions-runtime.js";
+import { buildScbVizPrintDocumentHtml as ze, buildScbVizPrintableFooterHtml as Be, buildScbVizPrintableTableHtml as Ve } from "./scb-viz/scb-viz-print-runtime.js";
+import { appendScbVizSeriesDifferentiationPatternMarks as He, getScbVizSeriesDifferentiationPatternDefinition as Ue, getScbVizSeriesDifferentiationPatternKinds as We, getScbVizSeriesDifferentiationRegistry as Ge, getScbVizSeriesDifferentiationVariant as Ke, scbVizSeriesDifferentiationRegistry as qe } from "./scb-viz/scb-viz-series-differentiation-registry.js";
+import { clearScbVizSeriesDifferentiationColorClass as Je, clearScbVizSeriesDifferentiationMetadata as Ye, ensureScbVizGroupedSeriesDifferentiationStore as Xe, ensureScbVizStyledModeSeriesPattern as Ze, getScbVizGroupedSeriesDifferentiationKey as Qe, getScbVizGroupedSeriesDifferentiationVariant as $e, getScbVizGroupedSeriesDifferentiationVariantIndex as et, getScbVizHighchartsColorClassName as tt, getScbVizHighchartsSvgElement as nt, getScbVizHighchartsSvgRoot as rt, getScbVizLegendSeriesDifferentiationTargets as it, getScbVizSeriesDifferentiationColorIndex as at, getScbVizSeriesDifferentiationVariantByIndex as ot, isScbVizGroupedSeriesDifferentiationChart as st, isScbVizHighchartsStyledMode as ct, setScbVizSeriesDifferentiationColorClass as lt, setScbVizSeriesDifferentiationMetadata as ut, shouldShowScbVizSeriesDifferentiationAction as dt, usesScbVizGroupedPointDifferentiation as ft } from "./scb-viz/scb-viz-series-differentiation-runtime.js";
+import { buildScbVizResolvedTableView as pt, createScbVizCsvRows as mt, inferScbVizTableAlignments as ht, normalizeScbVizRenderableCell as gt, readScbVizTableDataFromSlot as _t } from "./scb-viz/scb-viz-table-runtime.js";
+import { ScbViz as vt } from "./scb-viz/scb-viz.js";
+export { f as SCBBreadcrumb, d as SCBBreadcrumbItem, n as ScbAccordion, e as ScbAccordionItem, c as ScbAppBar, s as ScbAvatar, l as ScbBadge, t as ScbButton, C as ScbCalendar, w as ScbCalendarCard, p as ScbCalendarEvent, E as ScbCard, _ as ScbCheckbox, g as ScbCheckboxGroup, x as ScbChip, D as ScbCollapse, O as ScbCookiesConsent, S as ScbDialog, m as ScbDivider, k as ScbDrawer, A as ScbDropZone, P as ScbDropdown, F as ScbFab, L as ScbFactCard, I as ScbFactCardContent, H as ScbFooter, R as ScbFooterSection, G as ScbGalleryGrid, V as ScbGrid, z as ScbGridItem, te as ScbHeader, K as ScbHeaderMenuGroup, q as ScbHeaderMenuItem, J as ScbHeaderTab, Y as ScbHeaderUtility, U as ScbHorizontalScroller, r as ScbIconButton, ne as ScbKeyFigureCard, u as ScbLink, a as ScbList, i as ScbListItem, $ as ScbMenu, X as ScbMenuItem, ie as ScbNav, re as ScbNavItem, ae as ScbNotificationCard, N as ScbOptionsMenu, j as ScbOptionsMenuItem, M as ScbOptionsSubMenu, W as ScbOverlay, oe as ScbPagination, Se as ScbPrimaryTab, se as ScbProgressIndicator, ce as ScbProgressStep, le as ScbProgressStepper, y as ScbRadioButton, v as ScbRadioGroup, ue as ScbScrollspy, o as ScbSearch, Ce as ScbSecondaryTab, fe as ScbSegmentedButton, de as ScbSegmentedItem, me as ScbSelect, pe as ScbSelectOption, ee as ScbSkeleton, he as ScbSlider, ge as ScbSnackbar, B as ScbStack, _e as ScbStatusPill, ve as ScbStep, ye as ScbStepper, Q as ScbSubmenu, b as ScbSwitch, be as ScbTable, xe as ScbTableAdvanced, we as ScbTabs, h as ScbTextField, Ee as ScbToc, Te as ScbTocItem, T as ScbTooltip, vt as ScbViz, Z as ScbmenuSection, He as appendScbVizSeriesDifferentiationPatternMarks, De as buildScbVizExportFileName, ze as buildScbVizPrintDocumentHtml, Be as buildScbVizPrintableFooterHtml, Ve as buildScbVizPrintableTableHtml, pt as buildScbVizResolvedTableView, Je as clearScbVizSeriesDifferentiationColorClass, Ye as clearScbVizSeriesDifferentiationMetadata, Oe as createScbVizCsvBlob, mt as createScbVizCsvRows, ke as createScbVizRasterBlobFromElement, Ae as createScbVizRasterDataUrlFromElement, je as downloadScbVizBlob, Xe as ensureScbVizGroupedSeriesDifferentiationStore, Ze as ensureScbVizStyledModeSeriesPattern, Me as getScbVizCurrentFullscreenElement, Ne as getScbVizExportBaseFileName, Pe as getScbVizFullscreenDocument, Qe as getScbVizGroupedSeriesDifferentiationKey, $e as getScbVizGroupedSeriesDifferentiationVariant, et as getScbVizGroupedSeriesDifferentiationVariantIndex, tt as getScbVizHighchartsColorClassName, nt as getScbVizHighchartsSvgElement, rt as getScbVizHighchartsSvgRoot, it as getScbVizLegendSeriesDifferentiationTargets, at as getScbVizSeriesDifferentiationColorIndex, Ue as getScbVizSeriesDifferentiationPatternDefinition, We as getScbVizSeriesDifferentiationPatternKinds, Ge as getScbVizSeriesDifferentiationRegistry, Ke as getScbVizSeriesDifferentiationVariant, ot as getScbVizSeriesDifferentiationVariantByIndex, ht as inferScbVizTableAlignments, Fe as isScbVizFullscreenSupported, st as isScbVizGroupedSeriesDifferentiationChart, ct as isScbVizHighchartsStyledMode, gt as normalizeScbVizRenderableCell, Ie as openScbVizPrintFrame, _t as readScbVizTableDataFromSlot, Le as runWithScbVizForcedPrintLightMode, qe as scbVizSeriesDifferentiationRegistry, lt as setScbVizSeriesDifferentiationColorClass, ut as setScbVizSeriesDifferentiationMetadata, dt as shouldShowScbVizSeriesDifferentiationAction, Re as toggleScbVizFullscreen, ft as usesScbVizGroupedPointDifferentiation };

package/mvc/components/Users/peter/Documents/SCB.Material-latest-dev/src/scb-components/scb-accordion/scb-accordion-item.js

@@ -0,0 +1,211 @@
+import"../../../../../../../../vendor/vendor-material.js";import{_ as b,b as m,g as h,h as o,v as l,y as s}from"../../../../../../../../vendor/vendor.js";import"../../../../../../../../vendor/vendor-lit.js";import{t as r}from"../../../../../../../../vendor/decorate.js";import"../scb-chevron/scb-chevron.js";(function(){try{var g=typeof globalThis<"u"?globalThis:window;if(!g.__scb_ce_guard_installed__){g.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(i,e,v){try{customElements.get(i)||t(i,e,v)}catch(c){var n=String(c||"");if(n.indexOf("already been used")===-1&&n.indexOf("NotSupportedError")===-1)throw c}}}}catch{}})();var d,p,a=(d=class extends b{constructor(...t){super(...t),this.open=!1,this.title="",this.content="",this.overline="",this.supportingText="",this.leading=!1,this.leadingVariant="",this.leadingIcon="",this.imgHrefImage="",this.avatarLabel="",this.avatarAlt="",this.avatarVariant="icon",this.avatarSrc="",this.density=0,this._unique=p._uid(),this._ignoreNextNativeTitleAttrChange=!1,this._onSummaryClick=i=>{i.preventDefault();const e=!this.open;this.closest("scb-accordion")?.onItemToggled?.(this,e),this.setOpen(e)},this._onToggle=i=>{const e=i.currentTarget;e.open||(e.open=!0),this._applyInertByOpen()}}static _uid(){return globalThis.crypto?.randomUUID?.()??`${p._uidPrefix}-${++p._uidSeq}`}static get observedAttributes(){const t=super.observedAttributes||[];return t.includes("title")?t:[...t,"title"]}attributeChangedCallback(t,i,e){if(t==="title"&&this._ignoreNextNativeTitleAttrChange){this._ignoreNextNativeTitleAttrChange=!1;return}super.attributeChangedCallback(t,i,e),t==="title"&&e!==null&&(this._ignoreNextNativeTitleAttrChange=!0,this.removeAttribute("title"))}firstUpdated(){this._applyInertByOpen()}_applyInertByOpen(){const t=this.renderRoot.querySelector(".scb-accordion-bottom");t&&(this.open?(t.removeAttribute("inert"),t.setAttribute("aria-hidden","false")):(t.setAttribute("inert",""),t.setAttribute("aria-hidden","true")))}_onKeyDown(t){const i=this.closest("scb-accordion"),e=Array.from(i?.querySelectorAll("scb-accordion-item")||[]).map(c=>c.renderRoot.querySelector("details")?.querySelector(".scb-accordion-top")||null).filter(c=>!!c),v=t.currentTarget,n=e.indexOf(v);switch(t.key){case"ArrowDown":t.preventDefault(),n<e.length-1&&e[n+1].focus();break;case"ArrowUp":t.preventDefault(),n>0&&e[n-1].focus();break;case"Home":t.preventDefault(),e.length&&e[0].focus();break;case"End":t.preventDefault(),e.length&&e[e.length-1].focus();break}}setOpen(t){this.open=!!t;const i=this.renderRoot.querySelector("details");i&&!i.open&&(i.open=!0),this._applyInertByOpen()}updated(t){if(t.has("open")){const i=this.renderRoot.querySelector("details");i&&!i.open&&(i.open=!0),this._applyInertByOpen(),this.dispatchEvent(new CustomEvent("open-changed",{detail:{open:this.open,title:this.title},bubbles:!0,composed:!0}))}}render(){const t=`bottom-${this._unique}`,i=`header-${this._unique}`,e=this.leading?this.leadingVariant==="image"&&this.imgHrefImage?s`<img part="leading-image" class="img" src="${this.imgHrefImage}" alt="" />`:this.leadingVariant==="avatar"?s`
+              <scb-avatar
+                label=${this.avatarLabel}
+                alt=${this.avatarAlt}
+                src=${this.avatarVariant==="image"?this.avatarSrc:""}
+                size="medium"
+                shape="circular"
+                variant=${this.avatarVariant}
+              ></scb-avatar>
+            `:this.leadingVariant==="icon"?s`<md-icon>${this.leadingIcon}</md-icon>`:l:l;return s`
+      <details class="scb-accordion-item" open @toggle=${this._onToggle}>
+        <summary
+          id=${i}
+          class="scb-accordion-top"
+          aria-controls=${t}
+          @click=${this._onSummaryClick}
+          @keydown=${this._onKeyDown}
+        >
+          <md-ripple></md-ripple>
+
+          ${this.leading?s`<div class="leading">${e}</div>`:l}
+
+          <div class="texts">
+            ${this.overline?s`<div class="overline">${this.overline}</div>`:l}
+            <div class="title">${this.title}</div>
+            ${this.supportingText?s`<div class="supporting-text">${this.supportingText}</div>`:l}
+          </div>
+
+          <scb-chevron class="chevron" .open=${this.open}></scb-chevron>
+        </summary>
+
+        <div id=${t} class="scb-accordion-bottom" role="region" aria-labelledby=${i}>
+          <div class="bottom-inner">
+            <slot>${this.content}</slot>
+          </div>
+        </div>
+      </details>
+
+      <md-focus-ring for=${i} inward></md-focus-ring>
+    `}},p=d,d._uidPrefix=`uid-${Math.random().toString(36).slice(2)}`,d._uidSeq=0,d.styles=[m`
+      :host {
+        display: block;
+        position: relative;
+        --scb-accordion-hover-radius: var(--radius-none, 0px);
+        --scb-accordion-chevron-nudge-y: 3px;
+        --scb-accordion-motion-duration: 0.3s;
+        --scb-accordion-motion-easing: ease;
+        --scb-accordion-panel-padding-closed: var(--spacing-0, 0px);
+        --scb-accordion-interaction-bleed: max(var(--stroke-focus-ring, 3px), var(--spacing-2, 4px));
+
+        --scb-accordion-item-padding-inline: var(--spacing-5, 16px);
+        --scb-accordion-item-padding-block: var(--spacing-7, 24px);
+        --scb-accordion-item-gap: var(--spacing-5, 16px);
+
+        --scb-accordion-title-font-size: var(--md-sys-typescale-title-large-size);
+        --scb-accordion-title-line-height: var(--md-sys-typescale-title-large-line-height);
+        --scb-accordion-title-letter-spacing: var(--md-sys-typescale-title-large-tracking);
+
+        --scb-accordion-supporting-font-size: var(--md-sys-typescale-body-medium-size);
+        --scb-accordion-supporting-line-height: var(--md-sys-typescale-body-medium-line-height);
+        --scb-accordion-supporting-letter-spacing: var(--md-sys-typescale-body-medium-tracking);
+
+        --scb-accordion-leading-image-size: calc(var(--icon-size-extra-large, 36px) + var(--spacing-5, 16px));
+      }
+
+      :host-context(scb-accordion[size='medium']) {
+        --scb-accordion-item-padding-inline: var(--spacing-5, 16px);
+        --scb-accordion-item-padding-block: var(--spacing-6, 20px);
+        --scb-accordion-item-gap: var(--spacing-4, 12px);
+
+        --scb-accordion-title-font-size: var(--md-sys-typescale-title-medium-size);
+        --scb-accordion-title-line-height: var(--md-sys-typescale-title-medium-line-height);
+        --scb-accordion-title-letter-spacing: var(--md-sys-typescale-title-medium-tracking);
+
+        --scb-accordion-leading-image-size: calc(var(--icon-size-large, 30px) + var(--spacing-4, 12px));
+      }
+
+      :host-context(scb-accordion[size='small']) {
+        --scb-accordion-item-padding-inline: var(--spacing-4, 12px);
+        --scb-accordion-item-padding-block: var(--spacing-5, 16px);
+        --scb-accordion-item-gap: var(--spacing-3, 8px);
+
+        --scb-accordion-title-font-size: var(--md-sys-typescale-title-small-size);
+        --scb-accordion-title-line-height: var(--md-sys-typescale-title-small-line-height);
+        --scb-accordion-title-letter-spacing: var(--md-sys-typescale-title-small-tracking);
+
+        --scb-accordion-supporting-font-size: var(--md-sys-typescale-body-small-size);
+        --scb-accordion-supporting-line-height: var(--md-sys-typescale-body-small-line-height);
+        --scb-accordion-supporting-letter-spacing: var(--md-sys-typescale-body-small-tracking);
+
+        --scb-accordion-leading-image-size: calc(var(--icon-size-medium, 24px) + var(--spacing-4, 12px));
+      }
+
+      md-focus-ring {
+        position: absolute;
+        inset: 0;
+        pointer-events: none;
+        border-radius: var(--scb-accordion-focus-ring-radius, var(--md-sys-shape-corner-small, 8px));
+      }
+
+      .scb-accordion-item {
+        border-bottom: var(--stroke-border, 1px) solid var(--md-sys-color-outline-variant);
+        color: var(--md-sys-color-on-surface);
+        font-family: var(--brand-font);
+      }
+
+      /* Header */
+      .scb-accordion-top {
+        list-style: none;
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        cursor: pointer;
+        padding-block: var(--scb-accordion-item-padding-block, var(--spacing-7, 24px));
+        padding-inline: var(--scb-accordion-item-padding-inline, var(--spacing-5, 16px));
+        border-radius: var(--radius-none, 0px);
+        gap: var(--scb-accordion-item-gap, var(--spacing-5, 16px));
+        color: var(--md-sys-color-on-surface);
+        position: relative;
+        overflow: hidden;
+        -webkit-tap-highlight-color: transparent;
+        outline: none;
+      }
+      .scb-accordion-top::-webkit-details-marker { display: none; }
+      summary::marker { content: ''; }
+
+      :host([density="-2"]) .scb-accordion-top,
+      :host-context([data-density="-2"]) .scb-accordion-top {
+        padding-block: var(--spacing-5, 16px);
+      }
+      :host([density="-4"]) .scb-accordion-top,
+      :host-context([data-density="-4"]) .scb-accordion-top {
+        padding-block: var(--spacing-4, 12px);
+      }
+
+      .scb-accordion-bottom {
+        display: grid;
+        grid-template-rows: 0fr;
+        opacity: 0;
+        overflow: hidden;
+        transition:
+          grid-template-rows var(--scb-accordion-motion-duration) var(--scb-accordion-motion-easing),
+          opacity var(--scb-accordion-motion-duration) var(--scb-accordion-motion-easing),
+          padding var(--scb-accordion-motion-duration) var(--scb-accordion-motion-easing);
+        padding-block: var(--scb-accordion-panel-padding-closed);
+        padding-inline: calc(var(--scb-accordion-item-padding-inline, var(--spacing-5, 16px)) - var(--scb-accordion-interaction-bleed));
+      }
+      :host([open]) .scb-accordion-bottom {
+        grid-template-rows: 1fr;
+        opacity: 1;
+        padding-top: max(var(--spacing-0, 0px), calc(var(--spacing-2, 4px) - var(--scb-accordion-interaction-bleed)));
+        padding-right: calc(var(--scb-accordion-item-padding-inline, var(--spacing-5, 16px)) - var(--scb-accordion-interaction-bleed));
+        padding-bottom: calc(var(--scb-accordion-item-padding-inline, var(--spacing-5, 16px)) - var(--scb-accordion-interaction-bleed));
+        padding-left: calc(var(--scb-accordion-item-padding-inline, var(--spacing-5, 16px)) - var(--scb-accordion-interaction-bleed));
+      }
+      .bottom-inner {
+        min-height: 0;
+        overflow: visible;
+        padding: var(--scb-accordion-interaction-bleed);
+      }
+
+      .title {
+        font-family: var(--brand-font);
+        font-size: var(--scb-accordion-title-font-size, var(--md-sys-typescale-title-large-size));
+        line-height: var(--scb-accordion-title-line-height, var(--md-sys-typescale-title-large-line-height));
+        font-weight: var(--weight-semibold);
+        letter-spacing: var(--scb-accordion-title-letter-spacing, var(--md-sys-typescale-title-large-tracking));
+        color: var(--md-sys-color-on-surface);
+      }
+      .overline {
+        font-family: var(--brand-font);
+        font-size: var(--md-sys-typescale-body-small-size);
+        line-height: var(--md-sys-typescale-body-small-line-height);
+        font-weight: var(--weight-regular);
+        letter-spacing: var(--md-sys-typescale-body-small-tracking);
+        color: var(--md-sys-color-on-surface-variant);
+      }
+      .supporting-text {
+        font-family: var(--brand-font);
+        font-size: var(--scb-accordion-supporting-font-size, var(--md-sys-typescale-body-medium-size));
+        line-height: var(--scb-accordion-supporting-line-height, var(--md-sys-typescale-body-medium-line-height));
+        font-weight: var(--weight-regular);
+        letter-spacing: var(--scb-accordion-supporting-letter-spacing, var(--md-sys-typescale-body-medium-tracking));
+        color: var(--md-sys-color-on-surface-variant);
+      }
+
+      .leading { align-self: center; display: grid; place-items: center; }
+      .img {
+        width: var(--scb-accordion-leading-image-size, calc(var(--icon-size-extra-large, 36px) + var(--spacing-5, 16px)));
+        height: var(--scb-accordion-leading-image-size, calc(var(--icon-size-extra-large, 36px) + var(--spacing-5, 16px)));
+        object-fit: contain;
+        border-radius: var(--radius-s, 8px);
+      }
+
+      .texts { display: grid; gap: var(--spacing-1, 2px); }
+
+      .chevron {
+        margin-left: auto;
+      }
+
+      md-ripple {
+        border-radius: inherit;
+        inset: 0;
+        position: absolute;
+        pointer-events: none;
+        overflow: hidden;
+      }
+      @media (prefers-reduced-motion: reduce) {
+        md-ripple { display: none; }
+      }
+    `],d);r([o({type:Boolean,reflect:!0})],a.prototype,"open",void 0);r([o({type:String})],a.prototype,"title",void 0);r([o({type:String})],a.prototype,"content",void 0);r([o({type:String,attribute:"overline"})],a.prototype,"overline",void 0);r([o({type:String,attribute:"supporting-text"})],a.prototype,"supportingText",void 0);r([o({type:Boolean})],a.prototype,"leading",void 0);r([o({type:String,attribute:"leading-variant",reflect:!0})],a.prototype,"leadingVariant",void 0);r([o({type:String,attribute:"leading-icon"})],a.prototype,"leadingIcon",void 0);r([o({type:String,attribute:"img-href-image",reflect:!0})],a.prototype,"imgHrefImage",void 0);r([o({type:String,attribute:"avatar-label"})],a.prototype,"avatarLabel",void 0);r([o({type:String,attribute:"avatar-alt"})],a.prototype,"avatarAlt",void 0);r([o({type:String,attribute:"avatar-variant"})],a.prototype,"avatarVariant",void 0);r([o({type:String,attribute:"avatar-src"})],a.prototype,"avatarSrc",void 0);r([o({type:Number,reflect:!0})],a.prototype,"density",void 0);a=p=r([h("scb-accordion-item")],a);export{a as ScbAccordionItem};

package/mvc/components/Users/peter/Documents/SCB.Material-latest-dev/src/scb-components/scb-accordion/scb-accordion.js

@@ -0,0 +1,44 @@
+import{_ as m,b as v,g as y,h as a,v as _,y as b}from"../../../../../../../../vendor/vendor.js";import"../../../../../../../../vendor/vendor-lit.js";import{t as c}from"../../../../../../../../vendor/decorate.js";import"./scb-accordion-item.js";import{n as k,t as n}from"../../../../../../../../vendor/assertClassBrand.js";import"../scb-button/scb-button.js";(function(){try{var e=typeof globalThis<"u"?globalThis:window;if(!e.__scb_ce_guard_installed__){e.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(i,r,l){try{customElements.get(i)||t(i,r,l)}catch(h){var g=String(h||"");if(g.indexOf("already been used")===-1&&g.indexOf("NotSupportedError")===-1)throw h}}}}catch{}})();var s,p,o=(s=new WeakSet,p=class extends m{constructor(...t){super(...t),k(this,s),this.singleOpen=!1,this.showCloseAll=!1,this.size="large",this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0}connectedCallback(){super.connectedCallback(),this.addEventListener("open-changed",n(s,this,f))}disconnectedCallback(){this.removeEventListener("open-changed",n(s,this,f)),super.disconnectedCallback()}render(){const t=!this.singleOpen&&this.showCloseAll,i=t?n(s,this,S).call(this):!1;return b`
+      <div class="scb-accordion" ?single-open=${this.singleOpen}>
+        ${t?b`
+              <div class="scb-accordion-actions" role="toolbar" aria-label="Accordionkontroller">
+                <scb-button
+                  variant="text"
+                  label=${i?"Stäng alla":"Öppna alla"}
+                  @click=${n(s,this,O)}
+                ></scb-button>
+              </div>
+            `:_}
+
+        <slot @slotchange=${n(s,this,A)}></slot>
+      </div>
+    `}firstUpdated(){n(s,this,u).call(this),n(s,this,d).call(this)}updated(t){(t.has("spacing")||t.has("spacingTop")||t.has("spacingBottom")||t.has("spacingLeft")||t.has("spacingRight"))&&n(s,this,u).call(this),t.has("singleOpen")&&n(s,this,d).call(this)}_getDirectItems(){return Array.from(this.children).filter(t=>t.tagName==="SCB-ACCORDION-ITEM")}onItemToggled(t,i){if(this.singleOpen&&i){this._getDirectItems().forEach(r=>{r!==t&&r.setOpen(!1)});return}!this.singleOpen&&this.showCloseAll&&this.requestUpdate()}mapSpacingToken(t){if(!t)return;const i=String(t).trim();if(i)return/^\d+$/.test(i)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(i,10)))})`:i}},p.styles=v`
+    :host {
+      display: block;
+      margin-block-start: var(--scb-accordion-spacing-block-start, 0);
+      margin-block-end: var(--scb-accordion-spacing-block-end, 0);
+      margin-inline-start: var(--scb-accordion-spacing-inline-start, 0);
+      margin-inline-end: var(--scb-accordion-spacing-inline-end, 0);
+
+      --scb-accordion-actions-padding-inline: var(--spacing-5, 16px);
+      --scb-accordion-actions-padding-block: var(--spacing-2, 4px);
+    }
+
+    :host([size='medium']) {
+      --scb-accordion-actions-padding-inline: var(--spacing-5, 16px);
+      --scb-accordion-actions-padding-block: var(--spacing-2, 4px);
+    }
+
+    :host([size='small']) {
+      --scb-accordion-actions-padding-inline: var(--spacing-4, 12px);
+      --scb-accordion-actions-padding-block: var(--spacing-2, 4px);
+    }
+
+    .scb-accordion-actions {
+      display: flex;
+      justify-content: flex-end;
+      padding-inline: var(--scb-accordion-actions-padding-inline);
+      padding-block-start: var(--scb-accordion-actions-padding-block);
+      padding-block-end: var(--scb-accordion-actions-padding-block);
+    }
+  `,p);function S(){const e=this._getDirectItems();return e.length>0&&e.every(t=>t.open)}function O(){if(this.singleOpen||!this.showCloseAll)return;const e=this._getDirectItems(),t=e.length>0&&e.every(i=>i.open);e.forEach(i=>i.setOpen(!t))}function f(){this.singleOpen||this.showCloseAll&&this.requestUpdate()}function A(){if(this.singleOpen){n(s,this,d).call(this);return}this.showCloseAll&&this.requestUpdate()}function d(){if(!this.singleOpen)return;const e=this._getDirectItems().filter(t=>t.open);e.length<=1||e.slice(1).forEach(t=>t.setOpen(!1))}function u(){const e=this.mapSpacingToken(this.spacing),t=this.mapSpacingToken(this.spacingTop)??e,i=this.mapSpacingToken(this.spacingBottom)??e,r=this.mapSpacingToken(this.spacingLeft),l=this.mapSpacingToken(this.spacingRight);t?this.style.setProperty("--scb-accordion-spacing-block-start",t):this.style.removeProperty("--scb-accordion-spacing-block-start"),i?this.style.setProperty("--scb-accordion-spacing-block-end",i):this.style.removeProperty("--scb-accordion-spacing-block-end"),r?this.style.setProperty("--scb-accordion-spacing-inline-start",r):this.style.removeProperty("--scb-accordion-spacing-inline-start"),l?this.style.setProperty("--scb-accordion-spacing-inline-end",l):this.style.removeProperty("--scb-accordion-spacing-inline-end")}c([a({type:Boolean,attribute:"single-open",reflect:!0})],o.prototype,"singleOpen",void 0);c([a({type:Boolean,attribute:"show-close-all",reflect:!0})],o.prototype,"showCloseAll",void 0);c([a({type:String,reflect:!0})],o.prototype,"size",void 0);c([a({type:String,reflect:!0})],o.prototype,"spacing",void 0);c([a({type:String,attribute:"spacing-top",reflect:!0})],o.prototype,"spacingTop",void 0);c([a({type:String,attribute:"spacing-bottom",reflect:!0})],o.prototype,"spacingBottom",void 0);c([a({type:String,attribute:"spacing-left",reflect:!0})],o.prototype,"spacingLeft",void 0);c([a({type:String,attribute:"spacing-right",reflect:!0})],o.prototype,"spacingRight",void 0);o=c([y("scb-accordion")],o);export{o as ScbAccordion};