@fpkit/acss 0.5.13 → 0.6.1

package/libs/components/list/list.d.ts

@@ -1,39 +1,126 @@
-import * as React from 'react';
-import { U as UI } from '../../ui-645f95b5.js';
+import React from 'react';
+import { L as ListItemProps, a as ListProps } from '../../list.types-d26de310.js';
+import '../../ui-d01b50d4.js';
 
-type ListProps = {
-    /** Type of list to render (default: 'ul') */
-    type?: 'ul' | 'ol' | 'dl';
-    /** variant of list to render (default: 'none') */
-    variant?: string;
-} & React.ComponentProps<typeof UI>;
-type ListItemProps = {
-    /** Type of list item to render (default: 'li') */
-    type?: 'li' | 'dt' | 'dd';
-} & React.ComponentProps<typeof UI>;
 /**
- * ListItem component
- * @param type - HTML tag type for the list item (default: 'li')
- * @param styles - CSS styles object
- * @param children - Child elements to be rendered inside the list item
- * @param props - Additional props to be passed to the underlying HTML element
- * @returns A React component that renders a list item
+ * ListItem - A flexible list item component for ul, ol, and dl lists.
+ *
+ * This component renders different HTML elements (li, dt, dd) based on the parent
+ * list type, maintaining semantic HTML and accessibility best practices.
+ *
+ * ## Key Features:
+ * - **Semantic HTML**: Renders appropriate element type (li, dt, dd)
+ * - **Type-Safe**: Full TypeScript support with comprehensive props
+ * - **Ref Forwarding**: Enables direct DOM access for focus management
+ * - **Customizable**: Supports custom styles and CSS classes
+ *
+ * ## Accessibility:
+ * - ✅ Uses semantic HTML elements
+ * - ✅ Works with screen readers out of the box
+ * - ✅ Supports all native HTML attributes
+ * - ✅ Ref forwarding for programmatic focus
+ *
+ * @example
+ * ```tsx
+ * // Standard list item
+ * <ListItem>Item content</ListItem>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Definition term
+ * <ListItem type="dt">Term to define</ListItem>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Definition description
+ * <ListItem type="dd">The definition text</ListItem>
+ * ```
+ *
+ * @param {ListItemProps} props - Component props
+ * @param {React.Ref} ref - Forwarded ref for DOM access
+ * @returns {React.ReactElement} A list item element
  */
