@ogds/elements 1.0.0-alpha.7 → 1.0.0-alpha.8

package/README.md

@@ -1,8 +1,20 @@
 # OGDS Elements
 
-The Open Government Design System (OGDS) is a complement to and reimagining of the [United States Web Design System](https://designsystem.digital.gov) (USWDS). OGDS aims to ship components and styles that will feel at home in any site using USWDS while leveraging the modern web platform to deliver the same level of reliability and accessibility as USWDS with less code.
+The Open Government Design System (OGDS) is a complement to and reimagining of the [United States Web Design System](https://designsystem.digital.gov) (USWDS). OGDS aims to ship components and styles that will feel at home in any site using USWDS. This project leverages the modern web platform to deliver the same level of reliability and accessibility as USWDS with less code.
 
-## Installation using node and npm
+You can (and should!) use both OGDS components and traditional USWDS components in your project. Some of our OGDS components are **enhanced** versions of USWDS components, such as the accordion and banner components. Some of our components are entirely **new**, such as the Task List component.
+
+The components developed in OGDS Elements use [the same design tokens as USWDS](https://designsystem.digital.gov/design-tokens/), such as colors and spacing values. These are imported from the [OGDS Tokens project](https://github.com/open-government-design-system/ogds-tokens), which makes the USWDS design tokens available in multiple formats. In this project, we use [CSS Custom Properties (CSS Variables)](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_cascading_variables/Using_CSS_custom_properties), which means we can benefit from this feature of modern browsers. CSS Custom Properties have been [widely available in all major browsers since 2017](https://caniuse.com/css-variables)). This approach helps us to avoid a css compiler (like SASS), it helps us to manage themes and overrides, and it helps us style components in a simpler way.
+
+## Component Documentation on Storybook
+
+Where can I see exapmles of the OGDS Elements components? How do I set this up?
+
+For more detailed documentation, see the [OGDS Elements Storybook](https://ogds-elements.jbhutch01.workers.dev/).
+
+## Using OGDS Elements
+
+### Installation using node and npm
 
 1. Install `node/npm`. In the link below you can find the install method that coincides with your operating system:
     - Node (see [.nvmrc](https://github.com/open-government-design-system/ogds-elements/blob/develop/.nvmrc) for version number), [Installation guides](https://nodejs.org/en/download)
@@ -28,7 +40,7 @@ The `@ogds/elements` module is now installed as a dependency.
 
 **Note:** We do _not_ recommend directly editing the design system files in `node_modules`. One of the benefits of using a package manager is its ease of upgrade and installation. If you make customizations to the files in the package, any upgrade or re-installation will wipe them out.
 
-## Using OGDS Elements in your project
+### Using OGDS Elements in your project
 
 How you add a OGDS Elements component to a page might vary depending on your tools. If you use Vite, you can add components by importing them into a script that's imported elsewhere into a page:
 
@@ -47,7 +59,7 @@ import { OgdsAccordion } from "@ogds/elements";
 </ogds-accordion>
 ```
 
-## Style theming and tokens
+### Style theming and tokens
 
 Each OGDS Element provides support for theming by exposing CSS custom properties (CSS variables) that can be used to control the appearance of the component.
 
@@ -67,106 +79,26 @@ For example, the `ogds-banner` component can be customized by setting the `--ogd
 
 **Note:** Please be mindful of the accessibility implications of customizing component appearance. It's **your** responsibility to ensure that your customizations meet the [accessibility requirements](https://designsystem.digital.gov/accessibility/) of the design system and pass any [WCAG 2.2](https://www.w3.org/TR/WCAG22/) or [Section 508](https://www.section508.gov/) accessibility tests.
 
-## Documentation
-
-For more detailed documentation, refer to the Storybook for OGDS Elements. The Storybook isn't currently available online, but you can see it either by cloning this repo and running `npm run start` or by installing the package and running the same command at the package root inside of your `node_modules` folder.
-
-## Publishing
-
-This repository is automatically published to NPM when a new release is created.
-
-We use Changesets to manage changelogs, version bumps, pre-releases (alpha/beta), and automated publishing via GitHub Actions. The repository includes a pre-configured Changesets setup so you can create pre-releases (for example, `alpha`) and standard releases.
-
-### Pre-release flow
-
-If you're working on a pre-release version, enter pre-release mode:
-
-```bash
-   npx @changesets/cli pre enter <tag> # for example, npx @changesets/cli pre enter alpha
-```
-
-This will write a `.changeset/pre.json` that configures the pre-release tag and initial version. This file should be committed to the repository.
-
-**Note:** Once you're in pre-release mode, you don't have to enter it every time. When you're ready to exit pre-release mode, run:
-
-```bash
-npx @changesets/cli pre exit
-```
-
-### Version bumps, and publishing (Changesets)
-
-1. Create a changeset describing your change(s)
-    - Run the interactive prompt and follow the questions:
-
-        ```bash
-        npx @changesets/cli
-        ```
-
-    - The command creates a file under the `.changeset/` directory that describes the packages and the release type (patch/minor/major). You can edit this file to add more details, such as a link to the issue or pull request that the change addresses. The file will automatically get a nonsensical name like `fire-penguin-annex.md`, and that's normal. These files are only in the repository for a short time, to generate changelogs and version bumps. They aren't published to NPM and are cleaned up after the release is published.
-
-2. Bump versions locally (optional)
-    - To update package.json versions and changelogs locally before publishing:
-
-        ```bash
-        npx @changesets/cli version
-        ```
-
-    - Commit the resulting changes (package.json updates and generated changelog files):
-
-        ```bash
-        git add .
-        git commit -m "chore(release): version packages and changelogs"
-        ```
-
-3. Publish
-    - Option A — Let the repository automation handle publishing (recommended):
-        - Push your branch to GitHub and open a PR. The CI / release automation will run and, depending on the configuration and merged changesets, will publish releases when merged to `main`.
-    - Option B — Publish locally (requires NPM credentials and appropriate tokens):
+## Contributing to OGDS Elements
 
-        ```bash
-        npm run release
-        ```
+OGDS is run by contributors, including folks from many government agencies, departments, states, and more. If you have ideas for what to contribute, we would love your support!
 
-        This script typically runs your tokenized publish flow (it may run builds and then `changeset publish`).
+### Code of Conduct
 
-#### How the automation works (GitHub Actions)
+Everyone who participates in this project is expected to follow the OGDS Code of Conduct (TK CoC Link)
 
-- There's a CI workflow configured to automate release and publish:
-    - The workflow runs on pushes to `main` and uses the Changesets GitHub Action.
-    - The action can either create a release PR or publish directly to NPM depending on repository and action settings.
-    - The workflow uses repository secrets:
-        - `GITHUB_TOKEN` — standard workflow permission for the action to create PRs/commits.
-    - The action is configured to run the project’s release script (for example `npm run release`) and is run in a controlled environment; it will also disable Husky hooks during automated runs (HUSKY=0) to avoid local commit hooks blocking automation.
+### Join the Mailing List and Slack
 
-#### Notes, tips, and troubleshooting
+If you'd like to [join the People's Design System mailing list and Slack](https://docs.google.com/document/d/10XN6ZsRt9aAOH1PUmtfcCCEBZQUSgs1cCI5krYBOoi4/edit?tab=t.0), that is where we discuss these topics.
 
-- Ensure your changeset accurately reflects the semantic change (patch/minor/major). Changesets drives the version bump and changelog generation.
-- Pre-release flows:
-    - The repository includes a `.changeset/pre.json` configuration that sets a default pre-release tag (e.g., `alpha`) and initial versions for pre-release packages. Use `npx @changesets/cli pre enter  <tag>` to begin a pre-release cycle.
-    - When in pre mode, version bumps will produce pre-release identifiers (for example, `1.0.0-alpha.1`).
-- CI vs local publish:
-    - For most contributors, pushing a properly authored changeset and opening a PR is the recommended route—automation will create the release or open the release PR for maintainers to review.
-    - If you must publish locally, make sure `NPM_TOKEN` is configured in your environment or use a CI/protected account to run the publish steps.
-- If releases aren't being published as expected:
-    - Verify `NPM_TOKEN` exists in repository secrets and has publish scope.
-    - Ensure the commit/push to `main` contains a changeset (or the automation has been triggered by the Changesets action).
-    - Review the release workflow logs in GitHub Actions for details (it'll show the changesets step and any publishing errors).
-- If you want to change the default pre-release tag (for example, from `alpha` to `beta`), update the `.changeset/pre.json` file and follow the pre-mode steps above.
+### Filing a bug report
 
-Example quick flow (pre-release -> publish via automation)
+If you discovered a bug that no one else has reported in our [issues backlog](https://github.com/open-government-design-system/ogds-elements/issues), let us know by [submitting an issue](https://github.com/open-government-design-system/ogds-elements/issues/new).
 
-1. On a feature branch, implement changes.
-2. Enter pre mode if you want pre-release tagging:
-    - `npx @changesets/cli pre enter --tag alpha`
-3. Run `npx @changesets/cli` and follow the prompts (choose the appropriate release type).
-4. Commit the changeset file(s), push the branch, and open a PR.
-5. Once the PR is merged to `main`, the repository release workflow will pick up the changeset and publish the pre-release to NPM (provided `NPM_TOKEN` and workflow permissions are set).
+### Starting a discussion
 
-If you have questions about changing the pre-release tag or the release automation behavior, or if you want a walkthrough of creating a test release in a fork, please open an issue or ask in the PR review comments.
+To share ideas, questions, or concerns with the OGDS core team and community, you can join any of our [open discussions](https://github.com/open-government-design-system/ogds-elements/discussions) or [start a new one](https://github.com/open-government-design-system/ogds-elements/discussions/new/choose).
 
-## Component Versions
+### Contributing Code
 
-| Component        | Status |
-| ---------------- | ------ |
-| `ogds-banner`    | Beta   |
-| `ogds-accordion` | Alpha  |
+See Contributing.md

package/dist/components/frameworks/react/OGDSAlert.d.ts

@@ -0,0 +1,61 @@
+import React from "react";
+import { OGDSAlert as OGDSAlertElement } from "../../ogds-alert.js";
+
+export type { OGDSAlertElement };
+
+export interface OGDSAlertProps extends Pick<
+  React.AllHTMLAttributes<HTMLElement>,
+  | "children"
+  | "dir"
+  | "hidden"
+  | "id"
+  | "lang"
+  | "slot"
+  | "style"
+  | "title"
+  | "translate"
+  | "onClick"
+  | "onFocus"
+  | "onBlur"
+> {
+  /** undefined */
+  noIcon?: boolean;
+
+  /** The type of alert (info, warning, etc) */
+  type?: OGDSAlertElement["type"];
+
+  /** Use this attribute to hide the icon */
+  undefined?: OGDSAlertElement["undefined"];
+
+  /** A space-separated list of the classes of the element. Classes allows CSS and JavaScript to select and access specific elements via the class selectors or functions like the method `Document.getElementsByClassName()`. */
+  className?: string;
+
+  /** Contains a space-separated list of the part names of the element that should be exposed on the host element. */
+  exportparts?: string;
+
+  /** Used for labels to link them with their inputs (using input id). */
+  htmlFor?: string;
+
+  /** Used to help React identify which items have changed, are added, or are removed within a list. */
+  key?: number | string;
+
+  /** Contains a space-separated list of the part names of the element. Part names allows CSS to select and style specific elements in a shadow tree via the ::part pseudo-element. */
+  part?: string;
+
+  /** A mutable ref object whose `.current` property is initialized to the passed argument (`initialValue`). The returned object will persist for the full lifetime of the component. */
+  ref?: any;
+
+  /** Allows developers to make HTML elements focusable, allow or prevent them from being sequentially focusable (usually with the `Tab` key, hence the name) and determine their relative ordering for sequential focus navigation. */
+  tabIndex?: number;
+}
+
+/**
+ * The ogds-alert component.
+ * ---
+ *
+ *
+ * ### **Slots:**
+ *  - **heading** - Text for the heading. Make sure to specify the correct heading level (h2, h3, etc)
+ * - **body** - Body content for the alert. Can contain HTML (links, etc).
+ */
+export const OGDSAlert: React.ForwardRefExoticComponent<OGDSAlertProps>;

package/dist/components/frameworks/react/OGDSAlert.js

@@ -0,0 +1,23 @@
+import React, { forwardRef } from "react";
+import "../../ogds-alert.js";
+
+export const OGDSAlert = forwardRef((props, forwardedRef) => {
+  const { noIcon, type, ...filteredProps } = props;
+
+  return React.createElement(
+    "ogds-alert",
+    {
+      ...filteredProps,
+      type: props.type,
+      noIcon: props.undefined,
+      class: props.className,
+      exportparts: props.exportparts,
+      for: props.htmlFor,
+      part: props.part,
+      tabindex: props.tabIndex,
+      "no-icon": props.noIcon ? true : undefined,
+      style: { ...props.style },
+    },
+    props.children,
+  );
+});

package/dist/components/frameworks/react/OgdsAccordionToggle.d.ts

@@ -21,12 +21,6 @@ export interface OgdsAccordionToggleProps extends Pick<
   /** The `id` of the `<ogds-accordion>` to control. Required. */
   controls?: OgdsAccordionToggleElement["controls"];
 
-  /** Button label when all panels are collapsed. Defaults to "Expand All". */
-  expandLabel?: OgdsAccordionToggleElement["expandLabel"];
-
-  /** Button label when one or more panels are open. Defaults to "Collapse All". */
-  collapseLabel?: OgdsAccordionToggleElement["collapseLabel"];
-
   /** A space-separated list of the classes of the element. Classes allows CSS and JavaScript to select and access specific elements via the class selectors or functions like the method `Document.getElementsByClassName()`. */
   className?: string;
 
@@ -54,6 +48,10 @@ export interface OgdsAccordionToggleProps extends Pick<
  * ---
  *
  *
+ * ### **Slots:**
+ *  - **expand-label** - Button label when all panels are collapsed. Defaults to "Expand All".
+ * - **collapse-label** - Button label when one or more panels are open. Defaults to "Collapse All".
+ *
  * ### **CSS Parts:**
  *  - **button** - The toggle button.
  */

package/dist/components/frameworks/react/OgdsAccordionToggle.js

@@ -2,15 +2,13 @@ import React, { forwardRef } from "react";
 import "../../ogds-accordion-toggle.js";
 
 export const OgdsAccordionToggle = forwardRef((props, forwardedRef) => {
-  const { controls, expandLabel, collapseLabel, ...filteredProps } = props;
+  const { controls, ...filteredProps } = props;
 
   return React.createElement(
     "ogds-accordion-toggle",
     {
       ...filteredProps,
       controls: props.controls,
-      "expand-label": props.expandLabel || props["expand-label"],
-      "collapse-label": props.collapseLabel || props["collapse-label"],
       class: props.className,
       exportparts: props.exportparts,
       for: props.htmlFor,

package/dist/components/frameworks/react/{UsaHeader.d.ts → OgdsTaskList.d.ts}

@@ -1,9 +1,9 @@
 import React from "react";
-import { UsaHeader as UsaHeaderElement } from "../../undefined.js";
+import { OgdsTaskList as OgdsTaskListElement } from "../../ogds-task-list.js";
 
-export type { UsaHeaderElement };
+export type { OgdsTaskListElement };
 
-export interface UsaHeaderProps extends Pick<
+export interface OgdsTaskListProps extends Pick<
   React.AllHTMLAttributes<HTMLElement>,
   | "children"
   | "dir"
@@ -45,4 +45,4 @@ export interface UsaHeaderProps extends Pick<
  * ---
  *
  */
-export const UsaHeader: React.ForwardRefExoticComponent<UsaHeaderProps>;
+export const OgdsTaskList: React.ForwardRefExoticComponent<OgdsTaskListProps>;

package/dist/components/frameworks/react/{UsaHeader.js → OgdsTaskList.js}

@@ -1,9 +1,9 @@
 import React, { forwardRef } from "react";
-import "../../undefined.js";
+import "../../ogds-task-list.js";
 
-export const UsaHeader = forwardRef((props, forwardedRef) => {
+export const OgdsTaskList = forwardRef((props, forwardedRef) => {
   return React.createElement(
-    "undefined",
+    "ogds-task-list",
     {
       ...props,
       class: props.className,

package/dist/components/frameworks/react/index.d.ts

@@ -1,4 +1,5 @@
 export * from "./OgdsAccordion.js";
 export * from "./OgdsAccordionToggle.js";
+export * from "./OGDSAlert.js";
 export * from "./OgdsBanner.js";
-export * from "./UsaHeader.js";
+export * from "./OgdsTaskList.js";

package/dist/components/frameworks/react/index.js

@@ -1,4 +1,5 @@
 export * from "./OgdsAccordion.js";
 export * from "./OgdsAccordionToggle.js";
+export * from "./OGDSAlert.js";
 export * from "./OgdsBanner.js";
-export * from "./UsaHeader.js";
+export * from "./OgdsTaskList.js";

package/dist/components/index.cjs

@@ -1,8 +1,15 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("../index-DTiLuJoA.cjs"),s=require("lit"),m=require("lit/decorators.js"),p=s.css`@layer ogds.components{.ogds-accordion,ogds-accordion{--ogds-accordion-border:.25rem solid var(--ogds-theme-color-base-lightest);--ogds-accordion-content-padding:1rem 1.25rem .75rem ;--ogds-accordion-icon-closed:var(--icon-chevron-pointing-down);--ogds-accordion-icon-open:var(--icon-chevron-pointing-up)}:is(.ogds-accordion,ogds-accordion).plus{--ogds-accordion-icon-closed:var(--icon-plus);--ogds-accordion-icon-open:var(--icon-minus)}.ogds-accordion,ogds-accordion{--accordion-icon:var(--ogds-accordion-icon-closed)}:is(.ogds-accordion,ogds-accordion) details{color:var(--ogds-theme-color-base-ink);margin-block:.5rem}:is(.ogds-accordion,ogds-accordion) details[open]{--accordion-icon:var(--ogds-accordion-icon-open)}:is(.ogds-accordion,ogds-accordion) summary{background-color:var(--ogds-theme-color-base-lightest);padding:1rem 1.25rem;font-weight:700}:is(.ogds-accordion,ogds-accordion) summary:hover{background-color:var(--ogds-color-gray-10)}:is(.ogds-accordion,ogds-accordion) summary:focus{outline:.25rem solid #2491ff}:is(.ogds-accordion,ogds-accordion).with-icon summary{align-items:center;display:flex}:is(.ogds-accordion,ogds-accordion).with-icon summary::marker{display:none}:is(.ogds-accordion,ogds-accordion).with-icon summary::-webkit-details-marker{display:none}:is(.ogds-accordion,ogds-accordion).with-icon summary:before{content:\"\";height:1.25rem;-webkit-mask-image:var(--accordion-icon);mask-image:var(--accordion-icon);background-color:currentColor;flex-shrink:0;width:1.5rem;display:block;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}:is(.ogds-accordion,ogds-accordion).with-icon.right summary:before{order:2;margin-inline-start:auto}@supports selector(::details-content){:is(.ogds-accordion,ogds-accordion) details[open]::details-content{padding:var(--ogds-accordion-content-padding)}:is(.ogds-accordion,ogds-accordion).bordered details[open]::details-content{border-block-end:var(--ogds-accordion-border);border-inline-end:var(--ogds-accordion-border);border-inline-start:var(--ogds-accordion-border)}}@supports not selector(::details-content){:is(.ogds-accordion,ogds-accordion) .details-content{padding:var(--ogds-accordion-content-padding)}:is(.ogds-accordion,ogds-accordion).bordered .details-content{border-block-end:var(--ogds-accordion-border);border-inline-end:var(--ogds-accordion-border);border-inline-start:var(--ogds-accordion-border)}}}`,b="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M19%2013h-6v6h-2v-6H5v-2h6V5h2v6h6v2z'/%3e%3c/svg%3e",u="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M19%2013H5v-2h14v2z'/%3e%3c/svg%3e",y=s.css`:root,:host{--ogds-font-family-system:-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";--ogds-font-family-georgia:Georgia, Cambria, \"Times New Roman\", Times, serif;--ogds-font-family-helvetica:\"Helvetica Neue\", Helvetica, Roboto, Arial, sans-serif;--ogds-font-family-monospace:\"Bitstream Vera Sans Mono\", \"Consolas\", \"Courier\", monospace;--ogds-font-size-1:.75rem;--ogds-font-size-2:.8125rem;--ogds-font-size-3:.875rem;--ogds-font-size-4:.9375rem;--ogds-font-size-5:1rem;--ogds-font-size-6:1.0625rem;--ogds-font-size-7:1.125rem;--ogds-font-size-8:1.25rem;--ogds-font-size-9:1.375rem;--ogds-font-size-10:1.5rem;--ogds-font-size-11:1.75rem;--ogds-font-size-12:2rem;--ogds-font-size-13:2.25rem;--ogds-font-size-14:2.5rem;--ogds-font-size-15:3rem;--ogds-font-size-16:3.5rem;--ogds-font-size-17:4rem;--ogds-font-size-18:5rem;--ogds-font-size-19:7.5rem;--ogds-font-size-20:8.75rem;--ogds-font-size-micro:.625rem;--ogds-line-height-1:1;--ogds-line-height-2:1.2;--ogds-line-height-3:1.35;--ogds-line-height-4:1.5;--ogds-line-height-5:1.62;--ogds-line-height-6:1.75;--ogds-measure-smaller:44ex;--ogds-measure-small:60ex;--ogds-measure-base:64ex;--ogds-measure-large:68ex;--ogds-measure-larger:72ex;--ogds-measure-largest:88ex}`,v=s.css`:root,:host{--ogds-theme-color-base-lightest:#f0f0f0;--ogds-theme-color-base-lighter:#dfe1e2;--ogds-theme-color-base-light:#a9aeb1;--ogds-theme-color-base:#71767a;--ogds-theme-color-base-dark:#565c65;--ogds-theme-color-base-darker:#3d4551;--ogds-theme-color-base-darkest:#1b1b1b;--ogds-theme-color-base-ink:#1b1b1b;--ogds-theme-color-primary-lighter:#d9e8f6;--ogds-theme-color-primary-light:#73b3e7;--ogds-theme-color-primary:#005ea2;--ogds-theme-color-primary-vivid:#0050d8;--ogds-theme-color-primary-dark:#1a4480;--ogds-theme-color-primary-darker:#162e51;--ogds-theme-color-secondary-lighter:#f3e1e4;--ogds-theme-color-secondary-light:#f2938c;--ogds-theme-color-secondary:#d83933;--ogds-theme-color-secondary-vivid:#e41d3d;--ogds-theme-color-secondary-dark:#b50909;--ogds-theme-color-secondary-darker:#8b0a03;--ogds-theme-color-accent-warm-lighter:#f2e4d4;--ogds-theme-color-accent-warm-light:#ffbc78;--ogds-theme-color-accent-warm:#fa9441;--ogds-theme-color-accent-warm-dark:#c05600;--ogds-theme-color-accent-warm-darker:#775540;--ogds-theme-color-accent-cool-lighter:#e1f3f8;--ogds-theme-color-accent-cool-light:#97d4ea;--ogds-theme-color-accent-cool:#00bde3;--ogds-theme-color-accent-cool-dark:#28a0cb;--ogds-theme-color-accent-cool-darker:#07648d;--ogds-theme-color-error-lighter:#f4e3db;--ogds-theme-color-error-light:#f39268;--ogds-theme-color-error:#d54309;--ogds-theme-color-error-dark:#b50909;--ogds-theme-color-error-darker:#6f3331;--ogds-theme-color-warning-lighter:#faf3d1;--ogds-theme-color-warning-light:#fee685;--ogds-theme-color-warning:#ffbe2e;--ogds-theme-color-warning-dark:#e5a000;--ogds-theme-color-warning-darker:#936f38;--ogds-theme-color-success-lighter:#ecf3ec;--ogds-theme-color-success-light:#70e17b;--ogds-theme-color-success:#00a91c;--ogds-theme-color-success-dark:#008817;--ogds-theme-color-success-darker:#216e1f;--ogds-theme-color-info-lighter:#e7f6f8;--ogds-theme-color-info-light:#99deea;--ogds-theme-color-info:#00bde3;--ogds-theme-color-info-dark:#009ec1;--ogds-theme-color-info-darker:#2e6276;--ogds-theme-color-disabled-lighter:#c9c9c9;--ogds-theme-color-disabled-light:#919191;--ogds-theme-color-disabled:#757575;--ogds-theme-color-disabled-dark:#454545;--ogds-theme-color-disabled-darker:#1b1b1b;--ogds-theme-color-emergency:#9c3d10;--ogds-theme-color-emergency-dark:#332d29;--ogds-theme-body-background-color:#fff;--ogds-theme-text-color:#1b1b1b;--ogds-theme-text-reverse-color:#fff;--ogds-theme-link-color:#005ea2;--ogds-theme-link-visited-color:#54278f;--ogds-theme-link-hover-color:#1a4480;--ogds-theme-link-active-color:#162e51;--ogds-theme-link-reverse-color:#dfe1e2;--ogds-theme-link-reverse-hover-color:#f0f0f0;--ogds-theme-link-reverse-active-color:#fff;--ogds-theme-focus-color:#2491ff}`,k=s.css`:root,:host{--ogds-theme-border-radius-sm:2px;--ogds-theme-border-radius-md:.25rem;--ogds-theme-border-radius-lg:.5rem;--ogds-theme-column-gap-sm:2px;--ogds-theme-column-gap-md:1rem;--ogds-theme-column-gap-lg:1.5rem;--ogds-theme-column-gap-mobile:1rem;--ogds-theme-column-gap-desktop:2rem;--ogds-theme-grid-container-max-width:64rem;--ogds-theme-site-margins-breakpoint:64rem;--ogds-theme-site-margins-width:2rem;--ogds-theme-site-margins-mobile-width:1rem}`,w=s.css`:root,:host{--ogds-theme-type-scale-3xs:.8125rem;--ogds-theme-type-scale-2xs:.875rem;--ogds-theme-type-scale-xs:.9375rem;--ogds-theme-type-scale-sm:1rem;--ogds-theme-type-scale-md:1.0625rem;--ogds-theme-type-scale-lg:1.375rem;--ogds-theme-type-scale-xl:2rem;--ogds-theme-type-scale-2xl:2.5rem;--ogds-theme-type-scale-3xl:3rem;--ogds-theme-body-font-size:1rem;--ogds-theme-body-line-height:1.62;--ogds-theme-heading-line-height:1.2;--ogds-theme-display-font-size:3rem;--ogds-theme-h1-font-size:2.5rem;--ogds-theme-h2-font-size:2rem;--ogds-theme-h3-font-size:1.375rem;--ogds-theme-h4-font-size:1rem;--ogds-theme-h5-font-size:.9375rem;--ogds-theme-h6-font-size:.8125rem;--ogds-theme-lead-font-size:1.375rem;--ogds-theme-lead-line-height:1.75}`,a=new CSSStyleSheet;a.replaceSync([d.colorTokens,d.spacingTokens,y,v,k,w].map(i=>i.cssText).join(`
-`));function S(){document.adoptedStyleSheets.includes(a)||(document.adoptedStyleSheets=[...document.adoptedStyleSheets,a])}var z=Object.defineProperty,h=(i,e,r,c)=>{for(var t=void 0,n=i.length-1,l;n>=0;n--)(l=i[n])&&(t=l(e,r,t)||t);return t&&z(e,r,t),t},o;const g=(o=class extends s.LitElement{constructor(){super(...arguments),this.useListSemantics=!1,this.headingLevel=0}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),S(),o._sheet||(o._sheet=new CSSStyleSheet,o._sheet.replaceSync(`ogds-accordion, .ogds-accordion {
-          --icon-chevron-pointing-down: url("${d.iconChevronDown}");
-          --icon-chevron-pointing-up: url("${d.iconChevronUp}");
-          --icon-plus: url("${b}");
-          --icon-minus: url("${u}");
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("../index-CC1QRihN.cjs"),s=require("lit"),g=require("lit/decorators.js"),k=s.css`@layer ogds.components{.ogds-accordion,ogds-accordion{--ogds-accordion-border:.25rem solid var(--ogds-theme-color-base-lightest);--ogds-accordion-content-padding:1rem 1.25rem .75rem ;--ogds-accordion-icon-closed:var(--icon-chevron-pointing-down);--ogds-accordion-icon-open:var(--icon-chevron-pointing-up)}:is(.ogds-accordion,ogds-accordion).plus{--ogds-accordion-icon-closed:var(--icon-plus);--ogds-accordion-icon-open:var(--icon-minus)}.ogds-accordion,ogds-accordion{--accordion-icon:var(--ogds-accordion-icon-closed)}:is(.ogds-accordion,ogds-accordion) details{color:var(--ogds-theme-color-base-ink);margin-block:.5rem}:is(.ogds-accordion,ogds-accordion) details[open]{--accordion-icon:var(--ogds-accordion-icon-open)}:is(.ogds-accordion,ogds-accordion) summary{background-color:var(--ogds-theme-color-base-lightest);padding:1rem 1.25rem;font-weight:700}:is(.ogds-accordion,ogds-accordion) summary:hover{background-color:var(--ogds-color-gray-10)}:is(.ogds-accordion,ogds-accordion) summary:focus{outline:.25rem solid #2491ff}:is(.ogds-accordion,ogds-accordion).with-icon summary{align-items:center;display:flex}:is(.ogds-accordion,ogds-accordion).with-icon summary::marker{display:none}:is(.ogds-accordion,ogds-accordion).with-icon summary::-webkit-details-marker{display:none}:is(.ogds-accordion,ogds-accordion).with-icon summary:before{content:\"\";height:1.25rem;-webkit-mask-image:var(--accordion-icon);mask-image:var(--accordion-icon);background-color:currentColor;flex-shrink:0;width:1.5rem;display:block;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}:is(.ogds-accordion,ogds-accordion).with-icon.right summary:before{order:2;margin-inline-start:auto}@supports selector(::details-content){:is(.ogds-accordion,ogds-accordion) details[open]::details-content{padding:var(--ogds-accordion-content-padding)}:is(.ogds-accordion,ogds-accordion).bordered details[open]::details-content{border-block-end:var(--ogds-accordion-border);border-inline-end:var(--ogds-accordion-border);border-inline-start:var(--ogds-accordion-border)}}@supports not selector(::details-content){:is(.ogds-accordion,ogds-accordion) .details-content{padding:var(--ogds-accordion-content-padding)}:is(.ogds-accordion,ogds-accordion).bordered .details-content{border-block-end:var(--ogds-accordion-border);border-inline-end:var(--ogds-accordion-border);border-inline-start:var(--ogds-accordion-border)}}}`,S="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M19%2013h-6v6h-2v-6H5v-2h6V5h2v6h6v2z'/%3e%3c/svg%3e",w="data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M19%2013H5v-2h14v2z'/%3e%3c/svg%3e",x=s.css`:root,:host{--ogds-font-family-system:-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";--ogds-font-family-georgia:Georgia, Cambria, \"Times New Roman\", Times, serif;--ogds-font-family-helvetica:\"Helvetica Neue\", Helvetica, Roboto, Arial, sans-serif;--ogds-font-family-monospace:\"Bitstream Vera Sans Mono\", \"Consolas\", \"Courier\", monospace;--ogds-font-size-1:.75rem;--ogds-font-size-2:.8125rem;--ogds-font-size-3:.875rem;--ogds-font-size-4:.9375rem;--ogds-font-size-5:1rem;--ogds-font-size-6:1.0625rem;--ogds-font-size-7:1.125rem;--ogds-font-size-8:1.25rem;--ogds-font-size-9:1.375rem;--ogds-font-size-10:1.5rem;--ogds-font-size-11:1.75rem;--ogds-font-size-12:2rem;--ogds-font-size-13:2.25rem;--ogds-font-size-14:2.5rem;--ogds-font-size-15:3rem;--ogds-font-size-16:3.5rem;--ogds-font-size-17:4rem;--ogds-font-size-18:5rem;--ogds-font-size-19:7.5rem;--ogds-font-size-20:8.75rem;--ogds-font-size-micro:.625rem;--ogds-line-height-1:1;--ogds-line-height-2:1.2;--ogds-line-height-3:1.35;--ogds-line-height-4:1.5;--ogds-line-height-5:1.62;--ogds-line-height-6:1.75;--ogds-measure-smaller:44ex;--ogds-measure-small:60ex;--ogds-measure-base:64ex;--ogds-measure-large:68ex;--ogds-measure-larger:72ex;--ogds-measure-largest:88ex}`,z=s.css`:root,:host{--ogds-theme-color-base-lightest:#f0f0f0;--ogds-theme-color-base-lighter:#dfe1e2;--ogds-theme-color-base-light:#a9aeb1;--ogds-theme-color-base:#71767a;--ogds-theme-color-base-dark:#565c65;--ogds-theme-color-base-darker:#3d4551;--ogds-theme-color-base-darkest:#1b1b1b;--ogds-theme-color-base-ink:#1b1b1b;--ogds-theme-color-primary-lighter:#d9e8f6;--ogds-theme-color-primary-light:#73b3e7;--ogds-theme-color-primary:#005ea2;--ogds-theme-color-primary-vivid:#0050d8;--ogds-theme-color-primary-dark:#1a4480;--ogds-theme-color-primary-darker:#162e51;--ogds-theme-color-secondary-lighter:#f3e1e4;--ogds-theme-color-secondary-light:#f2938c;--ogds-theme-color-secondary:#d83933;--ogds-theme-color-secondary-vivid:#e41d3d;--ogds-theme-color-secondary-dark:#b50909;--ogds-theme-color-secondary-darker:#8b0a03;--ogds-theme-color-accent-warm-lighter:#f2e4d4;--ogds-theme-color-accent-warm-light:#ffbc78;--ogds-theme-color-accent-warm:#fa9441;--ogds-theme-color-accent-warm-dark:#c05600;--ogds-theme-color-accent-warm-darker:#775540;--ogds-theme-color-accent-cool-lighter:#e1f3f8;--ogds-theme-color-accent-cool-light:#97d4ea;--ogds-theme-color-accent-cool:#00bde3;--ogds-theme-color-accent-cool-dark:#28a0cb;--ogds-theme-color-accent-cool-darker:#07648d;--ogds-theme-color-error-lighter:#f4e3db;--ogds-theme-color-error-light:#f39268;--ogds-theme-color-error:#d54309;--ogds-theme-color-error-dark:#b50909;--ogds-theme-color-error-darker:#6f3331;--ogds-theme-color-warning-lighter:#faf3d1;--ogds-theme-color-warning-light:#fee685;--ogds-theme-color-warning:#ffbe2e;--ogds-theme-color-warning-dark:#e5a000;--ogds-theme-color-warning-darker:#936f38;--ogds-theme-color-success-lighter:#ecf3ec;--ogds-theme-color-success-light:#70e17b;--ogds-theme-color-success:#00a91c;--ogds-theme-color-success-dark:#008817;--ogds-theme-color-success-darker:#216e1f;--ogds-theme-color-info-lighter:#e7f6f8;--ogds-theme-color-info-light:#99deea;--ogds-theme-color-info:#00bde3;--ogds-theme-color-info-dark:#009ec1;--ogds-theme-color-info-darker:#2e6276;--ogds-theme-color-disabled-lighter:#c9c9c9;--ogds-theme-color-disabled-light:#919191;--ogds-theme-color-disabled:#757575;--ogds-theme-color-disabled-dark:#454545;--ogds-theme-color-disabled-darker:#1b1b1b;--ogds-theme-color-emergency:#9c3d10;--ogds-theme-color-emergency-dark:#332d29;--ogds-theme-body-background-color:#fff;--ogds-theme-text-color:#1b1b1b;--ogds-theme-text-reverse-color:#fff;--ogds-theme-link-color:#005ea2;--ogds-theme-link-visited-color:#54278f;--ogds-theme-link-hover-color:#1a4480;--ogds-theme-link-active-color:#162e51;--ogds-theme-link-reverse-color:#dfe1e2;--ogds-theme-link-reverse-hover-color:#f0f0f0;--ogds-theme-link-reverse-active-color:#fff;--ogds-theme-focus-color:#2491ff}`,C=s.css`:root,:host{--ogds-theme-button-border-radius:.25rem;--ogds-theme-button-fill-color:#005ea2;--ogds-theme-button-font-family:-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";--ogds-theme-button-icon-gap:.5rem;--ogds-theme-button-small-width:3rem;--ogds-theme-button-stroke-color:#005ea2;--ogds-theme-button-stroke-width:2px;--ogds-theme-button-text-color:#fff}`,A=s.css`:root,:host{--ogds-theme-border-radius-sm:2px;--ogds-theme-border-radius-md:.25rem;--ogds-theme-border-radius-lg:.5rem;--ogds-theme-column-gap-sm:2px;--ogds-theme-column-gap-md:1rem;--ogds-theme-column-gap-lg:1.5rem;--ogds-theme-column-gap-mobile:1rem;--ogds-theme-column-gap-desktop:2rem;--ogds-theme-grid-container-max-width:64rem;--ogds-theme-site-margins-breakpoint:64rem;--ogds-theme-site-margins-width:2rem;--ogds-theme-site-margins-mobile-width:1rem}`,E=s.css`:root,:host{--ogds-theme-type-scale-3xs:.8125rem;--ogds-theme-type-scale-2xs:.875rem;--ogds-theme-type-scale-xs:.9375rem;--ogds-theme-type-scale-sm:1rem;--ogds-theme-type-scale-md:1.0625rem;--ogds-theme-type-scale-lg:1.375rem;--ogds-theme-type-scale-xl:2rem;--ogds-theme-type-scale-2xl:2.5rem;--ogds-theme-type-scale-3xl:3rem;--ogds-theme-body-font-size:1rem;--ogds-theme-body-line-height:1.62;--ogds-theme-heading-line-height:1.2;--ogds-theme-display-font-size:3rem;--ogds-theme-h1-font-size:2.5rem;--ogds-theme-h2-font-size:2rem;--ogds-theme-h3-font-size:1.375rem;--ogds-theme-h4-font-size:1rem;--ogds-theme-h5-font-size:.9375rem;--ogds-theme-h6-font-size:.8125rem;--ogds-theme-lead-font-size:1.375rem;--ogds-theme-lead-line-height:1.75}`,m=new CSSStyleSheet;m.replaceSync([a.colorTokens,a.spacingTokens,x,z,C,A,E].map(i=>i.cssText).join(`
+`));function u(){document.adoptedStyleSheets.includes(m)||(document.adoptedStyleSheets=[...document.adoptedStyleSheets,m])}var _=Object.defineProperty,f=(i,e,t,n)=>{for(var o=void 0,c=i.length-1,l;c>=0;c--)(l=i[c])&&(o=l(e,t,o)||o);return o&&_(e,t,o),o},r;const h=(r=class extends s.LitElement{constructor(){super(...arguments),this.useListSemantics=!1,this.headingLevel=0}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),u(),r._sheet||(r._sheet=new CSSStyleSheet,r._sheet.replaceSync(`ogds-accordion, .ogds-accordion {
+          --icon-chevron-pointing-down: url("${a.iconChevronDown}");
+          --icon-chevron-pointing-up: url("${a.iconChevronUp}");
+          --icon-plus: url("${S}");
+          --icon-minus: url("${w}");
         }
-`+p.cssText),document.adoptedStyleSheets=[...document.adoptedStyleSheets,o._sheet]),this.detailsChildren=this.getDetailsChildren(),this.childRoles=new Map(Array.from(this.detailsChildren??[]).map(e=>[e,new Set]))}firstUpdated(){if(this.useListSemantics&&this.headingLevel!==0){console.warn("<ogds-accordion>: use-list-semantics and heading-level are mutually exclusive. Screen readers cannot reliably announce both list position and heading level on the same element. Remove one attribute.");return}this.addListSemantics(),this.addHeadingSemantics(),this.applyChildRoles()}getDetailsChildren(){const e=this.getElementsByTagName("details");if(e.length>0)return e;console.error("<ogds-accordion>: This component expects to have at least one details element as a child")}addListSemantics(){this.useListSemantics&&this.detailsChildren&&(Array.from(this.detailsChildren).forEach(e=>this.childRoles.get(e)?.add("listitem")),this.setAttribute("role","list"))}addHeadingSemantics(){const e=this.headingLevel;e!==0&&this.detailsChildren&&Array.from(this.detailsChildren).forEach(r=>{const c=r.querySelector("summary");c&&(c.setAttribute("role","heading"),c.setAttribute("aria-level",String(e)))})}applyChildRoles(){this.childRoles.forEach((e,r)=>{e.size>0&&r.setAttribute("role",Array.from(e).join(" "))})}render(){return s.nothing}},o._sheet=null,o);h([m.property({type:Boolean,attribute:"use-list-semantics"})],g.prototype,"useListSemantics");h([m.property({type:Number,attribute:"heading-level"})],g.prototype,"headingLevel");let f=g;d.defineCustomElement("ogds-accordion",f);exports.OgdsBanner=d.OgdsBanner;exports.OgdsAccordion=f;
+`+k.cssText),document.adoptedStyleSheets=[...document.adoptedStyleSheets,r._sheet]),this.detailsChildren=this.getDetailsChildren(),this.childRoles=new Map(Array.from(this.detailsChildren??[]).map(e=>[e,new Set]))}firstUpdated(){if(this.useListSemantics&&this.headingLevel!==0){console.warn("<ogds-accordion>: use-list-semantics and heading-level are mutually exclusive. Screen readers cannot reliably announce both list position and heading level on the same element. Remove one attribute.");return}this.addListSemantics(),this.addHeadingSemantics(),this.applyChildRoles()}getDetailsChildren(){const e=this.getElementsByTagName("details");if(e.length>0)return e;console.error("<ogds-accordion>: This component expects to have at least one details element as a child")}addListSemantics(){this.useListSemantics&&this.detailsChildren&&(Array.from(this.detailsChildren).forEach(e=>this.childRoles.get(e)?.add("listitem")),this.setAttribute("role","list"))}addHeadingSemantics(){const e=this.headingLevel;e!==0&&this.detailsChildren&&Array.from(this.detailsChildren).forEach(t=>{const n=t.querySelector("summary");n&&(n.setAttribute("role","heading"),n.setAttribute("aria-level",String(e)))})}applyChildRoles(){this.childRoles.forEach((e,t)=>{e.size>0&&t.setAttribute("role",Array.from(e).join(" "))})}render(){return s.nothing}},r._sheet=null,r);f([g.property({type:Boolean,attribute:"use-list-semantics"})],h.prototype,"useListSemantics");f([g.property({type:Number,attribute:"heading-level"})],h.prototype,"headingLevel");let b=h;a.defineCustomElement("ogds-accordion",b);const O=s.css`@layer ogds.components{ogds-accordion-toggle::part(button){appearance:none;background-color:var(--ogds-theme-button-fill-color);border-radius:var(--ogds-theme-button-border-radius);border-color:#0000;border-width:var(--ogds-theme-button-stroke-width);color:var(--ogds-theme-button-text-color);cursor:pointer;font-family:var(--ogds-theme-button-font-family);font-size:var(--ogds-theme-type-scale-md);padding:var(--ogds-spacing-105) var(--ogds-spacing-205);font-weight:700}ogds-accordion-toggle::part(button):hover{background-color:color-mix(in srgb,var(--ogds-theme-button-fill-color),black 20%)}ogds-accordion-toggle::part(button):focus{outline-offset:.25rem;outline:.25rem solid #2491ff}}`;var T=Object.defineProperty,y=(i,e,t,n)=>{for(var o=void 0,c=i.length-1,l;c>=0;c--)(l=i[c])&&(o=l(e,t,o)||o);return o&&T(e,t,o),o},d;const p=(d=class extends s.LitElement{constructor(){super(...arguments),this.controls="",this._anyOpen=!1,this._observer=null}connectedCallback(){if(super.connectedCallback(),u(),d._sheet||(d._sheet=new CSSStyleSheet,d._sheet.replaceSync(O.cssText),document.adoptedStyleSheets=[...document.adoptedStyleSheets,d._sheet]),this.controls==""){console.error("<ogds-accordion-toggle>: Component must have a controls attribute with the IDof an <ogds-accordion> component");return}this._anyOpen=this.checkOpen(),this._observer=new MutationObserver(()=>{this._anyOpen=this.checkOpen()});const e=document.getElementById(this.controls);e&&this._observer.observe(e,{subtree:!0,attributeFilter:["open"]})}disconnectedCallback(){super.disconnectedCallback(),this._observer?.disconnect(),this._observer=null}checkOpen(){return!!document.getElementById(this.controls)?.querySelector("details[open]")}toggleAll(){const e=document.getElementById(this.controls);if(!e){console.error("<ogds-accordion-toggle>: Unable to get an accordion component with the ID specfied in the controls attribute");return}const t=Array.from(e.getElementsByTagName("details")),n=t.some(o=>o.hasAttribute("open"));n?t.forEach(o=>o.toggleAttribute("open",!1)):t.forEach(o=>o.toggleAttribute("open",!0)),this._anyOpen=!n}render(){return s.html`
+      <button @click="${this.toggleAll}" part="button">
+        <slot name="expand-label" ?hidden="${this._anyOpen}">Expand All</slot>
+        <slot name="collapse-label" ?hidden="${!this._anyOpen}"
+          >Collapse All</slot
+        >
+      </button>
+    `}},d._sheet=null,d);y([g.property({type:String,attribute:"controls"})],p.prototype,"controls");y([g.state()],p.prototype,"_anyOpen");let v=p;a.defineCustomElement("ogds-accordion-toggle",v);exports.OgdsBanner=a.OgdsBanner;exports.OgdsAccordion=b;exports.OgdsAccordionToggle=v;

package/dist/components/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../src/shared/icons/add.svg","../../src/shared/icons/remove.svg","../../src/core/token-styles.ts","../../src/components/ogds-accordion/index.ts"],"sourcesContent":["export default \"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M19%2013h-6v6h-2v-6H5v-2h6V5h2v6h6v2z'/%3e%3c/svg%3e\"","export default \"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M19%2013H5v-2h14v2z'/%3e%3c/svg%3e\"","import colorTokens from \"@ogds/tokens/styles/css/colors.css\";\nimport spacingTokens from \"@ogds/tokens/styles/css/spacing.css\";\nimport typographyTokens from \"@ogds/tokens/styles/css/typography.css\";\nimport themeColorTokens from \"@ogds/tokens/styles/css/theme-color.css\";\nimport themeSpacingTokens from \"@ogds/tokens/styles/css/theme-spacing.css\";\nimport themeTypographyTokens from \"@ogds/tokens/styles/css/theme-typography.css\";\n\nconst sheet = new CSSStyleSheet();\nsheet.replaceSync(\n  [\n    colorTokens,\n    spacingTokens,\n    typographyTokens,\n    themeColorTokens,\n    themeSpacingTokens,\n    themeTypographyTokens,\n  ]\n    .map((s) => s.cssText)\n    .join(\"\\n\"),\n);\n\nexport function adoptTokenStyles() {\n  if (!document.adoptedStyleSheets.includes(sheet)) {\n    document.adoptedStyleSheets = [...document.adoptedStyleSheets, sheet];\n  }\n}\n","import { LitElement, nothing } from \"lit\";\n\nimport styles from \"./ogds-accordion.css\";\nimport iconChevronDown from \"../../shared/icons/expand_more.svg\";\nimport iconChevronUp from \"../../shared/icons/expand_less.svg\";\nimport iconPlus from \"../../shared/icons/add.svg\";\nimport iconMinus from \"../../shared/icons/remove.svg\";\n\nimport { adoptTokenStyles } from \"../../core/token-styles\";\nimport { defineCustomElement } from \"../../utils\";\nimport { property } from \"lit/decorators.js\";\n\n/**\n * @summary The ogds-accordion component.\n *\n * Apply these classes to `<ogds-accordion>` to enable variants:\n * - `bordered` — adds a border to expanded content\n * - `with-icon` — shows a chevron icon on each summary\n * - `with-icon plus` — uses plus/minus icons instead of chevrons\n * - `with-icon right` — aligns the icon to the right\n *\n * @cssprop --ogds-accordion-border - Border used in the bordered variant.\n * @cssprop --ogds-accordion-content-padding - Padding for the expanded content area.\n * @cssprop --ogds-accordion-icon-closed - Icon shown when a panel is closed. Defaults to a chevron pointing down. CSS-only users must set this to a url() value pointing to their own icon asset.\n * @cssprop --ogds-accordion-icon-open - Icon shown when a panel is open. Defaults to a chevron pointing up. CSS-only users must set this to a url() value pointing to their own icon asset.\n * @attribute {boolean} use-list-semantics - Adds `role=\"list\"` to the component and `role=\"listitem\"` to each `<details>` child, conveying the accordion as a list to assistive technologies. Mutually exclusive with `heading-level`.\n * @attribute {number} heading-level - Sets a heading level for each accordion panel by adding `role=\"heading\"` and the corresponding `aria-level` to each `<summary>` element. Has no effect when set to `0` (the default). Mutually exclusive with `use-list-semantics`.\n *\n * @slot - The default (only) slot for the <ogds-accordion> expects one or more plain HTML <details> elements.\n * @element ogds-accordion\n */\nexport class OgdsAccordion extends LitElement {\n  /** @ignore */\n  private static _sheet: CSSStyleSheet | null = null;\n\n  @property({ type: Boolean, attribute: \"use-list-semantics\" })\n  useListSemantics = false;\n\n  @property({ type: Number, attribute: \"heading-level\" })\n  headingLevel = 0;\n\n  declare detailsChildren: HTMLCollectionOf<HTMLDetailsElement> | undefined;\n  declare childRoles: Map<HTMLDetailsElement, Set<string>>;\n\n  override createRenderRoot() {\n    return this;\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n    adoptTokenStyles();\n    if (!OgdsAccordion._sheet) {\n      OgdsAccordion._sheet = new CSSStyleSheet();\n      OgdsAccordion._sheet.replaceSync(\n        `ogds-accordion, .ogds-accordion {\n          --icon-chevron-pointing-down: url(\"${iconChevronDown}\");\n          --icon-chevron-pointing-up: url(\"${iconChevronUp}\");\n          --icon-plus: url(\"${iconPlus}\");\n          --icon-minus: url(\"${iconMinus}\");\n        }\\n` + styles.cssText,\n      );\n      document.adoptedStyleSheets = [\n        ...document.adoptedStyleSheets,\n        OgdsAccordion._sheet,\n      ];\n    }\n    this.detailsChildren = this.getDetailsChildren();\n    this.childRoles = new Map(\n      Array.from(this.detailsChildren ?? []).map((el) => [el, new Set()]),\n    );\n  }\n\n  override firstUpdated() {\n    if (this.useListSemantics && this.headingLevel !== 0) {\n      console.warn(\n        \"<ogds-accordion>: use-list-semantics and heading-level are mutually exclusive. \" +\n          \"Screen readers cannot reliably announce both list position and heading level \" +\n          \"on the same element. Remove one attribute.\",\n      );\n      return;\n    }\n    this.addListSemantics();\n    this.addHeadingSemantics();\n    this.applyChildRoles();\n  }\n\n  getDetailsChildren() {\n    const detailsEls = this.getElementsByTagName(\"details\");\n    if (detailsEls.length > 0) {\n      return detailsEls;\n    } else {\n      console.error(\n        \"<ogds-accordion>: This component expects to have at least one details element as a child\",\n      );\n    }\n  }\n\n  addListSemantics() {\n    if (this.useListSemantics && this.detailsChildren) {\n      Array.from(this.detailsChildren).forEach((el) =>\n        this.childRoles.get(el)?.add(\"listitem\"),\n      );\n      this.setAttribute(\"role\", \"list\");\n    }\n  }\n\n  addHeadingSemantics() {\n    const headingLevel = this.headingLevel;\n\n    if (headingLevel !== 0 && this.detailsChildren) {\n      Array.from(this.detailsChildren).forEach((el) => {\n        const summary = el.querySelector(\"summary\");\n        if (summary) {\n          summary.setAttribute(\"role\", \"heading\");\n          summary.setAttribute(\"aria-level\", String(headingLevel));\n        }\n      });\n    }\n  }\n\n  applyChildRoles() {\n    this.childRoles.forEach((roles, el) => {\n      if (roles.size > 0) el.setAttribute(\"role\", Array.from(roles).join(\" \"));\n    });\n  }\n\n  render() {\n    return nothing;\n  }\n}\n\ndefineCustomElement(\"ogds-accordion\", OgdsAccordion);\n"],"names":["iconPlus","iconMinus","sheet","colorTokens","spacingTokens","typographyTokens","themeColorTokens","themeSpacingTokens","themeTypographyTokens","s","adoptTokenStyles","_OgdsAccordion","_a","LitElement","iconChevronDown","iconChevronUp","styles","el","detailsEls","headingLevel","summary","roles","nothing","__decorateClass","property","OgdsAccordion","defineCustomElement"],"mappings":"0lFAAAA,EAAe,4LCAfC,EAAe,g2KCOTC,EAAQ,IAAI,cAClBA,EAAM,YACJ,CACEC,EAAAA,YACAC,EAAAA,cACAC,EACAC,EACAC,EACAC,CAAA,EAEC,IAAKC,GAAMA,EAAE,OAAO,EACpB,KAAK;AAAA,CAAI,CACd,EAEO,SAASC,GAAmB,CAC5B,SAAS,mBAAmB,SAASR,CAAK,IAC7C,SAAS,mBAAqB,CAAC,GAAG,SAAS,mBAAoBA,CAAK,EAExE,sICMO,MAAMS,GAANC,EAAA,cAA4BC,YAAW,CAAvC,aAAA,CAAA,MAAA,GAAA,SAAA,EAKL,KAAA,iBAAmB,GAGnB,KAAA,aAAe,CAAA,CAKN,kBAAmB,CAC1B,OAAO,IACT,CAES,mBAAoB,CAC3B,MAAM,kBAAA,EACNH,EAAA,EACKE,EAAc,SACjBA,EAAc,OAAS,IAAI,cAC3BA,EAAc,OAAO,YACnB;AAAA,+CACuCE,iBAAe;AAAA,6CACjBC,eAAa;AAAA,8BAC5Bf,CAAQ;AAAA,+BACPC,CAAS;AAAA;AAAA,EACzBe,EAAO,OAAA,EAEhB,SAAS,mBAAqB,CAC5B,GAAG,SAAS,mBACZJ,EAAc,MAAA,GAGlB,KAAK,gBAAkB,KAAK,mBAAA,EAC5B,KAAK,WAAa,IAAI,IACpB,MAAM,KAAK,KAAK,iBAAmB,CAAA,CAAE,EAAE,IAAKK,GAAO,CAACA,EAAI,IAAI,GAAK,CAAC,CAAA,CAEtE,CAES,cAAe,CACtB,GAAI,KAAK,kBAAoB,KAAK,eAAiB,EAAG,CACpD,QAAQ,KACN,wMAAA,EAIF,MACF,CACA,KAAK,iBAAA,EACL,KAAK,oBAAA,EACL,KAAK,gBAAA,CACP,CAEA,oBAAqB,CACnB,MAAMC,EAAa,KAAK,qBAAqB,SAAS,EACtD,GAAIA,EAAW,OAAS,EACtB,OAAOA,EAEP,QAAQ,MACN,0FAAA,CAGN,CAEA,kBAAmB,CACb,KAAK,kBAAoB,KAAK,kBAChC,MAAM,KAAK,KAAK,eAAe,EAAE,QAASD,GACxC,KAAK,WAAW,IAAIA,CAAE,GAAG,IAAI,UAAU,CAAA,EAEzC,KAAK,aAAa,OAAQ,MAAM,EAEpC,CAEA,qBAAsB,CACpB,MAAME,EAAe,KAAK,aAEtBA,IAAiB,GAAK,KAAK,iBAC7B,MAAM,KAAK,KAAK,eAAe,EAAE,QAASF,GAAO,CAC/C,MAAMG,EAAUH,EAAG,cAAc,SAAS,EACtCG,IACFA,EAAQ,aAAa,OAAQ,SAAS,EACtCA,EAAQ,aAAa,aAAc,OAAOD,CAAY,CAAC,EAE3D,CAAC,CAEL,CAEA,iBAAkB,CAChB,KAAK,WAAW,QAAQ,CAACE,EAAOJ,IAAO,CACjCI,EAAM,KAAO,GAAGJ,EAAG,aAAa,OAAQ,MAAM,KAAKI,CAAK,EAAE,KAAK,GAAG,CAAC,CACzE,CAAC,CACH,CAEA,QAAS,CACP,OAAOC,EAAAA,OACT,CACF,EAhGEV,EAAe,OAA+B,KAFzCA,GAKLW,EAAA,CADCC,EAAAA,SAAS,CAAE,KAAM,QAAS,UAAW,qBAAsB,CAAA,EAJjDb,EAKX,UAAA,kBAAA,EAGAY,EAAA,CADCC,EAAAA,SAAS,CAAE,KAAM,OAAQ,UAAW,gBAAiB,CAAA,EAP3Cb,EAQX,UAAA,cAAA,EARK,IAAMc,EAANd,EAoGPe,EAAAA,oBAAoB,iBAAkBD,CAAa"}
+{"version":3,"file":"index.cjs","sources":["../../src/shared/icons/add.svg","../../src/shared/icons/remove.svg","../../src/core/token-styles.ts","../../src/components/ogds-accordion/index.ts","../../src/components/ogds-accordion-toggle/index.ts"],"sourcesContent":["export default \"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M19%2013h-6v6h-2v-6H5v-2h6V5h2v6h6v2z'/%3e%3c/svg%3e\"","export default \"data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%3e%3cpath%20d='M19%2013H5v-2h14v2z'/%3e%3c/svg%3e\"","import colorTokens from \"@ogds/tokens/styles/css/colors.css\";\nimport spacingTokens from \"@ogds/tokens/styles/css/spacing.css\";\nimport typographyTokens from \"@ogds/tokens/styles/css/typography.css\";\nimport themeColorTokens from \"@ogds/tokens/styles/css/theme-color.css\";\nimport themeComponentTokens from \"@ogds/tokens/styles/css/theme-components.css\";\nimport themeSpacingTokens from \"@ogds/tokens/styles/css/theme-spacing.css\";\nimport themeTypographyTokens from \"@ogds/tokens/styles/css/theme-typography.css\";\n\nconst sheet = new CSSStyleSheet();\nsheet.replaceSync(\n  [\n    colorTokens,\n    spacingTokens,\n    typographyTokens,\n    themeColorTokens,\n    themeComponentTokens,\n    themeSpacingTokens,\n    themeTypographyTokens,\n  ]\n    .map((s) => s.cssText)\n    .join(\"\\n\"),\n);\n\nexport function adoptTokenStyles() {\n  if (!document.adoptedStyleSheets.includes(sheet)) {\n    document.adoptedStyleSheets = [...document.adoptedStyleSheets, sheet];\n  }\n}\n","import { LitElement, nothing } from \"lit\";\n\nimport styles from \"./ogds-accordion.css\";\nimport iconChevronDown from \"../../shared/icons/expand_more.svg\";\nimport iconChevronUp from \"../../shared/icons/expand_less.svg\";\nimport iconPlus from \"../../shared/icons/add.svg\";\nimport iconMinus from \"../../shared/icons/remove.svg\";\n\nimport { adoptTokenStyles } from \"../../core/token-styles\";\nimport { defineCustomElement } from \"../../utils\";\nimport { property } from \"lit/decorators.js\";\n\n/**\n * @summary The ogds-accordion component.\n *\n * Apply these classes to `<ogds-accordion>` to enable variants:\n * - `bordered` — adds a border to expanded content\n * - `with-icon` — shows a chevron icon on each summary\n * - `with-icon plus` — uses plus/minus icons instead of chevrons\n * - `with-icon right` — aligns the icon to the right\n *\n * @cssprop --ogds-accordion-border - Border used in the bordered variant.\n * @cssprop --ogds-accordion-content-padding - Padding for the expanded content area.\n * @cssprop --ogds-accordion-icon-closed - Icon shown when a panel is closed. Defaults to a chevron pointing down. CSS-only users must set this to a url() value pointing to their own icon asset.\n * @cssprop --ogds-accordion-icon-open - Icon shown when a panel is open. Defaults to a chevron pointing up. CSS-only users must set this to a url() value pointing to their own icon asset.\n * @attribute {boolean} use-list-semantics - Adds `role=\"list\"` to the component and `role=\"listitem\"` to each `<details>` child, conveying the accordion as a list to assistive technologies. Mutually exclusive with `heading-level`.\n * @attribute {number} heading-level - Sets a heading level for each accordion panel by adding `role=\"heading\"` and the corresponding `aria-level` to each `<summary>` element. Has no effect when set to `0` (the default). Mutually exclusive with `use-list-semantics`.\n *\n * @slot - The default (only) slot for the <ogds-accordion> expects one or more plain HTML <details> elements.\n * @element ogds-accordion\n */\nexport class OgdsAccordion extends LitElement {\n  /** @ignore */\n  private static _sheet: CSSStyleSheet | null = null;\n\n  @property({ type: Boolean, attribute: \"use-list-semantics\" })\n  useListSemantics = false;\n\n  @property({ type: Number, attribute: \"heading-level\" })\n  headingLevel = 0;\n\n  declare detailsChildren: HTMLCollectionOf<HTMLDetailsElement> | undefined;\n  declare childRoles: Map<HTMLDetailsElement, Set<string>>;\n\n  override createRenderRoot() {\n    return this;\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n    adoptTokenStyles();\n    if (!OgdsAccordion._sheet) {\n      OgdsAccordion._sheet = new CSSStyleSheet();\n      OgdsAccordion._sheet.replaceSync(\n        `ogds-accordion, .ogds-accordion {\n          --icon-chevron-pointing-down: url(\"${iconChevronDown}\");\n          --icon-chevron-pointing-up: url(\"${iconChevronUp}\");\n          --icon-plus: url(\"${iconPlus}\");\n          --icon-minus: url(\"${iconMinus}\");\n        }\\n` + styles.cssText,\n      );\n      document.adoptedStyleSheets = [\n        ...document.adoptedStyleSheets,\n        OgdsAccordion._sheet,\n      ];\n    }\n    this.detailsChildren = this.getDetailsChildren();\n    this.childRoles = new Map(\n      Array.from(this.detailsChildren ?? []).map((el) => [el, new Set()]),\n    );\n  }\n\n  override firstUpdated() {\n    if (this.useListSemantics && this.headingLevel !== 0) {\n      console.warn(\n        \"<ogds-accordion>: use-list-semantics and heading-level are mutually exclusive. \" +\n          \"Screen readers cannot reliably announce both list position and heading level \" +\n          \"on the same element. Remove one attribute.\",\n      );\n      return;\n    }\n    this.addListSemantics();\n    this.addHeadingSemantics();\n    this.applyChildRoles();\n  }\n\n  getDetailsChildren() {\n    const detailsEls = this.getElementsByTagName(\"details\");\n    if (detailsEls.length > 0) {\n      return detailsEls;\n    } else {\n      console.error(\n        \"<ogds-accordion>: This component expects to have at least one details element as a child\",\n      );\n    }\n  }\n\n  addListSemantics() {\n    if (this.useListSemantics && this.detailsChildren) {\n      Array.from(this.detailsChildren).forEach((el) =>\n        this.childRoles.get(el)?.add(\"listitem\"),\n      );\n      this.setAttribute(\"role\", \"list\");\n    }\n  }\n\n  addHeadingSemantics() {\n    const headingLevel = this.headingLevel;\n\n    if (headingLevel !== 0 && this.detailsChildren) {\n      Array.from(this.detailsChildren).forEach((el) => {\n        const summary = el.querySelector(\"summary\");\n        if (summary) {\n          summary.setAttribute(\"role\", \"heading\");\n          summary.setAttribute(\"aria-level\", String(headingLevel));\n        }\n      });\n    }\n  }\n\n  applyChildRoles() {\n    this.childRoles.forEach((roles, el) => {\n      if (roles.size > 0) el.setAttribute(\"role\", Array.from(roles).join(\" \"));\n    });\n  }\n\n  render() {\n    return nothing;\n  }\n}\n\ndefineCustomElement(\"ogds-accordion\", OgdsAccordion);\n","import { LitElement, html } from \"lit\";\nimport { adoptTokenStyles } from \"../../core/token-styles\";\nimport { defineCustomElement } from \"../../utils\";\n\nimport { property, state } from \"lit/decorators.js\";\nimport styles from \"./ogds-accordion-toggle.css\";\n\n/**\n * @summary A button that expands or collapses all panels in an associated `<ogds-accordion>`.\n *\n * @attribute {string} controls - The `id` of the `<ogds-accordion>` to control. Required.\n *\n * @slot expand-label - Button label when all panels are collapsed. Defaults to \"Expand All\".\n * @slot collapse-label - Button label when one or more panels are open. Defaults to \"Collapse All\".\n *\n * @csspart button - The toggle button.\n *\n * @element ogds-accordion-toggle\n */\nexport class OgdsAccordionToggle extends LitElement {\n  /** @ignore */\n  private static _sheet: CSSStyleSheet | null = null;\n\n  @property({ type: String, attribute: \"controls\" })\n  controls = \"\";\n\n  @state()\n  private _anyOpen = false;\n\n  private _observer: MutationObserver | null = null;\n\n  override connectedCallback() {\n    super.connectedCallback();\n    adoptTokenStyles();\n    if (!OgdsAccordionToggle._sheet) {\n      OgdsAccordionToggle._sheet = new CSSStyleSheet();\n      OgdsAccordionToggle._sheet.replaceSync(styles.cssText);\n      document.adoptedStyleSheets = [\n        ...document.adoptedStyleSheets,\n        OgdsAccordionToggle._sheet,\n      ];\n    }\n    if (this.controls == \"\") {\n      console.error(\n        \"<ogds-accordion-toggle>: Component must have a controls attribute with the ID\" +\n          \"of an <ogds-accordion> component\",\n      );\n      return;\n    }\n    this._anyOpen = this.checkOpen();\n    this._observer = new MutationObserver(() => {\n      this._anyOpen = this.checkOpen();\n    });\n    const accordionEl = document.getElementById(this.controls);\n    if (accordionEl) {\n      this._observer.observe(accordionEl, {\n        subtree: true,\n        attributeFilter: [\"open\"],\n      });\n    }\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this._observer?.disconnect();\n    this._observer = null;\n  }\n\n  checkOpen() {\n    const accordionEl = document.getElementById(this.controls);\n    const openDetails = accordionEl?.querySelector(\"details[open]\");\n    return !!openDetails;\n  }\n\n  toggleAll() {\n    const accordionEl = document.getElementById(this.controls);\n    if (!accordionEl) {\n      console.error(\n        \"<ogds-accordion-toggle>: Unable to get an accordion component with the ID\" +\n          \" specfied in the controls attribute\",\n      );\n      return;\n    }\n\n    const detailsEls = Array.from(accordionEl.getElementsByTagName(\"details\"));\n    const anyOpen = detailsEls.some((d) => d.hasAttribute(\"open\"));\n    if (!anyOpen) {\n      detailsEls.forEach((d) => d.toggleAttribute(\"open\", true));\n    } else {\n      detailsEls.forEach((d) => d.toggleAttribute(\"open\", false));\n    }\n    this._anyOpen = !anyOpen;\n  }\n\n  protected override render(): unknown {\n    return html`\n      <button @click=\"${this.toggleAll}\" part=\"button\">\n        <slot name=\"expand-label\" ?hidden=\"${this._anyOpen}\">Expand All</slot>\n        <slot name=\"collapse-label\" ?hidden=\"${!this._anyOpen}\"\n          >Collapse All</slot\n        >\n      </button>\n    `;\n  }\n}\n\ndefineCustomElement(\"ogds-accordion-toggle\", OgdsAccordionToggle);\n"],"names":["iconPlus","iconMinus","sheet","colorTokens","spacingTokens","typographyTokens","themeColorTokens","themeComponentTokens","themeSpacingTokens","themeTypographyTokens","s","adoptTokenStyles","_OgdsAccordion","_a","LitElement","iconChevronDown","iconChevronUp","styles","el","detailsEls","headingLevel","summary","roles","nothing","__decorateClass","property","OgdsAccordion","defineCustomElement","_OgdsAccordionToggle","accordionEl","anyOpen","d","html","state","OgdsAccordionToggle"],"mappings":"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"}

package/dist/components/index.d.ts

@@ -1,3 +1,4 @@
 import { OgdsBanner } from './ogds-banner';
 import { OgdsAccordion } from './ogds-accordion';
-export { OgdsBanner, OgdsAccordion };
+import { OgdsAccordionToggle } from './ogds-accordion-toggle';
+export { OgdsBanner, OgdsAccordion, OgdsAccordionToggle };