{ "schemaVersion": "1.0.0", "readme": "", "modules": [ { "kind": "javascript-module", "path": "src/index.ts", "declarations": [], "exports": [ { "kind": "js", "name": "ItBottomNav", "declaration": { "name": "ItBottomNav", "module": "./it-bottom-nav.js" } }, { "kind": "js", "name": "ItBottomNavItem", "declaration": { "name": "ItBottomNavItem", "module": "./it-bottom-nav-item.js" } } ] }, { "kind": "javascript-module", "path": "src/it-bottom-nav-item.ts", "declarations": [ { "kind": "class", "description": "BottomNav item component representing a single navigation entry.\n- Wraps slotted content (typically an anchor `` with an icon and a label)\n- Active state can be set via the `active` attribute/property\n- Sets `aria-current=\"page\"` on the first slotted link when active\n- Supports progressive enhancement: links work even without JavaScript\n- Framework-agnostic: works with any JS framework link component (Next.js, Nuxt, Vue Router, etc.)", "name": "ItBottomNavItem", "members": [ { "kind": "field", "name": "active", "type": { "text": "boolean" }, "default": "false", "attribute": "active", "reflects": true }, { "kind": "method", "name": "syncAriaOnLink", "privacy": "public", "description": "Syncs `aria-current` on the slotted link based on current active state.\nQueries light DOM directly to support any framework-specific link components\n(Next.js , Nuxt , Vue , etc.)" } ], "attributes": [ { "name": "active", "type": { "text": "boolean" }, "default": "false", "fieldName": "active" } ], "superclass": { "name": "BaseComponent", "package": "@italia/globals" }, "tagName": "it-bottom-nav-item", "customElement": true } ], "exports": [ { "kind": "js", "name": "ItBottomNavItem", "declaration": { "name": "ItBottomNavItem", "module": "src/it-bottom-nav-item.ts" } }, { "kind": "custom-element-definition", "name": "it-bottom-nav-item", "declaration": { "name": "ItBottomNavItem", "module": "src/it-bottom-nav-item.ts" } } ] }, { "kind": "javascript-module", "path": "src/it-bottom-nav.ts", "declarations": [ { "kind": "class", "description": "BottomNav component for mobile navigation.\n- Renders a fixed bottom navigation bar with slotted `it-bottom-nav-item` elements\n- Items fill the full width automatically\n- Supports progressive enhancement: links work even without JavaScript\n- Uses StickyController internally for fixed-bottom positioning and stacking", "name": "ItBottomNav", "members": [ { "kind": "field", "name": "itAriaLabel", "type": { "text": "string" }, "default": "'Navigazione principale'", "attribute": "it-aria-label", "reflects": true }, { "kind": "field", "name": "position", "readonly": true, "default": "'bottom'", "type": { "text": "'bottom'" } }, { "kind": "field", "name": "positionType", "readonly": true, "default": "'fixed'", "type": { "text": "'fixed'" } }, { "kind": "field", "name": "stackable", "type": { "text": "boolean" }, "readonly": true, "default": "true" }, { "kind": "field", "name": "paddingTop", "type": { "text": "number" }, "readonly": true, "default": "0" }, { "kind": "field", "name": "stickyClassName", "readonly": true, "default": "undefined" }, { "kind": "field", "name": "_stickyController", "type": { "text": "StickyController" }, "privacy": "public", "default": "new StickyController(this, this)" }, { "kind": "method", "name": "_setChildrenProperties", "privacy": "private" } ], "attributes": [ { "name": "it-aria-label", "type": { "text": "string" }, "default": "'Navigazione principale'", "fieldName": "itAriaLabel" } ], "superclass": { "name": "BaseComponent", "package": "@italia/globals" }, "tagName": "it-bottom-nav", "customElement": true } ], "exports": [ { "kind": "js", "name": "ItBottomNav", "declaration": { "name": "ItBottomNav", "module": "src/it-bottom-nav.ts" } }, { "kind": "custom-element-definition", "name": "it-bottom-nav", "declaration": { "name": "ItBottomNav", "module": "src/it-bottom-nav.ts" } } ] }, { "kind": "javascript-module", "path": "stories/it-bottom-nav.stories.ts", "declarations": [ { "kind": "variable", "name": "meta", "default": "{ title: 'Componenti/Bottomnav', tags: ['web-component', 'a11y-ok'], component: 'it-bottom-nav', parameters: { docs: { excludeDecorators: true }, a11y: { config: { rules: [ { id: 'list', enabled: false, }, { id: 'listitem', enabled: false, }, ], }, }, }, args: { 'it-aria-label': 'Navigazione principale', }, argTypes: { 'it-aria-label': { control: 'text', description: 'Testo usato come `aria-label` sul contenitore di navigazione.', }, }, decorators: [ (Story) => html`
${Story()}
`, ], } satisfies Meta" }, { "kind": "variable", "name": "EsempioInterattivo", "type": { "text": "Story" }, "default": "{ name: 'Esempio interattivo', tags: ['!autodocs', '!dev'], parameters: { docs: { canvas: { sourceState: 'hidden' } } }, render: (args) => html` messaggi immagini documenti `, }" }, { "kind": "variable", "name": "TreVoci", "type": { "text": "Story" }, "default": "{ name: 'Tre voci', render: () => html` messaggi immagini documenti `, }" }, { "kind": "variable", "name": "QuattroVoci", "type": { "text": "Story" }, "default": "{ name: 'Quattro voci', render: () => html` messaggi immagini documenti preferiti `, }" }, { "kind": "variable", "name": "ConBadge", "type": { "text": "Story" }, "default": "{ name: 'Con badge', render: () => html`
1
messaggi 1 messaggio da leggere immagini
42
documenti 42 documenti da visualizzare `, }" }, { "kind": "variable", "name": "ConAlert", "type": { "text": "Story" }, "default": "{ name: 'Con alert', render: () => html`
messaggi ci sono nuovi messaggi da leggere immagini documenti `, }" } ], "exports": [ { "kind": "js", "name": "default", "declaration": { "name": "meta", "module": "stories/it-bottom-nav.stories.ts" } }, { "kind": "js", "name": "EsempioInterattivo", "declaration": { "name": "EsempioInterattivo", "module": "stories/it-bottom-nav.stories.ts" } }, { "kind": "js", "name": "TreVoci", "declaration": { "name": "TreVoci", "module": "stories/it-bottom-nav.stories.ts" } }, { "kind": "js", "name": "QuattroVoci", "declaration": { "name": "QuattroVoci", "module": "stories/it-bottom-nav.stories.ts" } }, { "kind": "js", "name": "ConBadge", "declaration": { "name": "ConBadge", "module": "stories/it-bottom-nav.stories.ts" } }, { "kind": "js", "name": "ConAlert", "declaration": { "name": "ConAlert", "module": "stories/it-bottom-nav.stories.ts" } } ] } ] }