-declare const ListItem: ({ type, id, styles, children, classes, ...props }: ListItemProps) => React.JSX.Element;
+declare const ListItem: React.ForwardRefExoticComponent<Omit<ListItemProps, "ref"> & React.RefAttributes<HTMLElement | HTMLLIElement>>;
 /**
- * List component renders a list element with provided props
- * @param children - Child elements to render inside the list
- * @param classes - CSS classes to apply
- * @param type - Type of list element (default: 'ul')
- * @param variant - Variant for styling purposes
- * @param styles - Inline styles object
- * @param role - ARIA role
- * @param props - Additional props to pass to underlying element
+ * List - A flexible, accessible list component for creating ul, ol, and dl lists.
+ *
+ * This component provides a type-safe, accessible way to create different types of lists
+ * with built-in support for custom styling, variants, and WCAG 2.1 AA compliance.
+ *
+ * ## Key Features:
+ * - **Multiple List Types**: Supports ul (unordered), ol (ordered), and dl (definition) lists
+ * - **Semantic HTML**: Uses native HTML list elements for proper accessibility
+ * - **Customizable Styling**: CSS custom properties and variant support
+ * - **Type-Safe**: Comprehensive TypeScript types with JSDoc
+ * - **Ref Forwarding**: Direct DOM access for scroll positioning and focus management
+ * - **WCAG 2.1 AA**: Meets accessibility standards with proper semantic structure
+ *
+ * ## Accessibility:
+ * - ✅ WCAG 2.1 AA compliant using semantic HTML
+ * - ✅ Screen reader compatible (announced as "list" with item count)
+ * - ✅ Supports role="list" override for styled lists (Safari/VoiceOver compatibility)
+ * - ✅ Keyboard navigation works naturally with focusable children
+ * - ✅ Ref forwarding for programmatic focus management
+ *
+ * ## Common Use Cases:
+ * - **Navigation menus** - Use ul with variant="inline" or "none"
+ * - **Sequential steps** - Use ol for numbered instructions
+ * - **Glossaries** - Use dl for term-definition pairs
+ * - **Feature lists** - Use ul for product features
+ *
+ * @example
+ * ```tsx
+ * // Basic unordered list
+ * <List>
+ *   <List.ListItem>First item</List.ListItem>
+ *   <List.ListItem>Second item</List.ListItem>
+ * </List>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Ordered list with custom styling
+ * <List
+ *   type="ol"
+ *   variant="numbered"
+ *   styles={{ '--list-marker-color': '#0066cc' }}
+ * >
+ *   <List.ListItem>Step one</List.ListItem>
+ *   <List.ListItem>Step two</List.ListItem>
+ * </List>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Unstyled list with role restoration for accessibility
+ * // IMPORTANT: Use role="list" when removing list styling
+ * <List variant="none" role="list">
+ *   <List.ListItem>Navigation link</List.ListItem>
+ *   <List.ListItem>Another link</List.ListItem>
+ * </List>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Definition list
+ * <List type="dl">
+ *   <List.ListItem type="dt">React</List.ListItem>
+ *   <List.ListItem type="dd">A JavaScript library for building UIs</List.ListItem>
+ *   <List.ListItem type="dt">TypeScript</List.ListItem>
+ *   <List.ListItem type="dd">JavaScript with syntax for types</List.ListItem>
+ * </List>
+ * ```
+ *
+ * @param {ListProps} props - Component props
+ * @param {React.Ref} ref - Forwarded ref for DOM access
+ * @returns {React.ReactElement} A list element (ul, ol, or dl)
  */
-declare const List: {
-    ({ children, classes, type, variant, styles, role, ...props }: ListProps): React.JSX.Element;
-    displayName: string;
-    ListItem: ({ type, id, styles, children, classes, ...props }: ListItemProps) => React.JSX.Element;
-};
+declare const List: React.ForwardRefExoticComponent<Omit<ListProps, "ref"> & React.RefAttributes<HTMLDListElement | HTMLOListElement | HTMLUListElement>>;
+interface ListComponent extends React.ForwardRefExoticComponent<ListProps & React.RefAttributes<HTMLUListElement | HTMLOListElement | HTMLDListElement>> {
+    ListItem: typeof ListItem;
+}
+declare const _default: ListComponent;
 
-export { List, ListItem, ListItemProps, List as default };
+export { List, ListComponent, ListItem, ListItemProps, ListProps, _default as default };

package/libs/components/list/list.js

@@ -1,4 +1,4 @@
-export { b as List, a as ListItem, c as default } from '../../chunk-SMYRLO3E.js';
-import '../../chunk-KUKIVRC2.js';
+export { b as List, a as ListItem, c as default } from '../../chunk-IEB64SWY.js';
+import '../../chunk-HHLNOC5T.js';
 //# sourceMappingURL=out.js.map
 //# sourceMappingURL=list.js.map

package/libs/components/list/list.min.css

