desy-html 16.0.4 → 17.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.node-version +1 -1
- package/.nvmrc +1 -1
- package/AGENTS.md +207 -207
- package/README.md +203 -203
- package/TESTING_PLAN.md +379 -379
- package/branding/BRANDING.md +398 -398
- package/branding/branding.config.js +76 -76
- package/branding/branding.config.yourorganization.js +72 -72
- package/branding/logos/aragon-compact.svg +1 -1
- package/branding/logos/aragon-expanded.svg +1 -1
- package/branding/logos/aragon-mini.svg +1 -1
- package/branding/logos/favicon.svg +1 -1
- package/branding/logos/yourlogo-compact.svg +13 -13
- package/branding/logos/yourlogo-expanded.svg +17 -17
- package/branding/logos/yourlogo-mini.svg +17 -17
- package/branding/logos/yourorganization-favicon.svg +13 -13
- package/branding/vite-branding-plugin.js +221 -221
- package/docs/_global.content-placeholder.njk +7 -7
- package/docs/_global.foot.njk +11 -11
- package/docs/_global.head.njk +42 -42
- package/docs/_include.template-header.njk +391 -386
- package/docs/_macro.component-example.njk +6 -6
- package/docs/_macro.example-render.njk +350 -346
- package/docs/_macro.load-component-params.njk +2 -2
- package/docs/_macro.load-component-template.njk +3 -3
- package/docs/_macro.render-caller.njk +3 -3
- package/docs/_macro.show-code-from-file.njk +57 -57
- package/docs/_macro.show-html-from-file.njk +42 -42
- package/docs/_template.default.njk +8 -8
- package/docs/_template.examples.njk +13 -13
- package/docs/catalogo.html +27 -27
- package/docs/componentes.html +187 -184
- package/docs/ds/_ds.example.accordion.njk +109 -109
- package/docs/ds/_ds.example.border.njk +39 -39
- package/docs/ds/_ds.example.botones-alert-sm.njk +264 -264
- package/docs/ds/_ds.example.botones-alert.njk +264 -264
- package/docs/ds/_ds.example.botones-default-sm.njk +264 -264
- package/docs/ds/_ds.example.botones-default.njk +258 -258
- package/docs/ds/_ds.example.botones-primary-lg.njk +264 -264
- package/docs/ds/_ds.example.botones-primary-sm.njk +264 -264
- package/docs/ds/_ds.example.botones-primary.njk +264 -264
- package/docs/ds/_ds.example.botones-transparent-sm.njk +264 -264
- package/docs/ds/_ds.example.botones-transparent.njk +264 -264
- package/docs/ds/_ds.example.breadcrumbs.njk +65 -65
- package/docs/ds/_ds.example.card.njk +198 -198
- package/docs/ds/_ds.example.checkboxes.njk +377 -377
- package/docs/ds/_ds.example.collapsible.njk +18 -18
- package/docs/ds/_ds.example.color-de-interaccion.njk +16 -16
- package/docs/ds/_ds.example.colores-cabecera.njk +15 -15
- package/docs/ds/_ds.example.colores-de-soporte.njk +82 -82
- package/docs/ds/_ds.example.colores-neutros.njk +26 -26
- package/docs/ds/_ds.example.combobox.njk +91 -0
- package/docs/ds/_ds.example.date-input.njk +363 -363
- package/docs/ds/_ds.example.description-list.njk +289 -289
- package/docs/ds/_ds.example.details.njk +23 -23
- package/docs/ds/_ds.example.dropdowns-default.njk +186 -186
- package/docs/ds/_ds.example.dropdowns-en-uso.njk +105 -105
- package/docs/ds/_ds.example.dropdowns-variaciones.njk +224 -224
- package/docs/ds/_ds.example.error-summary.njk +34 -34
- package/docs/ds/_ds.example.file-upload.njk +54 -54
- package/docs/ds/_ds.example.footer.njk +28 -28
- package/docs/ds/_ds.example.header-advanced.njk +70 -70
- package/docs/ds/_ds.example.header.njk +211 -211
- package/docs/ds/_ds.example.input-group.njk +242 -242
- package/docs/ds/_ds.example.input.njk +164 -164
- package/docs/ds/_ds.example.item.njk +176 -176
- package/docs/ds/_ds.example.layout-escritorio.njk +38 -38
- package/docs/ds/_ds.example.layout-movil.njk +14 -14
- package/docs/ds/_ds.example.layout-sidebar.njk +11 -11
- package/docs/ds/_ds.example.links-list.njk +170 -170
- package/docs/ds/_ds.example.listbox-default.njk +677 -677
- package/docs/ds/_ds.example.listbox-variaciones.njk +824 -824
- package/docs/ds/_ds.example.menu-horizontal.njk +66 -66
- package/docs/ds/_ds.example.menu-navigation.njk +493 -493
- package/docs/ds/_ds.example.menu-vertical.njk +129 -129
- package/docs/ds/_ds.example.menubar-en-uso.njk +244 -244
- package/docs/ds/_ds.example.menubar-variaciones.njk +785 -785
- package/docs/ds/_ds.example.modal.njk +210 -210
- package/docs/ds/_ds.example.nav.njk +158 -158
- package/docs/ds/_ds.example.notification.njk +122 -122
- package/docs/ds/_ds.example.pagination.njk +190 -190
- package/docs/ds/_ds.example.pills.njk +215 -215
- package/docs/ds/_ds.example.radios.njk +419 -419
- package/docs/ds/_ds.example.searchbar.njk +87 -87
- package/docs/ds/_ds.example.select.njk +390 -390
- package/docs/ds/_ds.example.status-item.njk +239 -239
- package/docs/ds/_ds.example.status.njk +47 -47
- package/docs/ds/_ds.example.table.njk +740 -740
- package/docs/ds/_ds.example.tabs.njk +136 -136
- package/docs/ds/_ds.example.textarea.njk +237 -237
- package/docs/ds/_ds.example.textos.njk +32 -32
- package/docs/ds/_ds.example.toggle.njk +75 -75
- package/docs/ds/_ds.example.tree.njk +456 -456
- package/docs/ds/_ds.example.treegrid.njk +810 -810
- package/docs/ds/_ds.example.typography.njk +225 -225
- package/docs/ds/_ds.macro.code-snippet.njk +32 -32
- package/docs/ds/_ds.macro.section-title.njk +2 -2
- package/docs/ds/_ds.macro.subsection-title.njk +2 -2
- package/docs/ds/_ds.section.avisos.njk +22 -22
- package/docs/ds/_ds.section.botones.njk +53 -53
- package/docs/ds/_ds.section.campo-y-area-de-texto.njk +19 -19
- package/docs/ds/_ds.section.color.njk +147 -147
- package/docs/ds/_ds.section.datos.njk +42 -42
- package/docs/ds/_ds.section.dropdowns.njk +23 -23
- package/docs/ds/_ds.section.espaciado.njk +296 -296
- package/docs/ds/_ds.section.forms.njk +73 -68
- package/docs/ds/_ds.section.informacion.njk +12 -12
- package/docs/ds/_ds.section.layout.njk +63 -63
- package/docs/ds/_ds.section.menubar.njk +18 -18
- package/docs/ds/_ds.section.mostrar-ocultar.njk +33 -33
- package/docs/ds/_ds.section.navigation.njk +57 -57
- package/docs/ds/_ds.section.textos.njk +287 -287
- package/docs/ds/_ds.section.typography.njk +28 -28
- package/docs/estilos.html +37 -37
- package/docs/examples-accordion-history.html +8 -8
- package/docs/examples-accordion.html +8 -8
- package/docs/examples-alert.html +8 -8
- package/docs/examples-breadcrumbs.html +8 -8
- package/docs/examples-button-loader.html +8 -8
- package/docs/examples-button.html +8 -8
- package/docs/examples-card.html +8 -8
- package/docs/examples-character-count.html +8 -8
- package/docs/examples-checkboxes.html +8 -8
- package/docs/examples-collapsible.html +8 -8
- package/docs/examples-combobox.html +8 -0
- package/docs/examples-date-input.html +8 -8
- package/docs/examples-datepicker.html +8 -8
- package/docs/examples-description-list.html +8 -8
- package/docs/examples-details.html +8 -8
- package/docs/examples-dialog.html +8 -8
- package/docs/examples-dropdown.html +8 -8
- package/docs/examples-error-message.html +8 -8
- package/docs/examples-error-summary.html +8 -8
- package/docs/examples-fieldset.html +8 -8
- package/docs/examples-file-upload.html +8 -8
- package/docs/examples-footer.html +8 -8
- package/docs/examples-header-advanced.html +8 -8
- package/docs/examples-header-mini.html +8 -8
- package/docs/examples-header.html +8 -8
- package/docs/examples-hint.html +8 -8
- package/docs/examples-input-group.html +8 -8
- package/docs/examples-input.html +8 -8
- package/docs/examples-item.html +8 -8
- package/docs/examples-label.html +8 -8
- package/docs/examples-links-list.html +8 -8
- package/docs/examples-listbox.html +8 -8
- package/docs/examples-media-object.html +8 -8
- package/docs/examples-menu-horizontal.html +8 -8
- package/docs/examples-menu-navigation.html +8 -8
- package/docs/examples-menu-vertical.html +8 -8
- package/docs/examples-menubar.html +8 -8
- package/docs/examples-modal.html +8 -8
- package/docs/examples-nav.html +8 -8
- package/docs/examples-notification.html +8 -8
- package/docs/examples-pagination.html +8 -8
- package/docs/examples-pill.html +8 -8
- package/docs/examples-radios.html +8 -8
- package/docs/examples-searchbar.html +8 -8
- package/docs/examples-select.html +8 -8
- package/docs/examples-skip-link.html +8 -8
- package/docs/examples-spinner.html +8 -8
- package/docs/examples-status-item.html +8 -8
- package/docs/examples-status.html +8 -8
- package/docs/examples-table-advanced.html +8 -8
- package/docs/examples-table.html +8 -8
- package/docs/examples-tabs.html +8 -8
- package/docs/examples-textarea.html +8 -8
- package/docs/examples-toggle.html +8 -8
- package/docs/examples-tooltip.html +8 -8
- package/docs/examples-tree.html +8 -8
- package/docs/examples-treegrid.html +8 -8
- package/docs/index.html +919 -908
- package/docs/pagina-accesibilidad.html +110 -110
- package/docs/pagina-mapa-web.html +137 -137
- package/docs/pagina-prueba.html +95 -95
- package/docs/plantilla-con-header-advanced.html +14 -14
- package/docs/plantilla-editar-con-cabecera-fija-y-sidebar-sticky.html +154 -154
- package/docs/plantilla-editar-con-cabecera-fija.html +17 -17
- package/docs/plantilla-logueado-con-cabecera-fija-headroom.html +15 -15
- package/docs/plantilla-logueado-con-cabecera-fija.html +15 -15
- package/docs/plantilla-logueado-con-selector-de-app-y-sidebar.html +164 -164
- package/docs/plantilla-logueado-con-selector-de-app-y-subheader.html +16 -16
- package/docs/plantilla-logueado-con-selector-de-app.html +14 -14
- package/docs/plantilla-logueado-con-titulo-de-app.html +14 -14
- package/docs/plantilla-sin-loguear.html +14 -14
- package/docs/plantillas.html +89 -89
- package/docs/spinner-plantilla-con-header-advanced.html +2 -2
- package/docs/spinner-plantilla-editar-con-cabecera-fija.html +4 -4
- package/docs/spinner-plantilla-logueado-con-cabecera-fija.html +2 -2
- package/docs/spinner-plantilla-logueado-con-selector-de-app-y-subheader.html +2 -2
- package/docs/spinner-plantilla-logueado-con-titulo-de-app.html +2 -2
- package/docs/spinner-plantilla-sin-loguear.html +18 -18
- package/docs/sprints/01-combobox-template.md +433 -0
- package/docs/sprints/02-combobox-styles.md +291 -0
- package/docs/sprints/03-combobox-javascript.md +589 -0
- package/docs/sprints/04-combobox-integration.md +386 -0
- package/docs/sprints/05-combobox-refinamiento-w3c.md +55 -0
- package/package.json +61 -61
- package/public/images/demo-icon.svg +9 -9
- package/replit.md +74 -74
- package/src/EUPL-1.2.txt +287 -287
- package/src/css/base.css +44 -44
- package/src/css/component.form-group.css +24 -24
- package/src/css/component.headroom.css +32 -32
- package/src/css/component.text.css +169 -169
- package/src/css/styles.css +247 -246
- package/src/js/aria/MenuHorizontal.js +63 -65
- package/src/js/aria/MenuNavigation.js +56 -55
- package/src/js/aria/MenuVertical.js +60 -60
- package/src/js/aria/MenubarAction.js +29 -6
- package/src/js/aria/MenubarItemAction.js +1 -9
- package/src/js/aria/Nav.js +60 -60
- package/src/js/aria/PopupMenuAction.js +32 -14
- package/src/js/aria/accordion.js +281 -264
- package/src/js/aria/alert.js +8 -3
- package/src/js/aria/checkBoxes.js +52 -52
- package/src/js/aria/collapsible.js +44 -44
- package/src/js/aria/combobox.js +597 -0
- package/src/js/aria/dataGrid.js +953 -950
- package/src/js/aria/linksList.js +64 -42
- package/src/js/aria/listbox.js +3 -3
- package/src/js/aria/notification.js +56 -56
- package/src/js/aria/radioButton.js +50 -50
- package/src/js/aria/tabs.js +20 -6
- package/src/js/aria/toggle.js +61 -61
- package/src/js/aria/tree.js +60 -40
- package/src/js/aria/treegrid.js +507 -507
- package/src/js/aria/treeitem.js +22 -13
- package/src/js/aria/utils.js +240 -219
- package/src/js/desy-html.js +860 -813
- package/src/js/headroom.min.js +6 -6
- package/src/js/index.js +74 -72
- package/src/main.js +2 -2
- package/src/templates/components/accordion/_examples.accordion.njk +482 -482
- package/src/templates/components/accordion/_macro.accordion.njk +3 -3
- package/src/templates/components/accordion/_template.accordion.njk +131 -131
- package/src/templates/components/accordion/params.accordion.yaml +125 -125
- package/src/templates/components/accordion-history/_examples.accordion-history.njk +521 -521
- package/src/templates/components/accordion-history/_macro.accordion-history.njk +3 -3
- package/src/templates/components/accordion-history/_template.accordion-history.njk +193 -193
- package/src/templates/components/accordion-history/params.accordion-history.yaml +129 -129
- package/src/templates/components/alert/_examples.alert.njk +91 -91
- package/src/templates/components/alert/_macro.alert.njk +3 -3
- package/src/templates/components/alert/_styles.alert.css +9 -9
- package/src/templates/components/alert/_template.alert.njk +16 -16
- package/src/templates/components/alert/params.alert.yaml +25 -25
- package/src/templates/components/breadcrumbs/_examples.breadcrumbs.njk +464 -464
- package/src/templates/components/breadcrumbs/_macro.breadcrumbs.njk +3 -3
- package/src/templates/components/breadcrumbs/_styles.breadcrumbs.css +81 -81
- package/src/templates/components/breadcrumbs/_template.breadcrumbs.njk +77 -77
- package/src/templates/components/breadcrumbs/params.breadcrumbs.yaml +44 -44
- package/src/templates/components/button/_examples.button.njk +518 -511
- package/src/templates/components/button/_macro.button.njk +3 -3
- package/src/templates/components/button/_styles.button.css +180 -180
- package/src/templates/components/button/_template.button.njk +49 -49
- package/src/templates/components/button/params.button.yaml +48 -48
- package/src/templates/components/button-loader/_examples.button-loader.njk +499 -492
- package/src/templates/components/button-loader/_macro.button-loader.njk +3 -3
- package/src/templates/components/button-loader/_styles.button-loader.css +194 -194
- package/src/templates/components/button-loader/_template.button-loader.njk +84 -84
- package/src/templates/components/button-loader/params.button-loader.yaml +74 -74
- package/src/templates/components/card/_examples.card.njk +381 -381
- package/src/templates/components/card/_macro.card.njk +3 -3
- package/src/templates/components/card/_template.card.njk +34 -34
- package/src/templates/components/card/params.card.yaml +112 -112
- package/src/templates/components/character-count/_examples.character-count.njk +195 -195
- package/src/templates/components/character-count/_macro.character-count.njk +5 -5
- package/src/templates/components/character-count/_template.character-count.njk +38 -38
- package/src/templates/components/character-count/params.character-count.yaml +77 -77
- package/src/templates/components/checkboxes/_examples.checkboxes.njk +835 -835
- package/src/templates/components/checkboxes/_macro.checkboxes.njk +3 -3
- package/src/templates/components/checkboxes/_styles.checkboxes.css +30 -30
- package/src/templates/components/checkboxes/_template.checkboxes.njk +137 -137
- package/src/templates/components/checkboxes/params.checkboxes.yaml +116 -116
- package/src/templates/components/collapsible/_examples.collapsible.njk +107 -107
- package/src/templates/components/collapsible/_macro.collapsible.njk +3 -3
- package/src/templates/components/collapsible/_styles.collapsible.css +35 -35
- package/src/templates/components/collapsible/_template.collapsible.njk +17 -17
- package/src/templates/components/collapsible/params.collapsible.yaml +48 -48
- package/src/templates/components/combobox/_examples.combobox.njk +440 -0
- package/src/templates/components/combobox/_macro.combobox.njk +3 -0
- package/src/templates/components/combobox/_styles.combobox.css +92 -0
- package/src/templates/components/combobox/_template.combobox.njk +97 -0
- package/src/templates/components/combobox/params.combobox.yaml +102 -0
- package/src/templates/components/date-input/_examples.date-input.njk +578 -578
- package/src/templates/components/date-input/_macro.date-input.njk +3 -3
- package/src/templates/components/date-input/_template.date-input.njk +125 -125
- package/src/templates/components/date-input/params.date-input.yaml +97 -97
- package/src/templates/components/datepicker/_examples.datepicker.njk +415 -415
- package/src/templates/components/datepicker/_macro.datepicker.njk +3 -3
- package/src/templates/components/datepicker/_styles.datepicker.css +87 -87
- package/src/templates/components/datepicker/_template.datepicker.njk +129 -129
- package/src/templates/components/datepicker/params.datepicker.yaml +104 -104
- package/src/templates/components/description-list/_examples.description-list.njk +502 -502
- package/src/templates/components/description-list/_macro.description-list.njk +3 -3
- package/src/templates/components/description-list/_template.description-list.njk +17 -17
- package/src/templates/components/description-list/params.description-list.yaml +61 -61
- package/src/templates/components/details/_examples.details.njk +68 -68
- package/src/templates/components/details/_macro.details.njk +3 -3
- package/src/templates/components/details/_template.details.njk +17 -17
- package/src/templates/components/details/params.details.yaml +40 -40
- package/src/templates/components/dialog/_examples.dialog.njk +156 -156
- package/src/templates/components/dialog/_macro.dialog.njk +3 -3
- package/src/templates/components/dialog/_styles.dialog.css +27 -27
- package/src/templates/components/dialog/_template.dialog.njk +12 -12
- package/src/templates/components/dialog/params.dialog.yaml +25 -25
- package/src/templates/components/dropdown/_examples.dropdown.njk +226 -226
- package/src/templates/components/dropdown/_macro.dropdown.njk +3 -3
- package/src/templates/components/dropdown/_styles.dropdown.css +191 -191
- package/src/templates/components/dropdown/_template.dropdown.njk +34 -34
- package/src/templates/components/dropdown/params.dropdown.yaml +32 -32
- package/src/templates/components/error-message/_examples.error-message.njk +28 -28
- package/src/templates/components/error-message/_macro.error-message.njk +5 -5
- package/src/templates/components/error-message/_template.error-message.njk +8 -8
- package/src/templates/components/error-message/params.error-message.yaml +23 -23
- package/src/templates/components/error-summary/_examples.error-summary.njk +111 -111
- package/src/templates/components/error-summary/_macro.error-summary.njk +5 -5
- package/src/templates/components/error-summary/_template.error-summary.njk +48 -48
- package/src/templates/components/error-summary/params.error-summary.yaml +50 -50
- package/src/templates/components/fieldset/_examples.fieldset.njk +79 -79
- package/src/templates/components/fieldset/_macro.fieldset.njk +2 -2
- package/src/templates/components/fieldset/_template.fieldset.njk +46 -46
- package/src/templates/components/fieldset/params.fieldset.yaml +49 -49
- package/src/templates/components/file-upload/_examples.file-upload.njk +103 -103
- package/src/templates/components/file-upload/_macro.file-upload.njk +2 -2
- package/src/templates/components/file-upload/_template.file-upload.njk +45 -45
- package/src/templates/components/file-upload/params.file-upload.yaml +48 -48
- package/src/templates/components/footer/_examples.footer.njk +558 -558
- package/src/templates/components/footer/_macro.footer.njk +3 -3
- package/src/templates/components/footer/_styles.footer.css +43 -43
- package/src/templates/components/footer/_template.footer.njk +130 -130
- package/src/templates/components/footer/params.footer.yaml +140 -140
- package/src/templates/components/header/_examples.header.njk +627 -627
- package/src/templates/components/header/_macro.header.header__dropdown.njk +3 -3
- package/src/templates/components/header/_macro.header.header__navigation.njk +3 -3
- package/src/templates/components/header/_macro.header.header__offcanvas.njk +3 -3
- package/src/templates/components/header/_macro.header.header__offcanvasButton.njk +3 -3
- package/src/templates/components/header/_macro.header.header__subnav.njk +3 -3
- package/src/templates/components/header/_macro.header.njk +3 -3
- package/src/templates/components/header/_styles.header.css +12 -12
- package/src/templates/components/header/_template.header.header__dropdown.njk +27 -27
- package/src/templates/components/header/_template.header.header__navigation.njk +25 -25
- package/src/templates/components/header/_template.header.header__offcanvas.njk +20 -20
- package/src/templates/components/header/_template.header.header__offcanvasButton.njk +10 -10
- package/src/templates/components/header/_template.header.header__subnav.njk +33 -33
- package/src/templates/components/header/_template.header.njk +155 -155
- package/src/templates/components/header/params.header.yaml +295 -295
- package/src/templates/components/header-advanced/_examples.header-advanced.njk +1110 -1110
- package/src/templates/components/header-advanced/_macro.header-advanced.njk +3 -3
- package/src/templates/components/header-advanced/_template.header-advanced.njk +171 -171
- package/src/templates/components/header-advanced/params.header-advanced.yaml +352 -352
- package/src/templates/components/header-mini/_examples.header-mini.njk +319 -316
- package/src/templates/components/header-mini/_macro.header-mini.njk +3 -3
- package/src/templates/components/header-mini/_template.header-mini.njk +51 -51
- package/src/templates/components/header-mini/params.header-mini.yaml +90 -90
- package/src/templates/components/hint/_examples.hint.njk +26 -26
- package/src/templates/components/hint/_macro.hint.njk +3 -3
- package/src/templates/components/hint/_template.hint.njk +3 -3
- package/src/templates/components/hint/params.hint.yaml +21 -21
- package/src/templates/components/input/_examples.input.njk +393 -393
- package/src/templates/components/input/_macro.input.njk +3 -3
- package/src/templates/components/input/_styles.input.css +17 -17
- package/src/templates/components/input/_template.input.njk +53 -53
- package/src/templates/components/input/params.input.yaml +80 -80
- package/src/templates/components/input-group/_examples.input-group.njk +558 -558
- package/src/templates/components/input-group/_macro.input-group.njk +3 -3
- package/src/templates/components/input-group/_template.input-group.njk +107 -107
- package/src/templates/components/input-group/params.input-group.yaml +123 -123
- package/src/templates/components/item/_examples.item.njk +370 -370
- package/src/templates/components/item/_macro.item.njk +3 -3
- package/src/templates/components/item/_template.item.njk +73 -73
- package/src/templates/components/item/params.item.yaml +101 -101
- package/src/templates/components/label/_examples.label.njk +58 -58
- package/src/templates/components/label/_macro.label.njk +5 -5
- package/src/templates/components/label/_template.label.njk +37 -37
- package/src/templates/components/label/params.label.yaml +28 -28
- package/src/templates/components/links-list/_examples.links-list.njk +761 -761
- package/src/templates/components/links-list/_macro.links-list.njk +3 -3
- package/src/templates/components/links-list/_template.links-list.njk +119 -119
- package/src/templates/components/links-list/params.links-list.yaml +101 -101
- package/src/templates/components/listbox/_examples.listbox.njk +813 -812
- package/src/templates/components/listbox/_macro.listbox.njk +3 -3
- package/src/templates/components/listbox/_styles.listbox.css +218 -218
- package/src/templates/components/listbox/_template.listbox.njk +90 -90
- package/src/templates/components/listbox/params.listbox.yaml +85 -85
- package/src/templates/components/media-object/_examples.media-object.njk +79 -79
- package/src/templates/components/media-object/_macro.media-object.njk +3 -3
- package/src/templates/components/media-object/_template.media-object.njk +21 -21
- package/src/templates/components/media-object/params.media-object.yaml +16 -16
- package/src/templates/components/menu-horizontal/_examples.menu-horizontal.njk +613 -613
- package/src/templates/components/menu-horizontal/_macro.menu-horizontal.njk +3 -3
- package/src/templates/components/menu-horizontal/_styles.menu-horizontal.css +167 -167
- package/src/templates/components/menu-horizontal/_template.menu-horizontal.njk +36 -36
- package/src/templates/components/menu-horizontal/params.menu-horizontal.yaml +53 -53
- package/src/templates/components/menu-navigation/_examples.menu-navigation.njk +1292 -1292
- package/src/templates/components/menu-navigation/_macro.menu-navigation.njk +3 -3
- package/src/templates/components/menu-navigation/_styles.menu-navigation.css +238 -238
- package/src/templates/components/menu-navigation/_template.menu-navigation.njk +87 -87
- package/src/templates/components/menu-navigation/params.menu-navigation.yaml +86 -86
- package/src/templates/components/menu-vertical/_examples.menu-vertical.njk +835 -835
- package/src/templates/components/menu-vertical/_macro.menu-vertical.njk +3 -3
- package/src/templates/components/menu-vertical/_template.menu-vertical.njk +92 -92
- package/src/templates/components/menu-vertical/params.menu-vertical.yaml +77 -77
- package/src/templates/components/menubar/_examples.menubar.njk +1843 -1843
- package/src/templates/components/menubar/_macro.menubar.njk +3 -3
- package/src/templates/components/menubar/_styles.menubar.css +259 -259
- package/src/templates/components/menubar/_template.menubar.njk +106 -106
- package/src/templates/components/menubar/params.menubar.yaml +130 -130
- package/src/templates/components/modal/_examples.modal.njk +432 -432
- package/src/templates/components/modal/_macro.modal.njk +3 -3
- package/src/templates/components/modal/_template.modal.njk +129 -129
- package/src/templates/components/modal/params.modal.yaml +77 -77
- package/src/templates/components/nav/_examples.nav.njk +468 -468
- package/src/templates/components/nav/_macro.nav.njk +3 -3
- package/src/templates/components/nav/_template.nav.njk +53 -53
- package/src/templates/components/nav/params.nav.yaml +61 -61
- package/src/templates/components/notification/_examples.notification.njk +277 -277
- package/src/templates/components/notification/_macro.notification.njk +3 -3
- package/src/templates/components/notification/_styles.notification.css +30 -30
- package/src/templates/components/notification/_template.notification.njk +86 -86
- package/src/templates/components/notification/params.notification.yaml +101 -101
- package/src/templates/components/pagination/_examples.pagination.njk +444 -444
- package/src/templates/components/pagination/_macro.pagination.njk +3 -3
- package/src/templates/components/pagination/_template.pagination.njk +162 -162
- package/src/templates/components/pagination/params.pagination.yaml +150 -150
- package/src/templates/components/pill/_examples.pill.njk +180 -180
- package/src/templates/components/pill/_macro.pill.njk +3 -3
- package/src/templates/components/pill/_styles.pill.css +59 -59
- package/src/templates/components/pill/_template.pill.njk +38 -38
- package/src/templates/components/pill/params.pill.yaml +28 -28
- package/src/templates/components/radios/_examples.radios.njk +698 -698
- package/src/templates/components/radios/_macro.radios.njk +5 -5
- package/src/templates/components/radios/_styles.radios.css +30 -30
- package/src/templates/components/radios/_template.radios.njk +133 -133
- package/src/templates/components/radios/params.radios.yaml +104 -104
- package/src/templates/components/searchbar/_examples.searchbar.njk +147 -147
- package/src/templates/components/searchbar/_macro.searchbar.njk +3 -3
- package/src/templates/components/searchbar/_template.searchbar.njk +45 -45
- package/src/templates/components/searchbar/params.searchbar.yaml +46 -46
- package/src/templates/components/select/_examples.select.njk +364 -364
- package/src/templates/components/select/_macro.select.njk +5 -5
- package/src/templates/components/select/_styles.select.css +45 -45
- package/src/templates/components/select/_template.select.njk +67 -67
- package/src/templates/components/select/params.select.yaml +93 -93
- package/src/templates/components/skip-link/_examples.skip-link.njk +31 -31
- package/src/templates/components/skip-link/_macro.skip-link.njk +3 -3
- package/src/templates/components/skip-link/_styles.skip-link.css +12 -12
- package/src/templates/components/skip-link/_template.skip-link.njk +4 -4
- package/src/templates/components/skip-link/params.skip-link.yaml +20 -20
- package/src/templates/components/spinner/_examples.spinner.njk +91 -101
- package/src/templates/components/spinner/_macro.spinner.njk +3 -3
- package/src/templates/components/spinner/_styles.spinner.css +33 -33
- package/src/templates/components/spinner/_template.spinner.njk +12 -12
- package/src/templates/components/spinner/params.spinner.yaml +12 -12
- package/src/templates/components/status/_examples.status.njk +80 -80
- package/src/templates/components/status/_macro.status.njk +3 -3
- package/src/templates/components/status/_template.status.njk +23 -23
- package/src/templates/components/status/params.status.yaml +24 -24
- package/src/templates/components/status-item/_examples.status-item.njk +319 -319
- package/src/templates/components/status-item/_macro.status-item.njk +3 -3
- package/src/templates/components/status-item/_template.status-item.njk +99 -99
- package/src/templates/components/status-item/params.status-item.yaml +106 -106
- package/src/templates/components/table/_examples.table.njk +705 -705
- package/src/templates/components/table/_macro.table.njk +3 -3
- package/src/templates/components/table/_styles.table.css +19 -19
- package/src/templates/components/table/_template.table.njk +68 -68
- package/src/templates/components/table/params.table.yaml +130 -130
- package/src/templates/components/table-advanced/_examples.table-advanced.njk +839 -839
- package/src/templates/components/table-advanced/_macro.table-advanced.njk +3 -3
- package/src/templates/components/table-advanced/_styles.table-advanced.css +63 -63
- package/src/templates/components/table-advanced/_template.table-advanced.njk +210 -210
- package/src/templates/components/table-advanced/params.table-advanced.yaml +160 -160
- package/src/templates/components/tabs/_examples.tabs.njk +588 -588
- package/src/templates/components/tabs/_macro.tabs.njk +3 -3
- package/src/templates/components/tabs/_styles.tabs.css +132 -132
- package/src/templates/components/tabs/_template.tabs.njk +70 -70
- package/src/templates/components/tabs/params.tabs.yaml +83 -83
- package/src/templates/components/textarea/_examples.textarea.njk +174 -174
- package/src/templates/components/textarea/_macro.textarea.njk +5 -5
- package/src/templates/components/textarea/_template.textarea.njk +47 -47
- package/src/templates/components/textarea/params.textarea.yaml +64 -64
- package/src/templates/components/toggle/_examples.toggle.njk +248 -248
- package/src/templates/components/toggle/_macro.toggle.njk +3 -3
- package/src/templates/components/toggle/_styles.toggle.css +31 -31
- package/src/templates/components/toggle/_template.toggle.njk +27 -27
- package/src/templates/components/toggle/params.toggle.yaml +69 -69
- package/src/templates/components/tooltip/_examples.tooltip.njk +134 -134
- package/src/templates/components/tooltip/_macro.tooltip.njk +3 -3
- package/src/templates/components/tooltip/_styles.tooltip.css +9 -9
- package/src/templates/components/tooltip/_template.tooltip.njk +40 -40
- package/src/templates/components/tooltip/params.tooltip.yaml +40 -40
- package/src/templates/components/tree/_examples.tree.njk +2671 -2671
- package/src/templates/components/tree/_macro.tree.njk +3 -3
- package/src/templates/components/tree/_styles.tree.css +54 -54
- package/src/templates/components/tree/_template.tree.njk +232 -232
- package/src/templates/components/tree/params.tree.yaml +173 -173
- package/src/templates/components/treegrid/_examples.treegrid.njk +1269 -1269
- package/src/templates/components/treegrid/_macro.treegrid.njk +3 -3
- package/src/templates/components/treegrid/_styles.treegrid.css +31 -31
- package/src/templates/components/treegrid/_template.treegrid.njk +90 -90
- package/src/templates/components/treegrid/params.treegrid.yaml +131 -131
- package/src/templates/includes/_abrir-notificaciones-extra.njk +2 -2
- package/src/templates/includes/_abrir-notificaciones.njk +2 -2
- package/src/templates/includes/_acciones-de-cabecera.njk +28 -28
- package/src/templates/includes/_ejemplo-titulo-h2-parrafo.njk +4 -4
- package/src/templates/includes/_ejemplo-titulo-parrafo.njk +4 -4
- package/src/templates/includes/_test-include.njk +13 -13
- package/src/templates/pages/_page.foot-headroom.njk +30 -30
- package/src/templates/pages/_page.foot.njk +5 -5
- package/src/templates/pages/_page.footer.njk +19 -19
- package/src/templates/pages/_page.head.njk +27 -27
- package/src/templates/pages/_page.notification-edit-inner-content.njk +31 -31
- package/src/templates/pages/_page.notification-edit.njk +30 -30
- package/src/templates/pages/_page.notification-footer.njk +32 -32
- package/src/templates/pages/_page.notification-header-fixed.njk +30 -30
- package/src/templates/pages/_page.notification-header.njk +31 -31
- package/src/templates/pages/_page.sidebar-content.njk +20 -20
- package/src/templates/pages/_page.spinner-block.njk +14 -14
- package/src/templates/pages/_page.spinner-show.njk +15 -15
- package/src/templates/pages/_page.spinner.njk +15 -15
- package/src/templates/pages/_template.edit-fixed-with-sticky-sidebar.njk +36 -36
- package/src/templates/pages/_template.edit-fixed.njk +74 -74
- package/src/templates/pages/_template.home.njk +111 -111
- package/src/templates/pages/_template.logged-out.njk +56 -56
- package/src/templates/pages/_template.logged-selector-fixed-headroom.njk +198 -198
- package/src/templates/pages/_template.logged-selector-fixed.njk +195 -195
- package/src/templates/pages/_template.logged-selector-subheader.njk +80 -80
- package/src/templates/pages/_template.logged-selector-with-sidebar.njk +28 -28
- package/src/templates/pages/_template.logged-selector.njk +195 -195
- package/src/templates/pages/_template.logged.njk +141 -141
- package/src/templates/pages/_template.mfe-iframe-content.njk +31 -31
- package/src/templates/pages/_template.mfe.njk +83 -83
- package/src/templates/pages/_template.test.njk +48 -48
- package/src/templates/pages/_template.with-header-advanced.njk +311 -311
- package/vite.config.js +1021 -982
|
@@ -1,112 +1,112 @@
|
|
|
1
|
-
{% set exampleComponent = "error-summary" %}
|
|
2
|
-
{% set examples = [
|
|
3
|
-
{
|
|
4
|
-
"name": "por defecto",
|
|
5
|
-
"data": {
|
|
6
|
-
"titleText": "Problemas encontrados",
|
|
7
|
-
"headingLevel": 2,
|
|
8
|
-
"errorList": [
|
|
9
|
-
{
|
|
10
|
-
"text": "El campo de Nombre no puede estar vacío.",
|
|
11
|
-
"href": "#example-error-1"
|
|
12
|
-
},
|
|
13
|
-
{
|
|
14
|
-
"text": "El campo de Teléfono no es correcto. Introduce una cifra de, al menos, 9 dígitos.",
|
|
15
|
-
"href": "#example-error-2"
|
|
16
|
-
}
|
|
17
|
-
]
|
|
18
|
-
},
|
|
19
|
-
"visualDescription": "Bloque rectangular con borde rojo de 2-3px y fondo rosa claro. Contiene encabezado en negro y lista de
|
|
20
|
-
"_generated": {
|
|
21
|
-
"hash": "be7a82bc9e4cdf0d90657d1d6816a7cf",
|
|
22
|
-
"version": "15.0.3",
|
|
23
|
-
"timestamp": "2026-01-30T18:57:24.624Z"
|
|
24
|
-
}
|
|
25
|
-
},
|
|
26
|
-
{
|
|
27
|
-
"name": "Con encabezado de nivel 3",
|
|
28
|
-
"data": {
|
|
29
|
-
"titleText": "Título con h3",
|
|
30
|
-
"headingLevel": 3,
|
|
31
|
-
"errorList": [
|
|
32
|
-
{
|
|
33
|
-
"text": "El campo de Nombre no puede estar vacío.",
|
|
34
|
-
"href": "#example-error-1"
|
|
35
|
-
},
|
|
36
|
-
{
|
|
37
|
-
"text": "El campo de Teléfono no es correcto. Introduce una cifra de, al menos, 9 dígitos.",
|
|
38
|
-
"href": "#example-error-2"
|
|
39
|
-
}
|
|
40
|
-
]
|
|
41
|
-
},
|
|
42
|
-
"visualDescription": "Bloque rectangular con borde rojo de 2-3px y fondo rosa claro. Incluye encabezado en negro, subtítulo en negro peso normal, y lista de
|
|
43
|
-
"_generated": {
|
|
44
|
-
"hash": "59f46f0589122462f39e2bbe422e9c24",
|
|
45
|
-
"version": "15.0.3",
|
|
46
|
-
"timestamp": "2026-01-30T18:57:24.624Z"
|
|
47
|
-
}
|
|
48
|
-
},
|
|
49
|
-
{
|
|
50
|
-
"name": "sin enlaces",
|
|
51
|
-
"data": {
|
|
52
|
-
"titleText": "Problemas encontrados",
|
|
53
|
-
"headingLevel": 2,
|
|
54
|
-
"errorList": [
|
|
55
|
-
{
|
|
56
|
-
"text": "Nombre de usuario o contraseña incorrectos."
|
|
57
|
-
}
|
|
58
|
-
]
|
|
59
|
-
},
|
|
60
|
-
"visualDescription": "Bloque rectangular con borde rojo de 2-3px y fondo rosa claro. Contiene encabezado en negro y texto descriptivo en rojo peso normal sin subrayado. Texto alineado a la izquierda con espaciado vertical mínimo.",
|
|
61
|
-
"_generated": {
|
|
62
|
-
"hash": "f3698b2dad3d6cc4c65a4fef1d2d57df",
|
|
63
|
-
"version": "15.0.3",
|
|
64
|
-
"timestamp": "2026-01-30T18:57:24.624Z"
|
|
65
|
-
}
|
|
66
|
-
},
|
|
67
|
-
{
|
|
68
|
-
"name": "con y sin enlaces",
|
|
69
|
-
"data": {
|
|
70
|
-
"titleText": "Problemas encontrados",
|
|
71
|
-
"headingLevel": 2,
|
|
72
|
-
"errorList": [
|
|
73
|
-
{
|
|
74
|
-
"text": "Nombre de usuario o contraseña incorrectos."
|
|
75
|
-
},
|
|
76
|
-
{
|
|
77
|
-
"text": "Acepta los términos del servicio para acceder.",
|
|
78
|
-
"href": "#example-error-1"
|
|
79
|
-
}
|
|
80
|
-
]
|
|
81
|
-
},
|
|
82
|
-
"visualDescription": "Caja con borde rojo grueso (3-4px) y fondo rosa muy claro. Título en negrita negro. Texto de error
|
|
83
|
-
"_generated": {
|
|
84
|
-
"hash": "afaa40dba96a7ae70f689ebc058c3671",
|
|
85
|
-
"version": "15.0.3",
|
|
86
|
-
"timestamp": "2026-01-30T18:57:33.778Z"
|
|
87
|
-
}
|
|
88
|
-
},
|
|
89
|
-
{
|
|
90
|
-
"name": "con todo",
|
|
91
|
-
"data": {
|
|
92
|
-
"titleText": "Problemas encontrados",
|
|
93
|
-
"headingLevel": 2,
|
|
94
|
-
"descriptionText": "Por favor, corrige los problemas siguientes.",
|
|
95
|
-
"errorList": [
|
|
96
|
-
{
|
|
97
|
-
"text": "Nombre de usuario o contraseña incorrectos."
|
|
98
|
-
},
|
|
99
|
-
{
|
|
100
|
-
"text": "Acepta los términos del servicio para acceder.",
|
|
101
|
-
"href": "#example-error-1"
|
|
102
|
-
}
|
|
103
|
-
]
|
|
104
|
-
},
|
|
105
|
-
"visualDescription": "Caja con borde rojo grueso (3-4px) y fondo rosa muy claro. Título en negrita negro. Texto informativo en negro regular. Dos líneas de error en rojo negrita, con la segunda línea en rojo negrita con subrayado (enlace).",
|
|
106
|
-
"_generated": {
|
|
107
|
-
"hash": "196bec81104910c480f1af211c6e840f",
|
|
108
|
-
"version": "15.0.3",
|
|
109
|
-
"timestamp": "2026-01-30T18:57:33.778Z"
|
|
110
|
-
}
|
|
111
|
-
}
|
|
1
|
+
{% set exampleComponent = "error-summary" %}
|
|
2
|
+
{% set examples = [
|
|
3
|
+
{
|
|
4
|
+
"name": "por defecto",
|
|
5
|
+
"data": {
|
|
6
|
+
"titleText": "Problemas encontrados",
|
|
7
|
+
"headingLevel": 2,
|
|
8
|
+
"errorList": [
|
|
9
|
+
{
|
|
10
|
+
"text": "El campo de Nombre no puede estar vacío.",
|
|
11
|
+
"href": "#example-error-1"
|
|
12
|
+
},
|
|
13
|
+
{
|
|
14
|
+
"text": "El campo de Teléfono no es correcto. Introduce una cifra de, al menos, 9 dígitos.",
|
|
15
|
+
"href": "#example-error-2"
|
|
16
|
+
}
|
|
17
|
+
]
|
|
18
|
+
},
|
|
19
|
+
"visualDescription": "Bloque rectangular con borde rojo de 2-3px y fondo rosa claro. Contiene encabezado en negro y lista de elementos en rojo subrayado (enlaces). Texto alineado a la izquierda con espaciado vertical entre elementos.",
|
|
20
|
+
"_generated": {
|
|
21
|
+
"hash": "be7a82bc9e4cdf0d90657d1d6816a7cf",
|
|
22
|
+
"version": "15.0.3",
|
|
23
|
+
"timestamp": "2026-01-30T18:57:24.624Z"
|
|
24
|
+
}
|
|
25
|
+
},
|
|
26
|
+
{
|
|
27
|
+
"name": "Con encabezado de nivel 3",
|
|
28
|
+
"data": {
|
|
29
|
+
"titleText": "Título con h3",
|
|
30
|
+
"headingLevel": 3,
|
|
31
|
+
"errorList": [
|
|
32
|
+
{
|
|
33
|
+
"text": "El campo de Nombre no puede estar vacío.",
|
|
34
|
+
"href": "#example-error-1"
|
|
35
|
+
},
|
|
36
|
+
{
|
|
37
|
+
"text": "El campo de Teléfono no es correcto. Introduce una cifra de, al menos, 9 dígitos.",
|
|
38
|
+
"href": "#example-error-2"
|
|
39
|
+
}
|
|
40
|
+
]
|
|
41
|
+
},
|
|
42
|
+
"visualDescription": "Bloque rectangular con borde rojo de 2-3px y fondo rosa claro. Incluye encabezado en negro, subtítulo en negro peso normal, y lista de elementos en rojo subrayado (enlaces). Texto alineado a la izquierda con espaciado vertical entre secciones.",
|
|
43
|
+
"_generated": {
|
|
44
|
+
"hash": "59f46f0589122462f39e2bbe422e9c24",
|
|
45
|
+
"version": "15.0.3",
|
|
46
|
+
"timestamp": "2026-01-30T18:57:24.624Z"
|
|
47
|
+
}
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
"name": "sin enlaces",
|
|
51
|
+
"data": {
|
|
52
|
+
"titleText": "Problemas encontrados",
|
|
53
|
+
"headingLevel": 2,
|
|
54
|
+
"errorList": [
|
|
55
|
+
{
|
|
56
|
+
"text": "Nombre de usuario o contraseña incorrectos."
|
|
57
|
+
}
|
|
58
|
+
]
|
|
59
|
+
},
|
|
60
|
+
"visualDescription": "Bloque rectangular con borde rojo de 2-3px y fondo rosa claro. Contiene encabezado en negro y texto descriptivo de error en rojo peso normal sin subrayado. Texto alineado a la izquierda con espaciado vertical mínimo.",
|
|
61
|
+
"_generated": {
|
|
62
|
+
"hash": "f3698b2dad3d6cc4c65a4fef1d2d57df",
|
|
63
|
+
"version": "15.0.3",
|
|
64
|
+
"timestamp": "2026-01-30T18:57:24.624Z"
|
|
65
|
+
}
|
|
66
|
+
},
|
|
67
|
+
{
|
|
68
|
+
"name": "con y sin enlaces",
|
|
69
|
+
"data": {
|
|
70
|
+
"titleText": "Problemas encontrados",
|
|
71
|
+
"headingLevel": 2,
|
|
72
|
+
"errorList": [
|
|
73
|
+
{
|
|
74
|
+
"text": "Nombre de usuario o contraseña incorrectos."
|
|
75
|
+
},
|
|
76
|
+
{
|
|
77
|
+
"text": "Acepta los términos del servicio para acceder.",
|
|
78
|
+
"href": "#example-error-1"
|
|
79
|
+
}
|
|
80
|
+
]
|
|
81
|
+
},
|
|
82
|
+
"visualDescription": "Caja con borde rojo grueso (3-4px) y fondo rosa muy claro. Título en negrita negro. Texto de error en rojo negrita. Segunda línea en rojo negrita con subrayado (enlace).",
|
|
83
|
+
"_generated": {
|
|
84
|
+
"hash": "afaa40dba96a7ae70f689ebc058c3671",
|
|
85
|
+
"version": "15.0.3",
|
|
86
|
+
"timestamp": "2026-01-30T18:57:33.778Z"
|
|
87
|
+
}
|
|
88
|
+
},
|
|
89
|
+
{
|
|
90
|
+
"name": "con todo",
|
|
91
|
+
"data": {
|
|
92
|
+
"titleText": "Problemas encontrados",
|
|
93
|
+
"headingLevel": 2,
|
|
94
|
+
"descriptionText": "Por favor, corrige los problemas siguientes.",
|
|
95
|
+
"errorList": [
|
|
96
|
+
{
|
|
97
|
+
"text": "Nombre de usuario o contraseña incorrectos."
|
|
98
|
+
},
|
|
99
|
+
{
|
|
100
|
+
"text": "Acepta los términos del servicio para acceder.",
|
|
101
|
+
"href": "#example-error-1"
|
|
102
|
+
}
|
|
103
|
+
]
|
|
104
|
+
},
|
|
105
|
+
"visualDescription": "Caja con borde rojo grueso (3-4px) y fondo rosa muy claro. Título en negrita negro. Texto informativo en negro regular. Dos líneas de error en rojo negrita, con la segunda línea en rojo negrita con subrayado (enlace).",
|
|
106
|
+
"_generated": {
|
|
107
|
+
"hash": "196bec81104910c480f1af211c6e840f",
|
|
108
|
+
"version": "15.0.3",
|
|
109
|
+
"timestamp": "2026-01-30T18:57:33.778Z"
|
|
110
|
+
}
|
|
111
|
+
}
|
|
112
112
|
] %}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
<!-- _macro.error-message.njk -->
|
|
2
|
-
|
|
3
|
-
{% macro componentErrorSummary(params) %}
|
|
4
|
-
{% include "./_template.error-summary.njk" %}
|
|
5
|
-
{% endmacro %}
|
|
1
|
+
<!-- _macro.error-message.njk -->
|
|
2
|
+
|
|
3
|
+
{% macro componentErrorSummary(params) %}
|
|
4
|
+
{% include "./_template.error-summary.njk" %}
|
|
5
|
+
{% endmacro %}
|
|
@@ -1,49 +1,49 @@
|
|
|
1
|
-
<!-- error-summary -->
|
|
2
|
-
<div class="p-base bg-white border-2 border-alert-base
|
|
3
|
-
{%- if params.classes %} {{ params.classes }}{% endif %}" aria-labelledby="error-summary-title" role="alert" tabindex="-1"
|
|
4
|
-
{%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %} data-module="c-error-summary">
|
|
5
|
-
{% if params.headingLevel == "1" %}
|
|
6
|
-
<h1 class="mb-base font-bold" id="error-summary-title">
|
|
7
|
-
{{ params.titleHtml | safe if params.titleHtml else params.titleText }}
|
|
8
|
-
</h1>
|
|
9
|
-
{% elseif params.headingLevel == "2" %}
|
|
10
|
-
<h2 class="mb-base font-bold" id="error-summary-title">
|
|
11
|
-
{{ params.titleHtml | safe if params.titleHtml else params.titleText }}
|
|
12
|
-
</h2>
|
|
13
|
-
{% elseif params.headingLevel == "3" %}
|
|
14
|
-
<h3 class="mb-base font-bold" id="error-summary-title">
|
|
15
|
-
{{ params.titleHtml | safe if params.titleHtml else params.titleText }}
|
|
16
|
-
</h3>
|
|
17
|
-
{% elseif params.headingLevel == "4" %}
|
|
18
|
-
<h4 class="mb-base font-bold" id="error-summary-title">
|
|
19
|
-
{{ params.titleHtml | safe if params.titleHtml else params.titleText }}
|
|
20
|
-
</h4>
|
|
21
|
-
{% elseif params.headingLevel == "5" %}
|
|
22
|
-
<h5 class="mb-base font-bold" id="error-summary-title">
|
|
23
|
-
{{ params.titleHtml | safe if params.titleHtml else params.titleText }}
|
|
24
|
-
</h5>
|
|
25
|
-
{% else %}
|
|
26
|
-
<h2 class="mb-base font-bold" id="error-summary-title">
|
|
27
|
-
{{ params.titleHtml | safe if params.titleHtml else params.titleText }}
|
|
28
|
-
</h2>
|
|
29
|
-
{% endif %}
|
|
30
|
-
<div>
|
|
31
|
-
{% if params.descriptionHtml or params.descriptionText %}
|
|
32
|
-
<p class="mb-base">
|
|
33
|
-
{{ params.descriptionHtml | safe if params.descriptionHtml else params.descriptionText }}
|
|
34
|
-
</p>
|
|
35
|
-
{% endif %}
|
|
36
|
-
<ul class="font-semibold text-alert-base">
|
|
37
|
-
{% for item in params.errorList %}
|
|
38
|
-
<li>
|
|
39
|
-
{% if item.href %}
|
|
40
|
-
<a href="{{ item.href }}" class="c-link c-link--alert inline-block pb-sm"{% for attribute, value in item.attributes %} {{attribute}}="{{value}}"{% endfor %}>{{ item.html | filterquotes | safe if item.html else item.text }}</a>
|
|
41
|
-
{% else %}
|
|
42
|
-
{{ item.html | filterquotes | safe if item.html else item.text }}
|
|
43
|
-
{% endif %}
|
|
44
|
-
</li>
|
|
45
|
-
{% endfor %}
|
|
46
|
-
</ul>
|
|
47
|
-
</div>
|
|
48
|
-
</div>
|
|
1
|
+
<!-- error-summary -->
|
|
2
|
+
<div class="p-base bg-white border-2 border-alert-base
|
|
3
|
+
{%- if params.classes %} {{ params.classes }}{% endif %}" aria-labelledby="error-summary-title" role="alert" tabindex="-1"
|
|
4
|
+
{%- for attribute, value in params.attributes %} {{ attribute }}="{{ value }}"{% endfor %} data-module="c-error-summary">
|
|
5
|
+
{% if params.headingLevel == "1" %}
|
|
6
|
+
<h1 class="mb-base font-bold" id="error-summary-title">
|
|
7
|
+
{{ params.titleHtml | safe if params.titleHtml else params.titleText }}
|
|
8
|
+
</h1>
|
|
9
|
+
{% elseif params.headingLevel == "2" %}
|
|
10
|
+
<h2 class="mb-base font-bold" id="error-summary-title">
|
|
11
|
+
{{ params.titleHtml | safe if params.titleHtml else params.titleText }}
|
|
12
|
+
</h2>
|
|
13
|
+
{% elseif params.headingLevel == "3" %}
|
|
14
|
+
<h3 class="mb-base font-bold" id="error-summary-title">
|
|
15
|
+
{{ params.titleHtml | safe if params.titleHtml else params.titleText }}
|
|
16
|
+
</h3>
|
|
17
|
+
{% elseif params.headingLevel == "4" %}
|
|
18
|
+
<h4 class="mb-base font-bold" id="error-summary-title">
|
|
19
|
+
{{ params.titleHtml | safe if params.titleHtml else params.titleText }}
|
|
20
|
+
</h4>
|
|
21
|
+
{% elseif params.headingLevel == "5" %}
|
|
22
|
+
<h5 class="mb-base font-bold" id="error-summary-title">
|
|
23
|
+
{{ params.titleHtml | safe if params.titleHtml else params.titleText }}
|
|
24
|
+
</h5>
|
|
25
|
+
{% else %}
|
|
26
|
+
<h2 class="mb-base font-bold" id="error-summary-title">
|
|
27
|
+
{{ params.titleHtml | safe if params.titleHtml else params.titleText }}
|
|
28
|
+
</h2>
|
|
29
|
+
{% endif %}
|
|
30
|
+
<div>
|
|
31
|
+
{% if params.descriptionHtml or params.descriptionText %}
|
|
32
|
+
<p class="mb-base">
|
|
33
|
+
{{ params.descriptionHtml | safe if params.descriptionHtml else params.descriptionText }}
|
|
34
|
+
</p>
|
|
35
|
+
{% endif %}
|
|
36
|
+
<ul class="font-semibold text-alert-base">
|
|
37
|
+
{% for item in params.errorList %}
|
|
38
|
+
<li>
|
|
39
|
+
{% if item.href %}
|
|
40
|
+
<a href="{{ item.href }}" class="c-link c-link--alert inline-block pb-sm"{% for attribute, value in item.attributes %} {{attribute}}="{{value}}"{% endfor %}>{{ item.html | filterquotes | safe if item.html else item.text }}</a>
|
|
41
|
+
{% else %}
|
|
42
|
+
{{ item.html | filterquotes | safe if item.html else item.text }}
|
|
43
|
+
{% endif %}
|
|
44
|
+
</li>
|
|
45
|
+
{% endfor %}
|
|
46
|
+
</ul>
|
|
47
|
+
</div>
|
|
48
|
+
</div>
|
|
49
49
|
<!-- /error-summary -->
|
|
@@ -1,50 +1,50 @@
|
|
|
1
|
-
params:
|
|
2
|
-
- name: titleText
|
|
3
|
-
type: string
|
|
4
|
-
required: true
|
|
5
|
-
description: If `titleHtml` is set, this is not required. Text to use for the heading of the error summary block. If `titleHtml` is provided, `titleText` will be ignored.
|
|
6
|
-
- name: titleHtml
|
|
7
|
-
type: string
|
|
8
|
-
required: true
|
|
9
|
-
description: If `titleText` is set, this is not required. HTML to use for the heading of the error summary block. If `titleHtml` is provided, `titleText` will be ignored.
|
|
10
|
-
- name: headingLevel
|
|
11
|
-
type: number
|
|
12
|
-
required: false
|
|
13
|
-
description: If headingLevel is 1, the parent heading tag needed inside this component will be a h1, if 2 will be a h2, and so on.
|
|
14
|
-
- name: descriptionText
|
|
15
|
-
type: string
|
|
16
|
-
required: false
|
|
17
|
-
description: Text to use for the description of the errors. If you set `descriptionHtml`, the component will ignore `descriptionText`.
|
|
18
|
-
- name: descriptionHtml
|
|
19
|
-
type: string
|
|
20
|
-
required: false
|
|
21
|
-
description: HTML to use for the description of the errors. If you set this option, the component will ignore `descriptionText`.
|
|
22
|
-
- name: errorList
|
|
23
|
-
type: array
|
|
24
|
-
required: true
|
|
25
|
-
description: Contains an array of error link items and all their available arguments.
|
|
26
|
-
params:
|
|
27
|
-
- name: href
|
|
28
|
-
type: string
|
|
29
|
-
required: false
|
|
30
|
-
description: Href attribute for the error link item. If provided item will be an anchor.
|
|
31
|
-
- name: text
|
|
32
|
-
type: string
|
|
33
|
-
required: true
|
|
34
|
-
description: If `html` is set, this is not required. Text for the error link item. If `html` is provided, the `text` argument will be ignored.
|
|
35
|
-
- name: html
|
|
36
|
-
type: string
|
|
37
|
-
required: true
|
|
38
|
-
description: If `text` is set, this is not required. HTML for the error link item. If `html` is provided, the `text` argument will be ignored.
|
|
39
|
-
- name: attributes
|
|
40
|
-
type: object
|
|
41
|
-
required: false
|
|
42
|
-
description: HTML attributes (for example data attributes) to add to the error link anchor.
|
|
43
|
-
- name: classes
|
|
44
|
-
type: string
|
|
45
|
-
required: false
|
|
46
|
-
description: Classes to add to the error-summary container.
|
|
47
|
-
- name: attributes
|
|
48
|
-
type: object
|
|
49
|
-
required: false
|
|
50
|
-
description: HTML attributes (for example data attributes) to add to the error-summary container.
|
|
1
|
+
params:
|
|
2
|
+
- name: titleText
|
|
3
|
+
type: string
|
|
4
|
+
required: true
|
|
5
|
+
description: If `titleHtml` is set, this is not required. Text to use for the heading of the error summary block. If `titleHtml` is provided, `titleText` will be ignored.
|
|
6
|
+
- name: titleHtml
|
|
7
|
+
type: string
|
|
8
|
+
required: true
|
|
9
|
+
description: If `titleText` is set, this is not required. HTML to use for the heading of the error summary block. If `titleHtml` is provided, `titleText` will be ignored.
|
|
10
|
+
- name: headingLevel
|
|
11
|
+
type: number
|
|
12
|
+
required: false
|
|
13
|
+
description: If headingLevel is 1, the parent heading tag needed inside this component will be a h1, if 2 will be a h2, and so on.
|
|
14
|
+
- name: descriptionText
|
|
15
|
+
type: string
|
|
16
|
+
required: false
|
|
17
|
+
description: Text to use for the description of the errors. If you set `descriptionHtml`, the component will ignore `descriptionText`.
|
|
18
|
+
- name: descriptionHtml
|
|
19
|
+
type: string
|
|
20
|
+
required: false
|
|
21
|
+
description: HTML to use for the description of the errors. If you set this option, the component will ignore `descriptionText`.
|
|
22
|
+
- name: errorList
|
|
23
|
+
type: array
|
|
24
|
+
required: true
|
|
25
|
+
description: Contains an array of error link items and all their available arguments.
|
|
26
|
+
params:
|
|
27
|
+
- name: href
|
|
28
|
+
type: string
|
|
29
|
+
required: false
|
|
30
|
+
description: Href attribute for the error link item. If provided item will be an anchor.
|
|
31
|
+
- name: text
|
|
32
|
+
type: string
|
|
33
|
+
required: true
|
|
34
|
+
description: If `html` is set, this is not required. Text for the error link item. If `html` is provided, the `text` argument will be ignored.
|
|
35
|
+
- name: html
|
|
36
|
+
type: string
|
|
37
|
+
required: true
|
|
38
|
+
description: If `text` is set, this is not required. HTML for the error link item. If `html` is provided, the `text` argument will be ignored.
|
|
39
|
+
- name: attributes
|
|
40
|
+
type: object
|
|
41
|
+
required: false
|
|
42
|
+
description: HTML attributes (for example data attributes) to add to the error link anchor.
|
|
43
|
+
- name: classes
|
|
44
|
+
type: string
|
|
45
|
+
required: false
|
|
46
|
+
description: Classes to add to the error-summary container.
|
|
47
|
+
- name: attributes
|
|
48
|
+
type: object
|
|
49
|
+
required: false
|
|
50
|
+
description: HTML attributes (for example data attributes) to add to the error-summary container.
|
|
@@ -1,80 +1,80 @@
|
|
|
1
|
-
{% from "components/input/_macro.input.njk" import componentInput %}
|
|
2
|
-
|
|
3
|
-
{% macro callerExample(id='id') %}
|
|
4
|
-
{{ componentInput({
|
|
5
|
-
"label": {
|
|
6
|
-
"text": "Número de teléfono"
|
|
7
|
-
},
|
|
8
|
-
"id": "tel-id-" + id,
|
|
9
|
-
"name": "tel-name-" + id
|
|
10
|
-
}) }}
|
|
11
|
-
{% endmacro %}
|
|
12
|
-
|
|
13
|
-
{% macro callerErrorExample(id='id') %}
|
|
14
|
-
{{ componentInput({
|
|
15
|
-
"label": {
|
|
16
|
-
"text": "Número de teléfono"
|
|
17
|
-
},
|
|
18
|
-
"id": "tel-error-id-" + id,
|
|
19
|
-
"name": "tel-error-name-" + id,
|
|
20
|
-
"errorMessage": {
|
|
21
|
-
"text": "Mensaje de error aqui"
|
|
22
|
-
}
|
|
23
|
-
}) }}
|
|
24
|
-
{% endmacro %}
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
{% set exampleComponent = "fieldset" %}
|
|
28
|
-
{% set examples = [
|
|
29
|
-
{
|
|
30
|
-
"name": "por defecto",
|
|
31
|
-
"data": {
|
|
32
|
-
"legend": {
|
|
33
|
-
"text": "¿Cuál es tu número de teléfono?",
|
|
34
|
-
"classes": "mb-sm"
|
|
35
|
-
},
|
|
36
|
-
"caller": callerExample('1').val
|
|
37
|
-
},
|
|
38
|
-
"visualDescription": "Fieldset con borde gris claro de 1px y fondo blanco. Contiene un label en texto negro regular, seguido de un campo de entrada de texto con borde gris de 1px y fondo blanco. El input tiene dimensiones estándar de aproximadamente 100px de ancho.",
|
|
39
|
-
"_generated": {
|
|
40
|
-
"hash": "4579013d15d9e0fe90959ea84ed8ed22",
|
|
41
|
-
"version": "15.0.3",
|
|
42
|
-
"timestamp": "2026-01-30T18:57:41.145Z"
|
|
43
|
-
}
|
|
44
|
-
},
|
|
45
|
-
{
|
|
46
|
-
"name": "con error",
|
|
47
|
-
"description": "Mostrar código para visualizar el <code>aria-describedby</code>, el <code>aria-errormessage</code> y <code>aria-invalid='true'</code> aplicado en el HTML. El <code>aria-errormessage</code> se asocia al fieldset, en vez de a un campo concreto, cuando el error hace referencia a los elementos en su conjunto. Debería apuntar al id de un mensaje de error que describa el problema general del fieldset.",
|
|
48
|
-
"data": {
|
|
49
|
-
"legend": {
|
|
50
|
-
"text": "¿Cuál es tu número de teléfono?",
|
|
51
|
-
"classes": "mb-sm"
|
|
52
|
-
},
|
|
53
|
-
"errorId": "error-id",
|
|
54
|
-
"caller": callerErrorExample('1').val
|
|
55
|
-
},
|
|
56
|
-
"visualDescription": "Fieldset con borde gris claro de 1px y fondo blanco. Incluye un label en texto negro regular, un sublabel en texto negro regular, un mensaje de error en texto rojo, y un campo de entrada con borde rojo de aproximadamente 2px y fondo blanco. El input mantiene dimensiones estándar de aproximadamente 100px de ancho.",
|
|
57
|
-
"_generated": {
|
|
58
|
-
"hash": "62df4723ee23a40d28fff0283b35e4bd",
|
|
59
|
-
"version": "15.0.3",
|
|
60
|
-
"timestamp": "2026-01-30T18:57:41.145Z"
|
|
61
|
-
}
|
|
62
|
-
},
|
|
63
|
-
{
|
|
64
|
-
"name": "con clases de css aplicadas",
|
|
65
|
-
"data": {
|
|
66
|
-
"legend": {
|
|
67
|
-
"text": "¿Cuál es tu número de teléfono?",
|
|
68
|
-
"classes": "mb-sm -ml-base px-base bg-white"
|
|
69
|
-
},
|
|
70
|
-
"classes": "p-lg border border-neutral-base",
|
|
71
|
-
"caller": callerExample('4').val
|
|
72
|
-
},
|
|
73
|
-
"visualDescription": "Fieldset con borde gris claro de 1px, fondo gris muy claro (casi blanco), y padding interno visible. Contiene un label en texto negro regular, seguido de un segundo label en texto negro regular, y un campo de entrada con borde gris de 1px y fondo blanco. El input tiene dimensiones estándar de aproximadamente 100px de ancho.",
|
|
74
|
-
"_generated": {
|
|
75
|
-
"hash": "82583d54e8964c1f02d2cc2bad614326",
|
|
76
|
-
"version": "15.0.3",
|
|
77
|
-
"timestamp": "2026-01-30T18:57:41.145Z"
|
|
78
|
-
}
|
|
79
|
-
}
|
|
1
|
+
{% from "components/input/_macro.input.njk" import componentInput %}
|
|
2
|
+
|
|
3
|
+
{% macro callerExample(id='id') %}
|
|
4
|
+
{{ componentInput({
|
|
5
|
+
"label": {
|
|
6
|
+
"text": "Número de teléfono"
|
|
7
|
+
},
|
|
8
|
+
"id": "tel-id-" + id,
|
|
9
|
+
"name": "tel-name-" + id
|
|
10
|
+
}) }}
|
|
11
|
+
{% endmacro %}
|
|
12
|
+
|
|
13
|
+
{% macro callerErrorExample(id='id') %}
|
|
14
|
+
{{ componentInput({
|
|
15
|
+
"label": {
|
|
16
|
+
"text": "Número de teléfono"
|
|
17
|
+
},
|
|
18
|
+
"id": "tel-error-id-" + id,
|
|
19
|
+
"name": "tel-error-name-" + id,
|
|
20
|
+
"errorMessage": {
|
|
21
|
+
"text": "Mensaje de error aqui"
|
|
22
|
+
}
|
|
23
|
+
}) }}
|
|
24
|
+
{% endmacro %}
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
{% set exampleComponent = "fieldset" %}
|
|
28
|
+
{% set examples = [
|
|
29
|
+
{
|
|
30
|
+
"name": "por defecto",
|
|
31
|
+
"data": {
|
|
32
|
+
"legend": {
|
|
33
|
+
"text": "¿Cuál es tu número de teléfono?",
|
|
34
|
+
"classes": "mb-sm"
|
|
35
|
+
},
|
|
36
|
+
"caller": callerExample('1').val
|
|
37
|
+
},
|
|
38
|
+
"visualDescription": "Fieldset con borde gris claro de 1px y fondo blanco. Contiene un label en texto negro regular, seguido de un campo de entrada de texto con borde gris de 1px y fondo blanco. El input tiene dimensiones estándar de aproximadamente 100px de ancho.",
|
|
39
|
+
"_generated": {
|
|
40
|
+
"hash": "4579013d15d9e0fe90959ea84ed8ed22",
|
|
41
|
+
"version": "15.0.3",
|
|
42
|
+
"timestamp": "2026-01-30T18:57:41.145Z"
|
|
43
|
+
}
|
|
44
|
+
},
|
|
45
|
+
{
|
|
46
|
+
"name": "con error",
|
|
47
|
+
"description": "Mostrar código para visualizar el <code>aria-describedby</code>, el <code>aria-errormessage</code> y <code>aria-invalid='true'</code> aplicado en el HTML. El <code>aria-errormessage</code> se asocia al fieldset, en vez de a un campo concreto, cuando el error hace referencia a los elementos en su conjunto. Debería apuntar al id de un mensaje de error que describa el problema general del fieldset.",
|
|
48
|
+
"data": {
|
|
49
|
+
"legend": {
|
|
50
|
+
"text": "¿Cuál es tu número de teléfono?",
|
|
51
|
+
"classes": "mb-sm"
|
|
52
|
+
},
|
|
53
|
+
"errorId": "error-id",
|
|
54
|
+
"caller": callerErrorExample('1').val
|
|
55
|
+
},
|
|
56
|
+
"visualDescription": "Fieldset con borde gris claro de 1px y fondo blanco. Incluye un label en texto negro regular, un sublabel en texto negro regular, un mensaje de error en texto rojo, y un campo de entrada con borde rojo de aproximadamente 2px y fondo blanco. El input mantiene dimensiones estándar de aproximadamente 100px de ancho.",
|
|
57
|
+
"_generated": {
|
|
58
|
+
"hash": "62df4723ee23a40d28fff0283b35e4bd",
|
|
59
|
+
"version": "15.0.3",
|
|
60
|
+
"timestamp": "2026-01-30T18:57:41.145Z"
|
|
61
|
+
}
|
|
62
|
+
},
|
|
63
|
+
{
|
|
64
|
+
"name": "con clases de css aplicadas",
|
|
65
|
+
"data": {
|
|
66
|
+
"legend": {
|
|
67
|
+
"text": "¿Cuál es tu número de teléfono?",
|
|
68
|
+
"classes": "mb-sm -ml-base px-base bg-white"
|
|
69
|
+
},
|
|
70
|
+
"classes": "p-lg border border-neutral-base",
|
|
71
|
+
"caller": callerExample('4').val
|
|
72
|
+
},
|
|
73
|
+
"visualDescription": "Fieldset con borde gris claro de 1px, fondo gris muy claro (casi blanco), y padding interno visible. Contiene un label en texto negro regular, seguido de un segundo label en texto negro regular, y un campo de entrada con borde gris de 1px y fondo blanco. El input tiene dimensiones estándar de aproximadamente 100px de ancho.",
|
|
74
|
+
"_generated": {
|
|
75
|
+
"hash": "82583d54e8964c1f02d2cc2bad614326",
|
|
76
|
+
"version": "15.0.3",
|
|
77
|
+
"timestamp": "2026-01-30T18:57:41.145Z"
|
|
78
|
+
}
|
|
79
|
+
}
|
|
80
80
|
] %}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
{% macro componentFieldset(params) %}
|
|
2
|
-
{% include "./_template.fieldset.njk" %}
|
|
1
|
+
{% macro componentFieldset(params) %}
|
|
2
|
+
{% include "./_template.fieldset.njk" %}
|
|
3
3
|
{% endmacro %}
|