@@ -0,0 +1,3 @@
+ul,ol,dl{--list-margin-top: 0;--list-margin-bottom: 1rem;--list-margin-inline: 0;--list-padding-inline: 2.5rem;--list-gap: 0.5rem;--list-marker-color: currentColor;--list-marker-size: 1em;--list-marker-offset: 0.5rem;--list-font-size: 1rem;--list-line-height: 1.5;--list-font-family: inherit;--list-color: inherit;--list-item-margin-bottom: 0.5rem;--list-item-padding-inline: 0;--list-item-padding-block: 0;--dt-font-weight: 600;--dt-margin-bottom: 0.25rem;--dd-margin-inline-start: 2rem;--dd-margin-bottom: 1rem}ul,ol,dl{margin-block-start:var(--list-margin-top);margin-block-end:var(--list-margin-bottom);margin-inline:var(--list-margin-inline);padding-inline-start:var(--list-padding-inline);font-size:var(--list-font-size);line-height:var(--list-line-height);font-family:var(--list-font-family);color:var(--list-color)}ul ul,ul ol,ul dl,ol ul,ol ol,ol dl,dl ul,dl ol,dl dl{margin-block-start:var(--list-gap);margin-block-end:var(--list-gap)}ul{list-style-type:disc}ul::marker{color:var(--list-marker-color);font-size:var(--list-marker-size)}ul ul{list-style-type:circle}ul ul ul{list-style-type:square}ol{list-style-type:decimal}ol::marker{color:var(--list-marker-color);font-size:var(--list-marker-size)}ol ol{list-style-type:lower-alpha}ol ol ol{list-style-type:lower-roman}li{margin-block-end:var(--list-item-margin-bottom);padding-inline:var(--list-item-padding-inline);padding-block:var(--list-item-padding-block);padding-inline-start:var(--list-marker-offset)}li:last-child{margin-block-end:0}dl{padding-inline-start:0}dt{font-weight:var(--dt-font-weight);margin-block-end:var(--dt-margin-bottom);padding-inline:var(--list-item-padding-inline);padding-block:var(--list-item-padding-block)}dd{margin-inline-start:var(--dd-margin-inline-start);margin-block-end:var(--dd-margin-bottom);padding-inline:var(--list-item-padding-inline);padding-block:var(--list-item-padding-block)}dd:last-child{margin-block-end:0}ul[data-variant=none],ol[data-variant=none],dl[data-variant=none]{list-style-type:none;padding-inline-start:0}ul[data-variant=none] li,ol[data-variant=none] li,dl[data-variant=none] li{padding-inline-start:0}ul[data-variant=inline],ol[data-variant=inline],dl[data-variant=inline]{display:flex;flex-direction:row;flex-wrap:wrap;gap:var(--list-gap);padding-inline-start:0;list-style-type:none}ul[data-variant=inline] li,ol[data-variant=inline] li,dl[data-variant=inline] li{padding-inline-start:0;margin-block-end:0}ul[data-variant=custom],ol[data-variant=custom],dl[data-variant=custom]{list-style-type:none;padding-inline-start:0}ul[data-variant=custom] li,ol[data-variant=custom] li,dl[data-variant=custom] li{position:relative;padding-inline-start:calc(var(--list-marker-size) + var(--list-marker-offset))}ul[data-variant=custom] li::before,ol[data-variant=custom] li::before,dl[data-variant=custom] li::before{content:var(--list-marker-content, "•");color:var(--list-marker-color);font-size:var(--list-marker-size);position:absolute;left:0}ul[data-variant=compact],ol[data-variant=compact],dl[data-variant=compact]{--list-gap: 0.25rem;--list-item-margin-bottom: 0.25rem;--list-margin-bottom: 0.5rem}ul[data-variant=spaced],ol[data-variant=spaced],dl[data-variant=spaced]{--list-gap: 1rem;--list-item-margin-bottom: 1rem}li:has(a:focus-visible),li:has(button:focus-visible){outline:.0625rem solid rgba(0,0,0,0)}li:has(>a),li:has(>button){margin-block-end:0}@media print{ul,ol,dl{--list-margin-bottom: 0.5rem;--list-item-margin-bottom: 0.25rem}ul,ol{list-style-position:inside}}@media(prefers-reduced-motion: reduce){ul,ol,dl,li,dt,dd{animation:none;transition:none}}
+
+/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImxpc3QuY3NzIiwiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvbGlzdC9saXN0LnNjc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsU0NhQSxvQkFJRSxDQUFBLDBCQUNBLENBQUEsdUJBQ0EsQ0FBQSw2QkFDQSxDQUFBLGtCQUNBLENBQUEsaUNBR0EsQ0FBQSx1QkFDQSxDQUFBLDRCQUNBLENBQUEsc0JBR0EsQ0FBQSx1QkFDQSxDQUFBLDJCQUNBLENBQUEscUJBQ0EsQ0FBQSxpQ0FHQSxDQUFBLDZCQUNBLENBQUEsNEJBQ0EsQ0FBQSxxQkFHQSxDQUFBLDJCQUNBLENBQUEsOEJBQ0EsQ0FBQSx3QkFDQSxDQUFBLFNBT0YseUNBR0UsQ0FBQSwwQ0FDQSxDQUFBLHVDQUNBLENBQUEsK0NBQ0EsQ0FBQSwrQkFDQSxDQUFBLG1DQUNBLENBQUEsbUNBQ0EsQ0FBQSx1QkFDQSxDQUFBLHNEQUdBLGtDQUdFLENBQUEsZ0NBQ0EsQ0FBQSxHQVFKLG9CQUNFLENBQUEsV0FHQSw4QkFDRSxDQUFBLGlDQUNBLENBQUEsTUFJRixzQkFDRSxDQUFBLFNBRUEsc0JBQ0UsQ0FBQSxHQVNOLHVCQUNFLENBQUEsV0FHQSw4QkFDRSxDQUFBLGlDQUNBLENBQUEsTUFJRiwyQkFDRSxDQUFBLFNBRUEsMkJBQ0UsQ0FBQSxHQVNOLCtDQUNFLENBQUEsOENBQ0EsQ0FBQSw0Q0FDQSxDQUFBLDhDQVFBLENBQUEsY0FMQSxrQkFDRSxDQUFBLEdBV0osc0JBQ0UsQ0FBQSxHQUlGLGlDQUNFLENBQUEsd0NBQ0EsQ0FBQSw4Q0FDQSxDQUFBLDRDQUNBLENBQUEsR0FJRixpREFDRSxDQUFBLHdDQUNBLENBQUEsOENBQ0EsQ0FBQSw0Q0FDQSxDQUFBLGNBRUEsa0JBQ0UsQ0FBQSxrRUFZRixvQkFDRSxDQUFBLHNCQUNBLENBQUEsMkVBRUEsc0JBQ0UsQ0FBQSx3RUFLSixZQUNFLENBQUEsa0JBQ0EsQ0FBQSxjQUNBLENBQUEsbUJBQ0EsQ0FBQSxzQkFDQSxDQUFBLG9CQUNBLENBQUEsaUZBRUEsc0JBQ0UsQ0FBQSxrQkFDQSxDQUFBLHdFQUtKLG9CQUNFLENBQUEsc0JBQ0EsQ0FBQSxpRkFFQSxpQkFDRSxDQUFBLDhFQUNBLENBQUEseUdBS0EsdUNBQ0UsQ0FBQSw4QkFDQSxDQUFBLGlDQUNBLENBQUEsaUJBQ0EsQ0FBQSxNQUNBLENBQUEsMkVBTU4sbUJBQ0UsQ0FBQSxrQ0FDQSxDQUFBLDRCQUNBLENBQUEsd0VBSUYsZ0JBQ0UsQ0FBQSwrQkFDQSxDQUFBLHFEQVNKLG9DQUdFLENBQUEsMkJBSUYsa0JBR0UsQ0FBQSxhQU9GLFNBQ0UsNEJBSUUsQ0FBQSxrQ0FDQSxDQUFBLE1BSUYsMEJBRUUsQ0FBQSxDQUFBLHVDQVFKLGtCQUVFLGNBTUUsQ0FBQSxlQUNBLENBQUEiLCJmaWxlIjoibGlzdC5taW4uY3NzIn0= */

package/libs/components/modal.cjs

@@ -1,14 +1,16 @@
 'use strict';
 
-var chunkROZI23GS_cjs = require('../chunk-ROZI23GS.cjs');
-require('../chunk-J32EZPYD.cjs');
-require('../chunk-L75OQKEI.cjs');
+var chunkDKTHCQ5P_cjs = require('../chunk-DKTHCQ5P.cjs');
+require('../chunk-GT77BX4L.cjs');
+require('../chunk-PNWIRCG3.cjs');
+require('../chunk-TON2YGMD.cjs');
+require('../chunk-ENTCUJ3A.cjs');
 
 
 
 Object.defineProperty(exports, 'Modal', {
 	enumerable: true,
-	get: function () { return chunkROZI23GS_cjs.a; }
+	get: function () { return chunkDKTHCQ5P_cjs.a; }
 });
 //# sourceMappingURL=out.js.map
 //# sourceMappingURL=modal.cjs.map

package/libs/components/modal.d.cts

@@ -1,34 +1,34 @@
-import React__default from 'react';
-import { C as ComponentProps } from '../component-props-a8a2f97e.js';
+import React from 'react';
+import { C as ComponentProps } from '../component-props-67d978a2.js';
 
 interface ModalProps extends ComponentProps {
     /**
      * The child component/content for open button
      */
-    openChild?: React__default.ReactNode;
+    openChild?: React.ReactNode;
     /**
      * The child component/content for close button
      */
-    closeChild?: React__default.ReactNode;
+    closeChild?: React.ReactNode;
     /**
      * The child component/content for modal header
      */
-    modalHeader?: React__default.ReactNode;
+    modalHeader?: React.ReactNode;
     /**
      * The child component/content for modal footer
      */
-    modalFooter?: React__default.ReactNode;
+    modalFooter?: React.ReactNode;
     /**
      * The child component/content for modal body
      */
-    children: React__default.ReactNode;
+    children: React.ReactNode;
     /**
      * Open modal on mount when set to true
      */
     showOpen?: boolean;
 }
 declare const Modal: {
-    ({ openChild, closeChild, modalHeader, modalFooter, children, showOpen, ...props }: ModalProps): React__default.JSX.Element;
+    ({ openChild, closeChild, modalHeader, modalFooter, children, showOpen, ...props }: ModalProps): React.JSX.Element;
     displayName: string;
 };
 

package/libs/components/modal.d.ts

@@ -1,34 +1,34 @@
-import React__default from 'react';
-import { C as ComponentProps } from '../component-props-a8a2f97e.js';
+import React from 'react';
+import { C as ComponentProps } from '../component-props-67d978a2.js';
 
 interface ModalProps extends ComponentProps {
     /**
      * The child component/content for open button
      */
-    openChild?: React__default.ReactNode;
+    openChild?: React.ReactNode;
     /**
      * The child component/content for close button
      */
-    closeChild?: React__default.ReactNode;
+    closeChild?: React.ReactNode;
     /**
      * The child component/content for modal header
      */
-    modalHeader?: React__default.ReactNode;
+    modalHeader?: React.ReactNode;
     /**
      * The child component/content for modal footer
      */
-    modalFooter?: React__default.ReactNode;
+    modalFooter?: React.ReactNode;
     /**
      * The child component/content for modal body
      */
-    children: React__default.ReactNode;
+    children: React.ReactNode;
     /**
      * Open modal on mount when set to true
      */
     showOpen?: boolean;
 }
 declare const Modal: {
-    ({ openChild, closeChild, modalHeader, modalFooter, children, showOpen, ...props }: ModalProps): React__default.JSX.Element;
+    ({ openChild, closeChild, modalHeader, modalFooter, children, showOpen, ...props }: ModalProps): React.JSX.Element;
     displayName: string;
 };
 

package/libs/components/modal.js

@@ -1,5 +1,7 @@
-export { a as Modal } from '../chunk-ZANSFMTD.js';
-import '../chunk-QLZWHAMK.js';
-import '../chunk-KUKIVRC2.js';
+export { a as Modal } from '../chunk-7XPFW7CB.js';
+import '../chunk-OVWLQYMK.js';
+import '../chunk-BFK62VX5.js';
+import '../chunk-75QHTLFO.js';
+import '../chunk-HHLNOC5T.js';
 //# sourceMappingURL=out.js.map
 //# sourceMappingURL=modal.js.map

package/libs/components/nav/nav.cjs

@@ -2,27 +2,27 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var chunk2LTJ7HHX_cjs = require('../../chunk-2LTJ7HHX.cjs');
-require('../../chunk-XTQKWY7W.cjs');
-require('../../chunk-L75OQKEI.cjs');
+var chunkO5XAJ7BY_cjs = require('../../chunk-O5XAJ7BY.cjs');
+require('../../chunk-GUJSMQ3V.cjs');
+require('../../chunk-ENTCUJ3A.cjs');
 
 
 
 Object.defineProperty(exports, 'Nav', {
 	enumerable: true,
-	get: function () { return chunk2LTJ7HHX_cjs.c; }
+	get: function () { return chunkO5XAJ7BY_cjs.c; }
 });
 Object.defineProperty(exports, 'NavItem', {
 	enumerable: true,
-	get: function () { return chunk2LTJ7HHX_cjs.b; }
+	get: function () { return chunkO5XAJ7BY_cjs.b; }
 });
 Object.defineProperty(exports, 'NavList', {
 	enumerable: true,
-	get: function () { return chunk2LTJ7HHX_cjs.a; }
+	get: function () { return chunkO5XAJ7BY_cjs.a; }
 });
 Object.defineProperty(exports, 'default', {
 	enumerable: true,
-	get: function () { return chunk2LTJ7HHX_cjs.d; }
+	get: function () { return chunkO5XAJ7BY_cjs.d; }
 });
 //# sourceMappingURL=out.js.map
 //# sourceMappingURL=nav.cjs.map

package/libs/components/nav/nav.css

@@ -1 +1 @@
-body>nav,[aria-label~=navbar],.navbar{padding-inline:var(--nav-px, 1rem);min-height:var(--nav-h, fit-content)}@media(max-width: 580px){body>nav,[aria-label~=navbar],.navbar{flex-direction:column;height:fit-content;min-height:fit-content;padding-block:unset;gap:.5rem}}body>nav ul>li,[aria-label~=navbar] ul>li,.navbar ul>li{display:flex;align-items:center;list-style:none;margin:0;padding:0;min-height:100%;padding-inline:var(--nav-px, 0.75rem)}body>nav ul>li:hover,[aria-label~=navbar] ul>li:hover,.navbar ul>li:hover{background-color:var(--nav-hov-bg, whitesmoke)}body>nav ul>li:hover:where(img),[aria-label~=navbar] ul>li:hover:where(img),.navbar ul>li:hover:where(img){background-color:rgba(0,0,0,0)}nav{display:var(--nav-dsp, flex);flex-direction:var(--nav-direction, row);width:var(--nav-w, auto);place-items:var(--nav-align, center);justify-content:var(--nav-justify, space-between);margin-inline:var(--nav-mx, 0);background-color:var(--nav-bg, initial)}nav>section,nav>ul{--nav-dsp: flex;flex-direction:var(--nav-direction, row);display:var(--nav-dsp, flex);gap:var(--nav-gap, 0);font-size:var(--nav-fs, 0.9rem);align-items:var(--nav-align, center);padding-inline:var(--nav-px, 1rem);padding-block:var(--nav-py, 0);height:100%}nav>section[data-list~=block],nav>ul[data-list~=block]{--nav-direction: column}nav>section>div{--py: 0}nav ul>li{display:flex;align-items:center;list-style:none;margin:0;padding:0;min-height:100%;padding-inline:var(--nav-px, 1rem)}nav img[alt]{--px: 0 var(--s1);--w: var(--brand-w, 3.6rem)}nav[data-variant]{background-color:var(--nav-bg);color:var(--nav-cl);font-size:var(--nav-fs, 0.9rem)}nav>div{margin-block-start:0}/*# sourceMappingURL=nav.css.map */
+body>nav,[aria-label~=navbar],.navbar{padding-inline:var(--nav-px, 1rem);min-height:var(--nav-h, fit-content)}@media(max-width: 580px){body>nav,[aria-label~=navbar],.navbar{flex-direction:column;height:fit-content;min-height:fit-content;padding-block:unset;gap:.5rem}}body>nav ul>li,[aria-label~=navbar] ul>li,.navbar ul>li{display:flex;align-items:center;list-style:none;margin:0;padding:0;min-height:100%;padding-inline:var(--nav-px, 0.75rem)}body>nav ul>li:hover,[aria-label~=navbar] ul>li:hover,.navbar ul>li:hover{background-color:var(--nav-hov-bg, #e8e8e8)}body>nav ul>li:hover:where(img),[aria-label~=navbar] ul>li:hover:where(img),.navbar ul>li:hover:where(img){background-color:rgba(0,0,0,0)}nav{--nav-focus-color: currentColor;--nav-focus-width: 0.125rem;--nav-focus-offset: 0.125rem;--nav-focus-style: solid;display:var(--nav-dsp, flex);flex-direction:var(--nav-direction, row);width:var(--nav-w, auto);place-items:var(--nav-align, center);justify-content:var(--nav-justify, space-between);margin-inline:var(--nav-mx, 0);background-color:var(--nav-bg, initial)}nav>section,nav>ul{--nav-dsp: flex;flex-direction:var(--nav-direction, row);display:var(--nav-dsp, flex);gap:var(--nav-gap, 0);font-size:var(--nav-fs, 0.9rem);align-items:var(--nav-align, center);padding-inline:var(--nav-px, 1rem);padding-block:var(--nav-py, 0);margin-block-end:var(--nav-mb, 0);height:100%}nav>section[data-list~=block],nav>ul[data-list~=block]{--nav-direction: column}nav>section>div{--py: 0}nav ul>li{display:flex;align-items:center;list-style:none;margin:0;padding:0;min-height:100%;padding-inline:var(--nav-px, 1rem)}nav img[alt]{--px: 0 var(--s1);--w: var(--brand-w, 3.6rem)}nav[data-variant]{background-color:var(--nav-bg);color:var(--nav-cl);font-size:var(--nav-fs, 0.9rem)}nav>div{margin-block-start:0}nav a:focus{outline:var(--nav-focus-width) var(--nav-focus-style) var(--nav-focus-color);outline-offset:var(--nav-focus-offset)}nav a:focus-visible{outline:var(--nav-focus-width) var(--nav-focus-style) var(--nav-focus-color);outline-offset:var(--nav-focus-offset)}nav button:focus{outline:var(--nav-focus-width) var(--nav-focus-style) var(--nav-focus-color);outline-offset:var(--nav-focus-offset)}nav button:focus-visible{outline:var(--nav-focus-width) var(--nav-focus-style) var(--nav-focus-color);outline-offset:var(--nav-focus-offset)}/*# sourceMappingURL=nav.css.map */

package/libs/components/nav/nav.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../src/components/nav/nav.scss"],"names":[],"mappings":"AAAA,sCAEE,mCACA,qCAEA,yBALF,sCAMI,sBACA,mBACA,uBACA,oBACA,WAGA,wDACE,aACA,mBACA,gBACA,SACA,UACA,gBACA,sCAEA,0EACE,+CAEF,2GACE,+BAMR,IACE,6BACA,yCACA,yBACA,qCACA,kDACA,+BACA,wCAEA,mBAEE,gBACA,yCACA,6BACA,sBACA,gCACA,qCACA,mCACA,+BACA,YACA,uDACE,wBAKF,gBACE,QAKF,UACE,aACA,mBACA,gBACA,SACA,UACA,gBACA,mCAIJ,aACE,kBACA,4BAGF,kBACE,+BACA,oBACA,gCAGF,QACE","file":"nav.css"}
+{"version":3,"sourceRoot":"","sources":["../../../src/components/nav/nav.scss"],"names":[],"mappings":"AAAA,sCAGE,mCACA,qCAEA,yBANF,sCAOI,sBACA,mBACA,uBACA,oBACA,WAGA,wDACE,aACA,mBACA,gBACA,SACA,UACA,gBACA,sCAEA,0EACE,4CAEF,2GACE,+BAMR,IAEE,gCACA,4BACA,6BACA,yBAEA,6BACA,yCACA,yBACA,qCACA,kDACA,+BACA,wCAEA,mBAEE,gBACA,yCACA,6BACA,sBACA,gCACA,qCACA,mCACA,+BACA,kCACA,YACA,uDACE,wBAKF,gBACE,QAKF,UACE,aACA,mBACA,gBACA,SACA,UACA,gBACA,mCAIJ,aACE,kBACA,4BAGF,kBACE,+BACA,oBACA,gCAGF,QACE,qBAIF,YACE,6EAEA,uCAGF,oBACE,6EAEA,uCAGF,iBACE,6EAEA,uCAGF,yBACE,6EAEA","file":"nav.css"}