@quartzds/core 1.0.0-beta.96 → 1.0.0-beta.98

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.
Files changed (156) hide show
  1. package/CHANGELOG.md +21 -0
  2. package/components/index.d.ts +2 -0
  3. package/components/index.js +2 -1
  4. package/components/index.js.map +1 -1
  5. package/components/{p-70d12c72.js → p-1bf3d7c6.js} +2 -2
  6. package/components/{p-70d12c72.js.map → p-1bf3d7c6.js.map} +1 -1
  7. package/components/{p-0f913a5b.js → p-29ad6b4e.js} +3 -3
  8. package/components/{p-0f913a5b.js.map → p-29ad6b4e.js.map} +1 -1
  9. package/components/{p-056195cc.js → p-6879ec37.js} +2 -2
  10. package/components/{p-056195cc.js.map → p-6879ec37.js.map} +1 -1
  11. package/components/{p-6b3dea37.js → p-88fcb762.js} +10 -9
  12. package/components/p-88fcb762.js.map +1 -0
  13. package/components/{p-deac3387.js → p-a4f61139.js} +5 -5
  14. package/components/{p-deac3387.js.map → p-a4f61139.js.map} +1 -1
  15. package/components/{p-2456dfb8.js → p-a6ca0040.js} +3 -3
  16. package/components/{p-2456dfb8.js.map → p-a6ca0040.js.map} +1 -1
  17. package/components/{p-8e8bd915.js → p-c4122977.js} +2 -3
  18. package/components/p-c4122977.js.map +1 -0
  19. package/components/{p-8abba29b.js → p-c58c7ab6.js} +2 -2
  20. package/components/p-c58c7ab6.js.map +1 -0
  21. package/components/{p-251cd601.js → p-da0bfe0b.js} +4 -4
  22. package/components/{p-251cd601.js.map → p-da0bfe0b.js.map} +1 -1
  23. package/components/qds-breadcrumb-item.js +2 -2
  24. package/components/qds-button.js +1 -1
  25. package/components/qds-checkbox.js +1 -1
  26. package/components/qds-chip.js +3 -3
  27. package/components/qds-dialog.js +1 -1
  28. package/components/qds-divider.js +1 -1
  29. package/components/qds-dropdown.js +1 -1
  30. package/components/qds-form-message.js +2 -2
  31. package/components/qds-icon.js +1 -1
  32. package/components/qds-inline-link.js +2 -2
  33. package/components/qds-input.js +5 -5
  34. package/components/qds-input.js.map +1 -1
  35. package/components/qds-label.js +1 -1
  36. package/components/qds-list-item.js +5 -5
  37. package/components/qds-loader.js +1 -1
  38. package/components/qds-mini-button.d.ts +11 -0
  39. package/components/qds-mini-button.js +163 -0
  40. package/components/qds-mini-button.js.map +1 -0
  41. package/components/qds-nav-list-item.js +6 -6
  42. package/components/qds-progress-bar.js +1 -1
  43. package/components/qds-radio.js +6 -6
  44. package/components/qds-select.js +2 -2
  45. package/components/qds-standalone-link.js +4 -4
  46. package/components/qds-switch.js +4 -4
  47. package/components/qds-tab.js +5 -5
  48. package/components/qds-tabbar.js +5 -5
  49. package/components/qds-table-body.js +2 -2
  50. package/components/qds-table-cell.js +2 -2
  51. package/components/qds-table-head-cell.js +1 -1
  52. package/components/qds-table-head.js +2 -2
  53. package/components/qds-table-row.js +2 -2
  54. package/components/qds-table.js +2 -2
  55. package/components/qds-tag.js +1 -1
  56. package/components/qds-textarea.js +1 -1
  57. package/components/qds-title.js +1 -1
  58. package/components/qds-tooltip.js +1 -1
  59. package/dist/cjs/{helpers-10154521.js → helpers-666c4403.js} +2 -2
  60. package/dist/cjs/helpers-666c4403.js.map +1 -0
  61. package/dist/cjs/index.cjs.js +1 -1
  62. package/dist/cjs/{library-23467d99.js → library-9772b9c7.js} +1 -2
  63. package/dist/cjs/library-9772b9c7.js.map +1 -0
  64. package/dist/cjs/loader.cjs.js +1 -1
  65. package/dist/cjs/qds-breadcrumb-item.cjs.entry.js +1 -1
  66. package/dist/cjs/qds-button.cjs.entry.js +7 -6
  67. package/dist/cjs/qds-button.cjs.entry.js.map +1 -1
  68. package/dist/cjs/qds-checkbox.cjs.entry.js +1 -1
  69. package/dist/cjs/qds-chip.cjs.entry.js +1 -1
  70. package/dist/cjs/qds-dialog.cjs.entry.js +1 -1
  71. package/dist/cjs/qds-divider.cjs.entry.js +1 -1
  72. package/dist/cjs/qds-dropdown.cjs.entry.js +1 -1
  73. package/dist/cjs/qds-form-message.cjs.entry.js +1 -1
  74. package/dist/cjs/qds-icon.cjs.entry.js +2 -2
  75. package/dist/cjs/qds-inline-link.cjs.entry.js +1 -1
  76. package/dist/cjs/qds-input.cjs.entry.js +2 -2
  77. package/dist/cjs/qds-input.cjs.entry.js.map +1 -1
  78. package/dist/cjs/qds-label.cjs.entry.js +1 -1
  79. package/dist/cjs/qds-list-item.cjs.entry.js +1 -1
  80. package/dist/cjs/qds-mini-button.cjs.entry.js +136 -0
  81. package/dist/cjs/qds-mini-button.cjs.entry.js.map +1 -0
  82. package/dist/cjs/qds-nav-list-item.cjs.entry.js +4 -4
  83. package/dist/cjs/qds-progress-bar.cjs.entry.js +1 -1
  84. package/dist/cjs/qds-radio.cjs.entry.js +3 -3
  85. package/dist/cjs/qds-select.cjs.entry.js +1 -1
  86. package/dist/cjs/qds-standalone-link.cjs.entry.js +3 -3
  87. package/dist/cjs/qds-switch.cjs.entry.js +4 -4
  88. package/dist/cjs/qds-tab.cjs.entry.js +1 -1
  89. package/dist/cjs/qds-tabbar.cjs.entry.js +1 -1
  90. package/dist/cjs/qds-table-body.cjs.entry.js +2 -2
  91. package/dist/cjs/qds-table-cell.cjs.entry.js +2 -2
  92. package/dist/cjs/qds-table-head-cell.cjs.entry.js +1 -1
  93. package/dist/cjs/qds-table-head.cjs.entry.js +2 -2
  94. package/dist/cjs/qds-table-row.cjs.entry.js +2 -2
  95. package/dist/cjs/qds-table.cjs.entry.js +2 -2
  96. package/dist/cjs/qds-tag_2.cjs.entry.js +2 -2
  97. package/dist/cjs/qds-textarea.cjs.entry.js +1 -1
  98. package/dist/cjs/qds-tooltip.cjs.entry.js +1 -1
  99. package/dist/cjs/qds.cjs.js +1 -1
  100. package/dist/custom-elements.json +353 -0
  101. package/dist/docs.json +320 -1
  102. package/dist/esm/{helpers-2e4ca34d.js → helpers-10f68bf3.js} +2 -2
  103. package/dist/esm/helpers-10f68bf3.js.map +1 -0
  104. package/dist/esm/index.js +1 -1
  105. package/dist/esm/{library-52ae166a.js → library-5ba069f5.js} +1 -2
  106. package/dist/esm/library-5ba069f5.js.map +1 -0
  107. package/dist/esm/loader.js +1 -1
  108. package/dist/esm/qds-breadcrumb-item.entry.js +1 -1
  109. package/dist/esm/qds-button.entry.js +7 -6
  110. package/dist/esm/qds-button.entry.js.map +1 -1
  111. package/dist/esm/qds-checkbox.entry.js +1 -1
  112. package/dist/esm/qds-chip.entry.js +1 -1
  113. package/dist/esm/qds-dialog.entry.js +1 -1
  114. package/dist/esm/qds-divider.entry.js +1 -1
  115. package/dist/esm/qds-dropdown.entry.js +1 -1
  116. package/dist/esm/qds-form-message.entry.js +1 -1
  117. package/dist/esm/qds-icon.entry.js +2 -2
  118. package/dist/esm/qds-inline-link.entry.js +1 -1
  119. package/dist/esm/qds-input.entry.js +2 -2
  120. package/dist/esm/qds-input.entry.js.map +1 -1
  121. package/dist/esm/qds-label.entry.js +1 -1
  122. package/dist/esm/qds-list-item.entry.js +1 -1
  123. package/dist/esm/qds-mini-button.entry.js +132 -0
  124. package/dist/esm/qds-mini-button.entry.js.map +1 -0
  125. package/dist/esm/qds-nav-list-item.entry.js +4 -4
  126. package/dist/esm/qds-progress-bar.entry.js +1 -1
  127. package/dist/esm/qds-radio.entry.js +3 -3
  128. package/dist/esm/qds-select.entry.js +1 -1
  129. package/dist/esm/qds-standalone-link.entry.js +3 -3
  130. package/dist/esm/qds-switch.entry.js +4 -4
  131. package/dist/esm/qds-tab.entry.js +1 -1
  132. package/dist/esm/qds-tabbar.entry.js +1 -1
  133. package/dist/esm/qds-table-body.entry.js +2 -2
  134. package/dist/esm/qds-table-cell.entry.js +2 -2
  135. package/dist/esm/qds-table-head-cell.entry.js +1 -1
  136. package/dist/esm/qds-table-head.entry.js +2 -2
  137. package/dist/esm/qds-table-row.entry.js +2 -2
  138. package/dist/esm/qds-table.entry.js +2 -2
  139. package/dist/esm/qds-tag_2.entry.js +2 -2
  140. package/dist/esm/qds-textarea.entry.js +1 -1
  141. package/dist/esm/qds-tooltip.entry.js +1 -1
  142. package/dist/esm/qds.js +1 -1
  143. package/dist/types/components/mini-button/mini-button.d.ts +82 -0
  144. package/dist/types/components/shared.d.ts +1 -1
  145. package/dist/types/components.d.ts +115 -0
  146. package/dist/vscode.html-custom-data.json +51 -0
  147. package/hydrate/index.js +451 -310
  148. package/hydrate/index.mjs +451 -310
  149. package/package.json +1 -1
  150. package/components/p-6b3dea37.js.map +0 -1
  151. package/components/p-8abba29b.js.map +0 -1
  152. package/components/p-8e8bd915.js.map +0 -1
  153. package/dist/cjs/helpers-10154521.js.map +0 -1
  154. package/dist/cjs/library-23467d99.js.map +0 -1
  155. package/dist/esm/helpers-2e4ca34d.js.map +0 -1
  156. package/dist/esm/library-52ae166a.js.map +0 -1
@@ -1 +1 @@
1
- {"file":"qds-input.entry.cjs.js","mappings":"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","names":["VALID_STATE","invariant","CUSTOM_ERROR_FLAGS","NO_ERROR_FLAGS","pickFocusEventAttributes","pickInputEventAttributes","inheritAriaAttributes","h"],"sources":["src/components/input/input.css?tag=qds-input&encapsulation=shadow","src/components/input/input.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n display: inline-block;\n}\n\n@-moz-document url-prefix() {\n [type='date'],\n [type='datetime-local'],\n [type='month'],\n [type='time'],\n [type='week'] {\n ~ .qds-icon-container {\n display: none;\n }\n }\n}\n\n.qds-container,\n.qds-input {\n max-width: inherit;\n width: inherit;\n}\n\n.qds-container {\n align-content: flex-start;\n align-items: center;\n box-sizing: border-box;\n display: grid;\n grid-template-areas: 'input';\n}\n\n.qds-icon {\n --qds-theme-interactive-background-hover: none;\n --qds-theme-interactive-background-pressed: none;\n --qds-control-small-height: var(--qds-control-small-icon-size);\n\n flex-shrink: 0;\n}\n\n.qds-input,\n.qds-icon-container {\n grid-area: input;\n}\n\n.qds-icon-container {\n display: flex;\n align-items: center;\n justify-content: center;\n justify-self: end;\n padding-inline-end: var(--qds-control-input-padding-horizontal);\n\n &.no-padding {\n padding-inline-end: 0;\n }\n}\n\n.qds-focus-ring {\n border-radius: max(\n 1px,\n var(\n --qds-control-border-radius-top-left,\n var(--qds-control-border-radius)\n )\n )\n max(\n 1px,\n var(\n --qds-control-border-radius-top-right,\n var(--qds-control-border-radius)\n )\n )\n max(\n 1px,\n var(\n --qds-control-border-radius-bottom-right,\n var(--qds-control-border-radius)\n )\n )\n max(\n 1px,\n var(\n --qds-control-border-radius-bottom-left,\n var(--qds-control-border-radius)\n )\n );\n grid-area: input;\n isolation: isolate;\n outline: var(--qds-control-input-focus-border-width) solid\n var(--qds-theme-control-input-focus-border);\n pointer-events: none;\n visibility: hidden;\n width: calc(\n 100% + var(--qds-control-border-width) -\n var(\n --qds-control-border-width-inline-end,\n var(--qds-control-border-width)\n )\n );\n height: calc(\n 100% + var(--qds-control-border-width) -\n var(--qds-control-border-width-block-end, var(--qds-control-border-width))\n );\n}\n\n[data-size='small'] {\n font: var(--qds-control-small-text);\n height: var(--qds-control-small-height);\n\n &.qds-icon {\n --qds-experimental-icon-click-target-size: var(--qds-control-small-height);\n\n width: var(--qds-control-small-icon-size);\n height: var(--qds-control-small-icon-size);\n }\n\n & ~ .qds-icon-container {\n gap: var(--qds-control-small-gap-internal);\n margin-inline-start: var(--qds-control-small-gap-internal);\n }\n\n &.qds-password-padding,\n &[type='date'],\n &[type='datetime-local'],\n &[type='email'],\n &[type='month'],\n &[type='time'],\n &[type='url'],\n &[type='tel'],\n &[type='week'] {\n padding-inline: var(--qds-control-input-padding-horizontal)\n calc(\n var(--qds-control-input-padding-horizontal) +\n var(--qds-control-small-height)\n );\n }\n\n &[type='file']::file-selector-button {\n font: var(--qds-control-small-text);\n height: var(--qds-control-small-height);\n margin-inline-end: var(--qds-control-small-gap-siblings-related);\n padding-inline: var(--qds-control-button-small-padding-horizontal);\n }\n\n &[type='number']::-webkit-inner-spin-button,\n &[type='number']::-webkit-outer-spin-button {\n margin-inline-start: var(--qds-control-small-gap-internal);\n }\n\n &[type='search'] {\n padding-inline: var(--qds-control-input-padding-horizontal)\n calc(\n var(--qds-control-small-height) + var(--qds-control-small-icon-size) +\n var(--qds-control-input-padding-horizontal) +\n var(--qds-control-small-gap-internal)\n );\n }\n}\n\n[data-size='standard'] {\n font: var(--qds-control-standard-text);\n height: var(--qds-control-standard-height);\n\n &.qds-icon {\n --qds-experimental-icon-click-target-size: var(\n --qds-control-standard-height\n );\n\n width: var(--qds-control-standard-icon-size);\n height: var(--qds-control-standard-icon-size);\n }\n\n & ~ .qds-icon-container {\n gap: var(--qds-control-standard-gap-internal);\n margin-inline-start: var(--qds-control-standard-gap-internal);\n }\n\n &.qds-password-padding,\n &[type='date'],\n &[type='datetime-local'],\n &[type='email'],\n &[type='month'],\n &[type='time'],\n &[type='url'],\n &[type='tel'],\n &[type='week'] {\n padding-inline: var(--qds-control-input-padding-horizontal)\n calc(\n var(--qds-control-input-padding-horizontal) +\n var(--qds-control-standard-height)\n );\n }\n\n &[type='file']::file-selector-button {\n font: var(--qds-control-standard-text);\n height: var(--qds-control-standard-height);\n margin-inline-end: var(--qds-control-standard-gap-siblings-related);\n padding-inline: var(--qds-control-button-standard-padding-horizontal);\n }\n\n &[type='number']::-webkit-inner-spin-button,\n &[type='number']::-webkit-outer-spin-button {\n margin-inline-start: var(--qds-control-standard-gap-internal);\n }\n\n &[type='search'] {\n padding-inline: var(--qds-control-input-padding-horizontal)\n calc(\n var(--qds-control-small-height) + var(--qds-control-standard-icon-size) +\n var(--qds-control-input-padding-horizontal) +\n var(--qds-control-standard-gap-internal)\n );\n }\n}\n\n[data-size='large'] {\n font: var(--qds-control-large-text);\n height: var(--qds-control-large-height);\n\n &.qds-icon {\n --qds-experimental-icon-click-target-size: var(--qds-control-large-height);\n\n width: var(--qds-control-large-icon-size);\n height: var(--qds-control-large-icon-size);\n }\n\n & ~ .qds-icon-container {\n gap: var(--qds-control-large-gap-internal);\n margin-inline-start: var(--qds-control-large-gap-internal);\n }\n\n &.qds-password-padding,\n &[type='date'],\n &[type='datetime-local'],\n &[type='email'],\n &[type='month'],\n &[type='time'],\n &[type='url'],\n &[type='tel'],\n &[type='week'] {\n padding-inline: var(--qds-control-input-padding-horizontal)\n calc(\n var(--qds-control-input-padding-horizontal) +\n var(--qds-control-large-height)\n );\n }\n\n &[type='file']::file-selector-button {\n font: var(--qds-control-large-text);\n height: var(--qds-control-large-height);\n margin-inline-end: var(--qds-control-large-gap-siblings-related);\n padding-inline: var(--qds-control-button-large-padding-horizontal);\n }\n\n &[type='number'] {\n &::-webkit-inner-spin-button,\n &::-webkit-outer-spin-button {\n margin-inline-start: var(--qds-control-large-gap-internal);\n }\n }\n\n &[type='search'] {\n padding-inline: var(--qds-control-input-padding-horizontal)\n calc(\n var(--qds-control-small-height) + var(--qds-control-large-icon-size) +\n var(--qds-control-input-padding-horizontal) +\n var(--qds-control-large-gap-internal)\n );\n }\n}\n\n.qds-input {\n appearance: textfield;\n background-color: var(--qds-theme-control-input-background);\n border-color: var(--qds-theme-control-border);\n border-radius: var(\n --qds-control-border-radius-top-left,\n var(--qds-control-border-radius)\n )\n var(--qds-control-border-radius-top-right, var(--qds-control-border-radius))\n var(\n --qds-control-border-radius-bottom-right,\n var(--qds-control-border-radius)\n )\n var(\n --qds-control-border-radius-bottom-left,\n var(--qds-control-border-radius)\n );\n border-style: solid;\n border-width: var(--qds-control-border-width)\n var(--qds-control-border-width-inline-end, var(--qds-control-border-width))\n var(--qds-control-border-width-block-end, var(--qds-control-border-width))\n var(--qds-control-border-width);\n box-sizing: border-box;\n color: var(--qds-theme-control-text-standard);\n grid-area: input;\n padding-block: 0;\n padding-inline: var(--qds-control-input-padding-horizontal);\n\n &.qds-hide ~ .qds-icon-container {\n display: none;\n }\n\n &:disabled {\n opacity: var(--qds-theme-disabled);\n pointer-events: none;\n }\n\n &:focus-visible {\n outline: none;\n\n ~ .qds-focus-ring {\n visibility: visible;\n }\n }\n\n &:placeholder-shown {\n color: var(--qds-theme-control-text-placeholder);\n }\n\n &:not(:focus):user-invalid {\n border-color: var(--qds-theme-feedback-result-failure);\n }\n\n &:is(\n [type='date'],\n [type='datetime-local'],\n [type='month'],\n [type='time'],\n [type='week']\n )::-webkit-calendar-picker-indicator,\n &::-webkit-search-cancel-button {\n cursor: pointer;\n display: none;\n }\n\n &[type='file'] {\n padding-block: var(--qds-control-input-padding-horizontal);\n\n &::file-selector-button {\n background-color: transparent;\n border: var(--qds-control-border-width) solid\n var(--qds-theme-control-border);\n border-radius: var(--qds-control-border-radius);\n color: var(--qds-theme-control-text-standard);\n\n &:hover {\n background-color: var(--qds-theme-interactive-background-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-interactive-background-pressed);\n }\n }\n }\n\n &[type='color'],\n &[type='number'] {\n padding-inline: var(--qds-control-input-padding-horizontal);\n }\n\n &[type='color'] {\n appearance: none;\n min-width: 50px;\n padding-block: var(--qds-control-input-padding-horizontal);\n\n &::-webkit-color-swatch-wrapper {\n padding: 0;\n }\n\n &::-webkit-color-swatch {\n border: var(--qds-control-border-width) solid\n var(--qds-theme-control-border);\n border-radius: var(--qds-control-border-radius);\n }\n\n &::-moz-color-swatch {\n border: var(--qds-control-border-width) solid\n var(--qds-theme-control-border);\n border-radius: var(--qds-control-border-radius);\n }\n\n cursor: pointer;\n\n &:hover {\n background-color: var(--qds-theme-interactive-background-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-interactive-background-pressed);\n }\n }\n\n &[data-size='small'],\n &[data-size='standard'],\n &[data-size='large'] {\n &.qds-search-padding {\n padding-inline: var(--qds-control-input-padding-horizontal)\n calc(\n var(--qds-control-small-height) +\n var(--qds-control-input-padding-horizontal)\n );\n }\n\n &[type='file'] {\n height: initial;\n }\n\n &.qds-padding {\n padding-inline: var(--qds-control-input-padding-horizontal);\n }\n\n @-moz-document url-prefix() {\n &[type='date'],\n &[type='datetime-local'],\n &[type='month'],\n &[type='week'],\n &[type='time'] {\n padding-inline-end: var(--qds-control-input-padding-horizontal);\n }\n }\n }\n\n @-moz-document url-prefix() {\n &[type='number'] {\n appearance: none;\n }\n }\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport {\n AttachInternals,\n Component,\n Element,\n Event,\n h,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core'\n\nimport type {\n Attributes,\n QdsFocusEventDetail,\n QdsInputEventDetail,\n} from '../../helpers'\nimport {\n inheritAriaAttributes,\n invariant,\n pickFocusEventAttributes,\n pickInputEventAttributes,\n} from '../../helpers'\nimport type { AutoComplete, EnterKeyHint, InputMode, Value } from '../controls'\nimport { CUSTOM_ERROR_FLAGS, NO_ERROR_FLAGS, VALID_STATE } from '../controls'\nimport type { Size } from '../shared'\n\nexport type Capture = '' | 'environment' | 'user'\n\nexport type InputType =\n | 'color'\n | 'date'\n | 'datetime-local'\n | 'email'\n | 'file'\n | 'month'\n | 'number'\n | 'password'\n | 'search'\n | 'tel'\n | 'text'\n | 'time'\n | 'url'\n | 'week'\n\n/**\n * The `<qds-input>` element is used to create interactive controls for\n * web-based forms in order to accept data from the user; a wide variety of\n * types of input data and control widgets are available, depending on the\n * device and\n * [user agent](https://developer.mozilla.org/docs/Glossary/User_agent).\n *\n * @see https://quartz.se.com/build/components/input\n */\n@Component({\n tag: 'qds-input',\n formAssociated: true,\n shadow: { delegatesFocus: true },\n styleUrl: 'input.css',\n})\nexport class Input implements ComponentInterface {\n /**\n * Hide the input type's icon.\n *\n * > **_NOTE:_** Due to browser limitations, the icon may not be hidden in\n * all browsers.\n */\n @Prop() public readonly noIcon?: boolean = false\n\n /**\n * The input's size.\n *\n * > **_NOTE:_** The native [`size` HTML attribute][size] is not supported.\n * CSS `width` should be used instead if this functionality is needed.\n *\n * [size]: https://developer.mozilla.org/docs/Web/HTML/Attributes/size\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * Defines the file types the `file` type input should accept. This is a\n * comma-separated list of [unique file type specifiers][]. Because a given\n * file type may be identified in more than one manner, it's useful to\n * provide a thorough set of type specifiers when you files of a given format\n * are needed.\n *\n * For instance, there are a number of ways Microsoft Word files can be\n * identified, so a site that accepts Word files might use a `<qds-input>`\n * like this:\n *\n * @example\n * <qds-input\n * type=\"file\"\n * accept=\".doc,.docx,.xml,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document\"\n * ></qds-input>\n *\n * [unique file type specifiers]: https://developer.mozilla.org/docs/Web/HTML/Element/input/file#unique_file_type_specifiers\n *\n * @webnative\n */\n @Prop() public readonly accept?: string\n\n /**\n * Provides a hint for a [user agent's][] autocomplete feature. See\n * [the HTML `autocomplete` attribute][autocomplete] for a complete list of\n * values and details on how to use `autoComplete`.\n *\n * [user agent's]: https://developer.mozilla.org/docs/Glossary/User_agent\n * [autocomplete]: https://developer.mozilla.org/docs/Web/HTML/Attributes/autocomplete\n *\n * @webnative\n */\n @Prop({ attribute: 'autocomplete' })\n public readonly autoComplete?: AutoComplete\n\n /**\n * Specifies that a new file should be captured and which device should be\n * used to capture that new media of the type defined by `accept`.\n *\n * Values include `user`, `environment`, and `''`:\n *\n * - `user`: The user-facing camera and/or microphone should be used.\n * - `environment`: The outward-facing camera and/or microphone should be\n * used.\n * - `''`: The implementation-specific capture state.\n *\n * @webnative\n */\n @Prop() public readonly capture?: Capture\n\n /**\n * Prevents the input from being interacted with: it cannot be pressed or\n * focused.\n *\n * @webnative\n */\n @Prop() public readonly disabled?: boolean\n\n /**\n * What action label (or icon) to present for the enter key on virtual\n * keyboards. Possible values:\n *\n * - `\"done\"`: Typically meaning there is nothing more to input and the input\n * method editor (IME) will be closed.\n * - `\"enter\"`:\tTypically inserting a new line.\n * - `\"go\"`: \tTypically meaning to take the user to the target of the text\n * they typed.\n * - `\"next\"`: \tTypically taking the user to the next field that will accept\n * text.\n * - `\"previous\"`: Typically taking the user to the previous field that will\n * accept text.\n * - `\"search\"`: Typically taking the user to the results of searching for\n * the text they have typed.\n * - `\"send\"`: Typically delivering the text to its target.\n *\n * @webnative\n */\n // FIXME: Can't use `attribute` option here to name this `enterKeyHint` instead.\n @Prop() public readonly enterkeyhint?: EnterKeyHint\n\n /**\n * Returns a file list for a `file` type input.\n *\n * @readonly\n * @webnative\n */\n // eslint-disable-next-line unicorn/no-null\n @Prop() public readonly files: HTMLInputElement['files'] = null\n\n /**\n * The [`<form>`][] element to associate the input with (its form owner).\n *\n * The value of this attribute must be the id of a `<form>` in the same\n * document. If this attribute is not set, the `<qds-input>` is associated\n * with its ancestor `<form>` element, if any.\n *\n * This attribute lets you associate `<qds-input>` elements to `<form>`s\n * anywhere in the document, not just inside a `<form>`. It can also override\n * an ancestor `<form>` element.\n *\n * [`<form>`]: https://developer.mozilla.org/docs/Web/HTML/Element/form\n *\n * @readonly\n * @webnative\n */\n // eslint-disable-next-line unicorn/no-null\n @Prop() public readonly form: ElementInternals['form'] | string = null\n\n /**\n * Provide a hint to browsers as to the type of virtual keyboard\n * configuration to use when editing this element or its contents.\n *\n * @webnative\n */\n // FIXME: Can't use `attribute` option here to name this `inputMode` instead.\n @Prop() public readonly inputmode?: InputMode\n\n /**\n * Returns a list of the [`<label>`][] elements associated with the\n * `qds-input` element.\n *\n * [`<label>`]: https://developer.mozilla.org/docs/Web/HTML/Element/label\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly labels: ElementInternals['labels'] =\n {} as ElementInternals['labels']\n\n /**\n * Defines the greatest value in the range of permitted values. If the\n * `value` entered into the input exceeds this, the input fails\n * [constraint validation][]. Only valid for `date`, `datetime-local`,\n * `month`, `time`, and `week` inputs.\n *\n * If this value isn't a valid number, then the input has no maximum value.\n *\n * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n *\n * @webnative\n */\n @Prop() public readonly max?: number | string\n\n /**\n * The maximum number of characters (as UTF-16 code units) the user can enter\n * into the input. This must be an non-negative integer value. If no\n * `maxlength` is specified, or an invalid value is specified, the input has\n * no maximum length. Only valid for `email`, `password`, `search`, `tel`,\n * `text`, and `url` inputs.\n *\n * The input will fail [constraint validation][] if the length of the text\n * entered into the field is greater than `maxlength` UTF-16 code units long.\n * By default, browsers prevent users from entering more characters than\n * allowed by the `maxlength` attribute. See [Client-side validation][] for\n * more information.\n *\n * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n *\n * @webnative\n */\n @Prop({ attribute: 'maxlength' }) public readonly maxLength?: number\n\n /**\n * Defines the most negative value in the range of permitted values. If the\n * `value` entered into the input is less than this, the input fails\n * [constraint validation][]. Only valid for `date`, `datetime-local`,\n * `month`, `time`, and `week` inputs.\n *\n * This value must be less than or equal to the value of the `max` attribute.\n * If this value isn't a valid number, then the input has no minimum value.\n *\n * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n *\n * @webnative\n */\n @Prop() public readonly min?: number | string\n\n /**\n * The minimum number of characters (as UTF-16 code units) the user can enter\n * into the input. This must be an non-negative integer value smaller than or\n * equal to the value specified by `maxlength`. If no `minlength` is\n * specified, or an invalid value is specified, the input has no minimum\n * length. Only valid for `email`, `password`, `search`, `tel`, `text`, and\n * `url` inputs.\n *\n * The input will fail [constraint validation][] if the length of the text\n * entered into the field is fewer than `minlength` UTF-16 code units long,\n * preventing form submission. See [Client-side validation][] for more\n * information.\n *\n * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n *\n * @webnative\n */\n @Prop({ attribute: 'minlength' }) public readonly minLength?: number\n\n /**\n * For `email` inputs, specifies if multiple comma-separated email addresses\n * can be entered. For `file` inputs, specifies if the user is allowed to\n * select more than one file.\n *\n * Only valid for `email` or `file` inputs.\n *\n * @webnative\n */\n @Prop() public readonly multiple?: boolean\n\n /**\n * The name of the input, which is submitted with the form data.\n *\n * @webnative\n */\n @Prop() public readonly name?: string\n\n /**\n * Defines a regular expression that the input's `value` must match in order\n * for the value to pass [constraint validation][]. It must be a valid\n * JavaScript regular expression, as used by the [`RegExp`][] type, and as\n * documented in MDN's [guide on regular expressions][]; the `'u'` flag is\n * specified when compiling the regular expression, so that the pattern is\n * treated as a sequence of Unicode code points, instead of as ASCII. No\n * forward slashes should be specified around the pattern text. Only valid\n * for `email`, `password`, `search`, `tel`, `text`, and `url` inputs.\n *\n * If the `pattern` is invalid, no regular expression is applied and this\n * property is ignored. If the pattern is valid and a non-empty value does\n * not match the pattern, constraint validation will prevent form submission.\n *\n * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n * [`RegExp`]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/RegExp\n * [guide on regular expressions]: https://developer.mozilla.org/docs/Web/JavaScript/Guide/Regular_Expressions\n *\n * @webnative\n */\n @Prop() public readonly pattern?: string\n\n /**\n * Text that appears in the input when it has no value set. Only valid for\n * `email`, `number`, `password`, `search`, `tel`, `text`, and `url` inputs.\n *\n * @webnative\n */\n @Prop() public readonly placeholder?: string\n\n /**\n * A value must be specified for the input before the owning form can be\n * submitted. Not valid for `color` inputs.\n *\n * See [Client-side validation][] and the\n * [HTML attribute: `required`][required] for more information.\n *\n * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n * [required]: https://developer.mozilla.org/docs/Web/HTML/Attributes/required\n *\n * @webnative\n */\n @Prop() public readonly required?: boolean\n\n /**\n * Get or set the selection direction of a text selection.\n *\n * > **_NOTE:_** This property has no effect when used as an attribute.\n *\n * @webnative\n */\n @Prop({ mutable: true })\n // eslint-disable-next-line unicorn/no-null\n public selectionDirection: HTMLInputElement['selectionDirection'] = null\n\n /**\n * Get or set the ending position or offset of a text selection.\n *\n * > **_NOTE:_** This property has no effect when used as an attribute.\n *\n * @webnative\n */\n @Prop({ mutable: true })\n // eslint-disable-next-line unicorn/no-null\n public selectionEnd: HTMLInputElement['selectionEnd'] = null\n\n /**\n * Get or set the starting position or offset of a text selection.\n *\n * > **_NOTE:_** This property has no effect when used as an attribute.\n *\n * @webnative\n */\n @Prop({ mutable: true })\n // eslint-disable-next-line unicorn/no-null\n public selectionStart: HTMLInputElement['selectionStart'] = null\n\n /**\n * Specifies the granularity that the `value` must adhere to. Only valid for\n * `date`, `datetime-local`, `month`, `number`, `time`, and `week` inputs.\n *\n * The value must be a positive number—integer or float—or the special value\n * `any`, which means no stepping is implied, and any value is allowed\n * (barring other constraints, such as `min` and `max`).\n *\n * If `any` is not explicitly set, valid values for the `number` are the\n * basis for stepping — the `min` value and increments of the step value, up\n * to the `max` value, if specified.\n *\n * @webnative\n */\n @Prop() public readonly step?: number | 'any'\n\n /**\n * The type of input to render:\n *\n * - `\"date\"`: An input for entering a date (year, month, and day, with no\n * time). Opens a date picker or numeric wheels for year, month, day when\n * active in supporting browsers.\n * - `\"datetime-local\"`: An input for entering a date and time, with no time\n * zone. Opens a date picker or numeric wheels for date and time components\n * when active in supporting browsers.\n * - `\"email\"`: An input for editing an email address. Looks like a `\"text\"`\n * input, but has validation parameters and relevant keyboard in supporting\n * browsers and devices with dynamic keyboards.\n * - `\"month\"`: An input for entering a month and year, with no time zone.\n * - `\"number\"`: An input for entering a number. Displays a spinner and adds\n * default validation when supported. Displays a numeric keypad in some\n * devices with dynamic keypads.\n * - `\"password\"`: A single-line text input whose value is obscured. Will\n * alert user if site is not secure.\n * - `\"search\"`: A single-line text input for entering search strings.\n * Line-breaks are automatically removed from the input value. May include a\n * delete icon in supporting browsers that can be used to clear the input.\n * Displays a search icon instead of enter key on some devices with dynamic\n * keypads.\n * - `\"tel\"`: An input for entering a telephone number. Displays a telephone\n * keypad in some devices with dynamic keypads.\n * - `\"text\"`: A single-line text input. Line-breaks are automatically\n * removed from the input value.\n * - `\"time\"`: An input for entering a time value with no time zone.\n * - `\"url\"`: An input for entering a URL. Looks like a `\"text\"` input, but\n * has validation parameters and relevant keyboard in supporting browsers and\n * devices with dynamic keyboards.\n * - `\"week\"`: An input for entering a date consisting of a week-year number\n * and a week number with no time zone.\n *\n * @webnative\n */\n @Prop() public readonly type?: InputType\n\n /**\n * The error message that would be shown to the user if the `<qds-input>`\n * was to be checked for validity.\n *\n * @readonly\n * @webnative\n */\n @Prop()\n public readonly validationMessage: ElementInternals['validationMessage'] = ''\n\n /**\n * The [`ValidityState`][] object for this `<qds-input>`.\n *\n * [`ValidityState`]: https://developer.mozilla.org/docs/Web/API/ValidityState\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly validity: ElementInternals['validity'] = VALID_STATE\n\n /**\n * The value of the input.\n *\n * @webnative\n */\n @Prop({ mutable: true }) public value?: Value\n\n /**\n * True if `<qds-input>` will be validated when the form is submitted; false\n * otherwise.\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly willValidate: ElementInternals['willValidate'] = false\n\n @AttachInternals() private readonly internals!: ElementInternals\n\n /**\n * Emitted when the input loses focus.\n */\n @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the user cancels the file picker via the <kbd>Esc</kbd> key\n * or the cancel button and when the user re-selects the same files that were\n * previously selected.\n */\n @Event({ eventName: 'qdsCancel', cancelable: false })\n private readonly cancelEmitter!: EventEmitter<void>\n\n /**\n * Emitted when an alteration to the input's value is committed by the user.\n */\n @Event({ eventName: 'qdsChange', cancelable: false })\n private readonly changeEmitter!: EventEmitter<void>\n\n /**\n * Emitted when the input gains focus.\n */\n @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the input's value changes.\n */\n @Event({ eventName: 'qdsInput', cancelable: false })\n private readonly inputEmitter!: EventEmitter<QdsInputEventDetail>\n\n @Element() private readonly host!: HTMLElement\n\n @State() private tabIndex?: number\n\n @State() private isPasswordVisible = false\n\n #inheritedAttributes: Attributes = {}\n\n #input?: HTMLInputElement\n\n get #computedDisabled(): boolean {\n return this.host.matches(':disabled') || (this.disabled ?? false)\n }\n\n get #computedIconName():\n | `input-${InputType}`\n | `input-password-hide`\n | `input-password-show`\n | undefined {\n if (this.type === 'password')\n return this.isPasswordVisible\n ? 'input-password-hide'\n : 'input-password-show'\n\n switch (this.type) {\n case 'date':\n case 'datetime-local':\n case 'email':\n case 'month':\n case 'search':\n case 'tel':\n case 'time':\n case 'url':\n case 'week': {\n return `input-${this.type}`\n }\n default: {\n return undefined\n }\n }\n }\n\n get #computedSize(): Size {\n switch (this.size) {\n case 'standard':\n case 'small':\n case 'large': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n get #computedValue(): Parameters<ElementInternals['setFormValue']>[0] {\n if (typeof this.value === 'number') return this.value.toString()\n // eslint-disable-next-line unicorn/no-null\n return this.value === undefined ? null : this.value\n }\n\n get #hasIcon(): boolean {\n return (\n typeof this.type === 'string' &&\n ['email', 'tel', 'url'].includes(this.type)\n )\n }\n\n get #hasInteractiveIcon(): boolean {\n return (\n typeof this.type === 'string' &&\n ['month', 'time', 'date', 'datetime-local', 'week', 'password'].includes(\n this.type,\n )\n )\n }\n\n get #iconClickHandler(): () => void {\n return this.type === 'password'\n ? this.#togglePasswordVisibility\n : this.showPicker\n }\n\n get #computedType(): InputType {\n return this.type === 'password' && this.isPasswordVisible\n ? 'text'\n : (this.type ?? 'text')\n }\n\n get #computedAriaLabel(): string {\n return this.type === 'password'\n ? this.isPasswordVisible\n ? 'Hide password'\n : 'Show password'\n : (this.type ?? '')\n }\n\n @Listen('click')\n protected onClick(event: MouseEvent): void {\n if (this.#computedDisabled) event.stopImmediatePropagation()\n }\n\n @Listen('keydown')\n protected onKeydown(event: KeyboardEvent): void {\n if (this.#computedDisabled) {\n event.stopImmediatePropagation()\n return\n }\n\n if (event.key === 'Enter' && this.internals.form) {\n this.internals.form.requestSubmit()\n event.preventDefault()\n }\n }\n\n @Watch('disabled')\n protected disabledChanged(): void {\n if (this.#computedDisabled)\n // eslint-disable-next-line unicorn/no-null\n this.internals.setFormValue(null)\n else this.internals.setFormValue(this.#computedValue)\n }\n\n @Watch('selectionDirection')\n protected selectionDirectionChanged(): void {\n invariant(this.#input)\n\n this.#input.selectionDirection = this.selectionDirection\n }\n\n @Watch('selectionEnd')\n protected selectionEndChanged(): void {\n invariant(this.#input)\n\n this.#input.selectionEnd = this.selectionEnd\n }\n\n @Watch('selectionStart')\n protected selectionStartChanged(): void {\n invariant(this.#input)\n\n this.#input.selectionStart = this.selectionStart\n }\n\n @Watch('tabindex')\n protected tabindexChanged(newValue: string): void {\n const parsedValue = Number.parseInt(newValue, 10)\n this.tabIndex =\n parsedValue === 0 || Number.isNaN(parsedValue) ? undefined : parsedValue\n }\n\n @Watch('max')\n @Watch('maxLength')\n @Watch('min')\n @Watch('minLength')\n @Watch('pattern')\n @Watch('required')\n @Watch('step')\n @Watch('type')\n @Watch('value')\n protected validationChanged(): void {\n if (!this.#input) return\n\n if (this.#input.max !== this.max && this.max !== undefined)\n this.#input.max = this.max.toString()\n if (this.maxLength !== undefined) this.#input.maxLength = this.maxLength\n if (this.#input.min !== this.min && this.min !== undefined)\n this.#input.min = this.min.toString()\n if (this.minLength !== undefined) this.#input.minLength = this.minLength\n if (this.pattern !== undefined) this.#input.pattern = this.pattern\n this.#input.required = this.required ?? false\n if (this.#input.step !== this.step && this.step !== undefined)\n this.#input.step = this.step.toString()\n this.#input.type = this.#computedType\n\n // eslint-disable-next-line unicorn/no-null\n if (this.type !== 'file' && this.value != null)\n this.#input.value = this.value.toString()\n\n const { valid } = this.#input.validity\n if (valid)\n this.internals.setValidity(NO_ERROR_FLAGS, undefined, this.#input)\n else\n this.internals.setValidity(\n this.#input.validity,\n this.#input.validationMessage,\n this.#input,\n )\n }\n\n @Watch('value')\n protected valueChanged(): void {\n if (!this.#computedDisabled)\n this.internals.setFormValue(this.#computedValue)\n\n if (\n (this.#computedValue === null || this.#computedValue === '') &&\n this.type === 'file'\n ) {\n this.#clearValue()\n }\n }\n\n public componentWillLoad(): void {\n this.#defineGetter('form', () => this.internals.form)\n this.#defineGetter('willValidate', () => this.internals.willValidate)\n this.#defineGetter('validity', () => this.internals.validity)\n this.#defineGetter(\n 'validationMessage',\n () => this.internals.validationMessage,\n )\n this.#defineGetter('files', this.#getFiles)\n this.#defineGetter('labels', () => this.internals.labels)\n\n this.#inheritedAttributes = inheritAriaAttributes(this.host)\n this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\n }\n\n public componentDidLoad(): void {\n invariant(this.#input)\n\n this.validationChanged()\n this.valueChanged()\n // FIXME: This event is supported by the native `<input>` element but not\n // recognized by Stencil's type definitions, so it needs to be manually\n // bound here.\n this.#input.addEventListener('cancel', this.#onCancel)\n }\n\n public disconnectedCallback(): void {\n if (this.#input) this.#input.removeEventListener('cancel', this.#onCancel)\n }\n\n public render() {\n const hasValue =\n this.value !== null && this.value !== undefined && this.value !== ''\n const isSearchType = this.type === 'search'\n const shouldShowClearButton = isSearchType && hasValue\n const shouldShowSearchIcon = isSearchType && this.noIcon === false\n const shouldHideIcon = !isSearchType && this.noIcon === true\n const shouldRemoveSearchPadding = isSearchType && this.noIcon === true\n\n return (\n <div class=\"qds-container\">\n <input\n accept={this.accept}\n autoCapitalize={this.host.autocapitalize}\n autoComplete={this.autoComplete}\n // eslint-disable-next-line jsx-a11y/no-autofocus\n autoFocus={this.host.autofocus}\n capture={this.capture}\n class={{\n 'qds-search-padding': shouldRemoveSearchPadding,\n 'qds-input': true,\n 'qds-hide': shouldHideIcon,\n 'qds-padding': shouldHideIcon,\n 'qds-password-padding':\n this.type === 'password' ||\n (this.isPasswordVisible && this.type === 'text'),\n }}\n data-size={this.#computedSize}\n disabled={this.disabled}\n enterKeyHint={this.enterkeyhint}\n inputMode={this.inputmode}\n max={this.max}\n maxLength={this.maxLength}\n min={this.min}\n minLength={this.minLength}\n multiple={this.multiple}\n onBlur={this.#onBlur}\n onChange={this.#onChange}\n onFocus={this.#onFocus}\n onInput={this.#onInput}\n placeholder={this.placeholder}\n ref={this.#ref}\n spellcheck={this.host.spellcheck}\n step={this.step}\n tabIndex={this.#computedDisabled ? undefined : this.tabIndex}\n type={this.#computedType}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.#inheritedAttributes}\n />\n <div class=\"qds-focus-ring\" />\n {this.#computedIconName && (\n <div\n class={{\n 'qds-icon-container': true,\n 'no-padding': shouldRemoveSearchPadding,\n }}\n >\n {shouldShowClearButton && (\n <qds-button\n class={{\n 'qds-icon': true,\n 'qds-hide': !hasValue,\n }}\n disabled={this.disabled}\n iconLibrary=\"core\"\n iconName=\"clear\"\n iconOnly\n importance=\"subdued\"\n onClick={this.#onClear}\n size=\"small\"\n text=\"clear input\"\n />\n )}\n {this.#hasIcon && (\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon\"\n data-size={this.#computedSize}\n library=\"core\"\n name={this.#computedIconName}\n />\n )}\n {this.#hasInteractiveIcon && (\n <qds-button\n class=\"qds-icon\"\n disabled={this.disabled}\n iconLibrary=\"core\"\n iconName={this.#computedIconName}\n iconOnly\n importance=\"subdued\"\n onClick={this.#iconClickHandler}\n size=\"small\"\n text={this.#computedAriaLabel}\n />\n )}\n {shouldShowSearchIcon ? (\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon\"\n data-size={this.#computedSize}\n library=\"core\"\n name={this.#computedIconName}\n />\n ) : (\n <div />\n )}\n </div>\n )}\n </div>\n )\n }\n\n public checkValidity: ElementInternals['checkValidity'] = () =>\n this.internals.checkValidity()\n\n public reportValidity: ElementInternals['reportValidity'] = () =>\n this.internals.reportValidity()\n\n public setCustomValidity: HTMLInputElement['setCustomValidity'] = (error) => {\n invariant(this.#input)\n\n this.#input.setCustomValidity(error)\n if (error)\n this.internals.setValidity(CUSTOM_ERROR_FLAGS, error, this.#input)\n else this.internals.setValidity(NO_ERROR_FLAGS)\n }\n\n public select: HTMLInputElement['select'] = () => {\n invariant(this.#input)\n\n this.#input.select()\n }\n\n public getSelectionDirection: () => HTMLInputElement['selectionDirection'] =\n () => {\n invariant(this.#input)\n\n return this.#input.selectionDirection\n }\n\n public getSelectionStart: () => HTMLInputElement['selectionStart'] = () => {\n invariant(this.#input)\n\n return this.#input.selectionStart\n }\n\n public getSelectionEnd: () => HTMLInputElement['selectionEnd'] = () => {\n invariant(this.#input)\n\n return this.#input.selectionEnd\n }\n\n public setRangeText = (\n replacement: string,\n start: number,\n end: number,\n selectionMode?: SelectionMode,\n ): void => {\n invariant(this.#input)\n\n this.#input.setRangeText(replacement, start, end, selectionMode)\n\n if (this.value !== this.#input.value) {\n this.value = this.#input.value\n this.inputEmitter.emit()\n this.changeEmitter.emit()\n }\n }\n\n public setSelectionRange: HTMLInputElement['setSelectionRange'] = (\n start,\n end,\n direction,\n ) => {\n invariant(this.#input)\n\n this.#input.setSelectionRange(start, end, direction)\n }\n\n public stepDown: HTMLInputElement['stepDown'] = (n) => {\n invariant(this.#input)\n\n this.#input.stepDown(n)\n }\n\n public stepUp: HTMLInputElement['stepUp'] = (n) => {\n invariant(this.#input)\n\n this.#input.stepUp(n)\n }\n\n public showPicker: HTMLInputElement['showPicker'] = () => {\n invariant(this.#input)\n\n this.#input.showPicker()\n }\n\n readonly #togglePasswordVisibility = (): void => {\n invariant(this.#input)\n this.isPasswordVisible = !this.isPasswordVisible\n\n this.#input.type = this.#computedType\n }\n\n readonly #ref = (input?: HTMLInputElement): void => {\n this.#input = input\n }\n\n readonly #getFiles: () => HTMLInputElement['files'] = () => {\n invariant(this.#input)\n\n return this.#input.files\n }\n\n readonly #onBlur = (event: FocusEvent): void => {\n this.blurEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onCancel = (): void => {\n this.cancelEmitter.emit()\n }\n\n readonly #onChange = (): void => {\n this.changeEmitter.emit()\n }\n\n readonly #onClear = (): void => {\n this.#clearValue()\n this.#onInput(new InputEvent('input', { inputType: 'deleteContent' }))\n }\n\n readonly #onFocus = (event: FocusEvent): void => {\n this.focusEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onInput = (event: InputEvent): void => {\n invariant(this.#input)\n\n this.value = this.#input.value\n this.inputEmitter.emit(pickInputEventAttributes(event))\n }\n\n #defineGetter(p: PropertyKey, get: () => unknown): void {\n Object.defineProperty(this.host, p, { enumerable: true, get })\n }\n\n #clearValue(): void {\n invariant(this.#input)\n\n this.#input.value = ''\n }\n}\n"],"version":3}
1
+ {"file":"qds-input.entry.cjs.js","mappings":"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","names":["VALID_STATE","invariant","CUSTOM_ERROR_FLAGS","NO_ERROR_FLAGS","pickFocusEventAttributes","pickInputEventAttributes","inheritAriaAttributes","h"],"sources":["src/components/input/input.css?tag=qds-input&encapsulation=shadow","src/components/input/input.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n display: inline-block;\n}\n\n@-moz-document url-prefix() {\n [type='date'],\n [type='datetime-local'],\n [type='month'],\n [type='time'],\n [type='week'] {\n ~ .qds-icon-container {\n display: none;\n }\n }\n}\n\n.qds-container,\n.qds-input {\n max-width: inherit;\n width: inherit;\n}\n\n.qds-container {\n align-content: flex-start;\n align-items: center;\n box-sizing: border-box;\n display: grid;\n grid-template-areas: 'input';\n}\n\n.qds-icon {\n --qds-theme-interactive-background-hover: none;\n --qds-theme-interactive-background-pressed: none;\n --qds-control-small-height: var(--qds-control-small-icon-size);\n\n flex-shrink: 0;\n}\n\n.qds-input,\n.qds-icon-container {\n grid-area: input;\n}\n\n.qds-icon-container {\n display: flex;\n align-items: center;\n justify-content: center;\n justify-self: end;\n padding-inline-end: var(--qds-control-input-padding-horizontal);\n\n &.no-padding {\n padding-inline-end: 0;\n }\n}\n\n.qds-focus-ring {\n border-radius: max(\n 1px,\n var(\n --qds-control-border-radius-top-left,\n var(--qds-control-border-radius)\n )\n )\n max(\n 1px,\n var(\n --qds-control-border-radius-top-right,\n var(--qds-control-border-radius)\n )\n )\n max(\n 1px,\n var(\n --qds-control-border-radius-bottom-right,\n var(--qds-control-border-radius)\n )\n )\n max(\n 1px,\n var(\n --qds-control-border-radius-bottom-left,\n var(--qds-control-border-radius)\n )\n );\n grid-area: input;\n isolation: isolate;\n outline: var(--qds-control-input-focus-border-width) solid\n var(--qds-theme-control-input-focus-border);\n pointer-events: none;\n visibility: hidden;\n width: calc(\n 100% + var(--qds-control-border-width) -\n var(\n --qds-control-border-width-inline-end,\n var(--qds-control-border-width)\n )\n );\n height: calc(\n 100% + var(--qds-control-border-width) -\n var(--qds-control-border-width-block-end, var(--qds-control-border-width))\n );\n}\n\n[data-size='small'] {\n font: var(--qds-control-small-text);\n height: var(--qds-control-small-height);\n\n &.qds-icon {\n --qds-experimental-icon-click-target-size: var(--qds-control-small-height);\n\n width: var(--qds-control-small-icon-size);\n height: var(--qds-control-small-icon-size);\n }\n\n & ~ .qds-icon-container {\n gap: var(--qds-control-small-gap-internal);\n margin-inline-start: var(--qds-control-small-gap-internal);\n }\n\n &.qds-password-padding,\n &[type='date'],\n &[type='datetime-local'],\n &[type='email'],\n &[type='month'],\n &[type='time'],\n &[type='url'],\n &[type='tel'],\n &[type='week'] {\n padding-inline: var(--qds-control-input-padding-horizontal)\n calc(\n var(--qds-control-input-padding-horizontal) +\n var(--qds-control-small-height)\n );\n }\n\n &[type='file']::file-selector-button {\n font: var(--qds-control-small-text);\n height: var(--qds-control-small-height);\n margin-inline-end: var(--qds-control-small-gap-siblings-related);\n padding-inline: var(--qds-control-button-small-padding-horizontal);\n }\n\n &[type='number']::-webkit-inner-spin-button,\n &[type='number']::-webkit-outer-spin-button {\n margin-inline-start: var(--qds-control-small-gap-internal);\n }\n\n &[type='search'] {\n padding-inline: var(--qds-control-input-padding-horizontal)\n calc(\n var(--qds-control-small-height) + var(--qds-control-small-icon-size) +\n var(--qds-control-input-padding-horizontal) +\n var(--qds-control-small-gap-internal)\n );\n }\n}\n\n[data-size='standard'] {\n font: var(--qds-control-standard-text);\n height: var(--qds-control-standard-height);\n\n &.qds-icon {\n --qds-experimental-icon-click-target-size: var(\n --qds-control-standard-height\n );\n\n width: var(--qds-control-standard-icon-size);\n height: var(--qds-control-standard-icon-size);\n }\n\n & ~ .qds-icon-container {\n gap: var(--qds-control-standard-gap-internal);\n margin-inline-start: var(--qds-control-standard-gap-internal);\n }\n\n &.qds-password-padding,\n &[type='date'],\n &[type='datetime-local'],\n &[type='email'],\n &[type='month'],\n &[type='time'],\n &[type='url'],\n &[type='tel'],\n &[type='week'] {\n padding-inline: var(--qds-control-input-padding-horizontal)\n calc(\n var(--qds-control-input-padding-horizontal) +\n var(--qds-control-standard-height)\n );\n }\n\n &[type='file']::file-selector-button {\n font: var(--qds-control-standard-text);\n height: var(--qds-control-standard-height);\n margin-inline-end: var(--qds-control-standard-gap-siblings-related);\n padding-inline: var(--qds-control-button-standard-padding-horizontal);\n }\n\n &[type='number']::-webkit-inner-spin-button,\n &[type='number']::-webkit-outer-spin-button {\n margin-inline-start: var(--qds-control-standard-gap-internal);\n }\n\n &[type='search'] {\n padding-inline: var(--qds-control-input-padding-horizontal)\n calc(\n var(--qds-control-small-height) + var(--qds-control-standard-icon-size) +\n var(--qds-control-input-padding-horizontal) +\n var(--qds-control-standard-gap-internal)\n );\n }\n}\n\n[data-size='large'] {\n font: var(--qds-control-large-text);\n height: var(--qds-control-large-height);\n\n &.qds-icon {\n --qds-experimental-icon-click-target-size: var(--qds-control-large-height);\n\n width: var(--qds-control-large-icon-size);\n height: var(--qds-control-large-icon-size);\n }\n\n & ~ .qds-icon-container {\n gap: var(--qds-control-large-gap-internal);\n margin-inline-start: var(--qds-control-large-gap-internal);\n }\n\n &.qds-password-padding,\n &[type='date'],\n &[type='datetime-local'],\n &[type='email'],\n &[type='month'],\n &[type='time'],\n &[type='url'],\n &[type='tel'],\n &[type='week'] {\n padding-inline: var(--qds-control-input-padding-horizontal)\n calc(\n var(--qds-control-input-padding-horizontal) +\n var(--qds-control-large-height)\n );\n }\n\n &[type='file']::file-selector-button {\n font: var(--qds-control-large-text);\n height: var(--qds-control-large-height);\n margin-inline-end: var(--qds-control-large-gap-siblings-related);\n padding-inline: var(--qds-control-button-large-padding-horizontal);\n }\n\n &[type='number'] {\n &::-webkit-inner-spin-button,\n &::-webkit-outer-spin-button {\n margin-inline-start: var(--qds-control-large-gap-internal);\n }\n }\n\n &[type='search'] {\n padding-inline: var(--qds-control-input-padding-horizontal)\n calc(\n var(--qds-control-small-height) + var(--qds-control-large-icon-size) +\n var(--qds-control-input-padding-horizontal) +\n var(--qds-control-large-gap-internal)\n );\n }\n}\n\n.qds-input {\n appearance: textfield;\n background-color: var(--qds-theme-control-input-background);\n border-color: var(--qds-theme-control-border);\n border-radius: var(\n --qds-control-border-radius-top-left,\n var(--qds-control-border-radius)\n )\n var(--qds-control-border-radius-top-right, var(--qds-control-border-radius))\n var(\n --qds-control-border-radius-bottom-right,\n var(--qds-control-border-radius)\n )\n var(\n --qds-control-border-radius-bottom-left,\n var(--qds-control-border-radius)\n );\n border-style: solid;\n border-width: var(--qds-control-border-width)\n var(--qds-control-border-width-inline-end, var(--qds-control-border-width))\n var(--qds-control-border-width-block-end, var(--qds-control-border-width))\n var(--qds-control-border-width);\n box-sizing: border-box;\n color: var(--qds-theme-control-text-standard);\n grid-area: input;\n padding-block: 0;\n padding-inline: var(--qds-control-input-padding-horizontal);\n\n &.qds-hide ~ .qds-icon-container {\n display: none;\n }\n\n &:disabled,\n &:disabled ~ .qds-icon-container {\n opacity: var(--qds-theme-disabled);\n pointer-events: none;\n }\n\n &:focus-visible {\n outline: none;\n\n ~ .qds-focus-ring {\n visibility: visible;\n }\n }\n\n &:placeholder-shown {\n color: var(--qds-theme-control-text-placeholder);\n }\n\n &:not(:focus):user-invalid {\n border-color: var(--qds-theme-feedback-result-failure);\n }\n\n &:is(\n [type='date'],\n [type='datetime-local'],\n [type='month'],\n [type='time'],\n [type='week']\n )::-webkit-calendar-picker-indicator,\n &::-webkit-search-cancel-button {\n cursor: pointer;\n display: none;\n }\n\n &[type='file'] {\n padding-block: var(--qds-control-input-padding-horizontal);\n\n &::file-selector-button {\n background-color: transparent;\n border: var(--qds-control-border-width) solid\n var(--qds-theme-control-border);\n border-radius: var(--qds-control-border-radius);\n color: var(--qds-theme-control-text-standard);\n\n &:hover {\n background-color: var(--qds-theme-interactive-background-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-interactive-background-pressed);\n }\n }\n }\n\n &[type='color'],\n &[type='number'] {\n padding-inline: var(--qds-control-input-padding-horizontal);\n }\n\n &[type='color'] {\n appearance: none;\n min-width: 50px;\n padding-block: var(--qds-control-input-padding-horizontal);\n\n &::-webkit-color-swatch-wrapper {\n padding: 0;\n }\n\n &::-webkit-color-swatch {\n border: var(--qds-control-border-width) solid\n var(--qds-theme-control-border);\n border-radius: var(--qds-control-border-radius);\n }\n\n &::-moz-color-swatch {\n border: var(--qds-control-border-width) solid\n var(--qds-theme-control-border);\n border-radius: var(--qds-control-border-radius);\n }\n\n cursor: pointer;\n\n &:hover {\n background-color: var(--qds-theme-interactive-background-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-interactive-background-pressed);\n }\n }\n\n &[data-size='small'],\n &[data-size='standard'],\n &[data-size='large'] {\n &.qds-search-padding {\n padding-inline: var(--qds-control-input-padding-horizontal)\n calc(\n var(--qds-control-small-height) +\n var(--qds-control-input-padding-horizontal)\n );\n }\n\n &[type='file'] {\n height: initial;\n }\n\n &.qds-padding {\n padding-inline: var(--qds-control-input-padding-horizontal);\n }\n\n @-moz-document url-prefix() {\n &[type='date'],\n &[type='datetime-local'],\n &[type='month'],\n &[type='week'],\n &[type='time'] {\n padding-inline-end: var(--qds-control-input-padding-horizontal);\n }\n }\n }\n\n @-moz-document url-prefix() {\n &[type='number'] {\n appearance: none;\n }\n }\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport {\n AttachInternals,\n Component,\n Element,\n Event,\n h,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core'\n\nimport type {\n Attributes,\n QdsFocusEventDetail,\n QdsInputEventDetail,\n} from '../../helpers'\nimport {\n inheritAriaAttributes,\n invariant,\n pickFocusEventAttributes,\n pickInputEventAttributes,\n} from '../../helpers'\nimport type { AutoComplete, EnterKeyHint, InputMode, Value } from '../controls'\nimport { CUSTOM_ERROR_FLAGS, NO_ERROR_FLAGS, VALID_STATE } from '../controls'\nimport type { Size } from '../shared'\n\nexport type Capture = '' | 'environment' | 'user'\n\nexport type InputType =\n | 'color'\n | 'date'\n | 'datetime-local'\n | 'email'\n | 'file'\n | 'month'\n | 'number'\n | 'password'\n | 'search'\n | 'tel'\n | 'text'\n | 'time'\n | 'url'\n | 'week'\n\n/**\n * The `<qds-input>` element is used to create interactive controls for\n * web-based forms in order to accept data from the user; a wide variety of\n * types of input data and control widgets are available, depending on the\n * device and\n * [user agent](https://developer.mozilla.org/docs/Glossary/User_agent).\n *\n * @see https://quartz.se.com/build/components/input\n */\n@Component({\n tag: 'qds-input',\n formAssociated: true,\n shadow: { delegatesFocus: true },\n styleUrl: 'input.css',\n})\nexport class Input implements ComponentInterface {\n /**\n * Hide the input type's icon.\n *\n * > **_NOTE:_** Due to browser limitations, the icon may not be hidden in\n * all browsers.\n */\n @Prop() public readonly noIcon?: boolean = false\n\n /**\n * The input's size.\n *\n * > **_NOTE:_** The native [`size` HTML attribute][size] is not supported.\n * CSS `width` should be used instead if this functionality is needed.\n *\n * [size]: https://developer.mozilla.org/docs/Web/HTML/Attributes/size\n */\n @Prop() public readonly size?: Size = 'standard'\n\n /**\n * Defines the file types the `file` type input should accept. This is a\n * comma-separated list of [unique file type specifiers][]. Because a given\n * file type may be identified in more than one manner, it's useful to\n * provide a thorough set of type specifiers when you files of a given format\n * are needed.\n *\n * For instance, there are a number of ways Microsoft Word files can be\n * identified, so a site that accepts Word files might use a `<qds-input>`\n * like this:\n *\n * @example\n * <qds-input\n * type=\"file\"\n * accept=\".doc,.docx,.xml,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document\"\n * ></qds-input>\n *\n * [unique file type specifiers]: https://developer.mozilla.org/docs/Web/HTML/Element/input/file#unique_file_type_specifiers\n *\n * @webnative\n */\n @Prop() public readonly accept?: string\n\n /**\n * Provides a hint for a [user agent's][] autocomplete feature. See\n * [the HTML `autocomplete` attribute][autocomplete] for a complete list of\n * values and details on how to use `autoComplete`.\n *\n * [user agent's]: https://developer.mozilla.org/docs/Glossary/User_agent\n * [autocomplete]: https://developer.mozilla.org/docs/Web/HTML/Attributes/autocomplete\n *\n * @webnative\n */\n @Prop({ attribute: 'autocomplete' })\n public readonly autoComplete?: AutoComplete\n\n /**\n * Specifies that a new file should be captured and which device should be\n * used to capture that new media of the type defined by `accept`.\n *\n * Values include `user`, `environment`, and `''`:\n *\n * - `user`: The user-facing camera and/or microphone should be used.\n * - `environment`: The outward-facing camera and/or microphone should be\n * used.\n * - `''`: The implementation-specific capture state.\n *\n * @webnative\n */\n @Prop() public readonly capture?: Capture\n\n /**\n * Prevents the input from being interacted with: it cannot be pressed or\n * focused.\n *\n * @webnative\n */\n @Prop() public readonly disabled?: boolean\n\n /**\n * What action label (or icon) to present for the enter key on virtual\n * keyboards. Possible values:\n *\n * - `\"done\"`: Typically meaning there is nothing more to input and the input\n * method editor (IME) will be closed.\n * - `\"enter\"`:\tTypically inserting a new line.\n * - `\"go\"`: \tTypically meaning to take the user to the target of the text\n * they typed.\n * - `\"next\"`: \tTypically taking the user to the next field that will accept\n * text.\n * - `\"previous\"`: Typically taking the user to the previous field that will\n * accept text.\n * - `\"search\"`: Typically taking the user to the results of searching for\n * the text they have typed.\n * - `\"send\"`: Typically delivering the text to its target.\n *\n * @webnative\n */\n // FIXME: Can't use `attribute` option here to name this `enterKeyHint` instead.\n @Prop() public readonly enterkeyhint?: EnterKeyHint\n\n /**\n * Returns a file list for a `file` type input.\n *\n * @readonly\n * @webnative\n */\n // eslint-disable-next-line unicorn/no-null\n @Prop() public readonly files: HTMLInputElement['files'] = null\n\n /**\n * The [`<form>`][] element to associate the input with (its form owner).\n *\n * The value of this attribute must be the id of a `<form>` in the same\n * document. If this attribute is not set, the `<qds-input>` is associated\n * with its ancestor `<form>` element, if any.\n *\n * This attribute lets you associate `<qds-input>` elements to `<form>`s\n * anywhere in the document, not just inside a `<form>`. It can also override\n * an ancestor `<form>` element.\n *\n * [`<form>`]: https://developer.mozilla.org/docs/Web/HTML/Element/form\n *\n * @readonly\n * @webnative\n */\n // eslint-disable-next-line unicorn/no-null\n @Prop() public readonly form: ElementInternals['form'] | string = null\n\n /**\n * Provide a hint to browsers as to the type of virtual keyboard\n * configuration to use when editing this element or its contents.\n *\n * @webnative\n */\n // FIXME: Can't use `attribute` option here to name this `inputMode` instead.\n @Prop() public readonly inputmode?: InputMode\n\n /**\n * Returns a list of the [`<label>`][] elements associated with the\n * `qds-input` element.\n *\n * [`<label>`]: https://developer.mozilla.org/docs/Web/HTML/Element/label\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly labels: ElementInternals['labels'] =\n {} as ElementInternals['labels']\n\n /**\n * Defines the greatest value in the range of permitted values. If the\n * `value` entered into the input exceeds this, the input fails\n * [constraint validation][]. Only valid for `date`, `datetime-local`,\n * `month`, `time`, and `week` inputs.\n *\n * If this value isn't a valid number, then the input has no maximum value.\n *\n * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n *\n * @webnative\n */\n @Prop() public readonly max?: number | string\n\n /**\n * The maximum number of characters (as UTF-16 code units) the user can enter\n * into the input. This must be an non-negative integer value. If no\n * `maxlength` is specified, or an invalid value is specified, the input has\n * no maximum length. Only valid for `email`, `password`, `search`, `tel`,\n * `text`, and `url` inputs.\n *\n * The input will fail [constraint validation][] if the length of the text\n * entered into the field is greater than `maxlength` UTF-16 code units long.\n * By default, browsers prevent users from entering more characters than\n * allowed by the `maxlength` attribute. See [Client-side validation][] for\n * more information.\n *\n * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n *\n * @webnative\n */\n @Prop({ attribute: 'maxlength' }) public readonly maxLength?: number\n\n /**\n * Defines the most negative value in the range of permitted values. If the\n * `value` entered into the input is less than this, the input fails\n * [constraint validation][]. Only valid for `date`, `datetime-local`,\n * `month`, `time`, and `week` inputs.\n *\n * This value must be less than or equal to the value of the `max` attribute.\n * If this value isn't a valid number, then the input has no minimum value.\n *\n * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n *\n * @webnative\n */\n @Prop() public readonly min?: number | string\n\n /**\n * The minimum number of characters (as UTF-16 code units) the user can enter\n * into the input. This must be an non-negative integer value smaller than or\n * equal to the value specified by `maxlength`. If no `minlength` is\n * specified, or an invalid value is specified, the input has no minimum\n * length. Only valid for `email`, `password`, `search`, `tel`, `text`, and\n * `url` inputs.\n *\n * The input will fail [constraint validation][] if the length of the text\n * entered into the field is fewer than `minlength` UTF-16 code units long,\n * preventing form submission. See [Client-side validation][] for more\n * information.\n *\n * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n *\n * @webnative\n */\n @Prop({ attribute: 'minlength' }) public readonly minLength?: number\n\n /**\n * For `email` inputs, specifies if multiple comma-separated email addresses\n * can be entered. For `file` inputs, specifies if the user is allowed to\n * select more than one file.\n *\n * Only valid for `email` or `file` inputs.\n *\n * @webnative\n */\n @Prop() public readonly multiple?: boolean\n\n /**\n * The name of the input, which is submitted with the form data.\n *\n * @webnative\n */\n @Prop() public readonly name?: string\n\n /**\n * Defines a regular expression that the input's `value` must match in order\n * for the value to pass [constraint validation][]. It must be a valid\n * JavaScript regular expression, as used by the [`RegExp`][] type, and as\n * documented in MDN's [guide on regular expressions][]; the `'u'` flag is\n * specified when compiling the regular expression, so that the pattern is\n * treated as a sequence of Unicode code points, instead of as ASCII. No\n * forward slashes should be specified around the pattern text. Only valid\n * for `email`, `password`, `search`, `tel`, `text`, and `url` inputs.\n *\n * If the `pattern` is invalid, no regular expression is applied and this\n * property is ignored. If the pattern is valid and a non-empty value does\n * not match the pattern, constraint validation will prevent form submission.\n *\n * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n * [`RegExp`]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/RegExp\n * [guide on regular expressions]: https://developer.mozilla.org/docs/Web/JavaScript/Guide/Regular_Expressions\n *\n * @webnative\n */\n @Prop() public readonly pattern?: string\n\n /**\n * Text that appears in the input when it has no value set. Only valid for\n * `email`, `number`, `password`, `search`, `tel`, `text`, and `url` inputs.\n *\n * @webnative\n */\n @Prop() public readonly placeholder?: string\n\n /**\n * A value must be specified for the input before the owning form can be\n * submitted. Not valid for `color` inputs.\n *\n * See [Client-side validation][] and the\n * [HTML attribute: `required`][required] for more information.\n *\n * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n * [required]: https://developer.mozilla.org/docs/Web/HTML/Attributes/required\n *\n * @webnative\n */\n @Prop() public readonly required?: boolean\n\n /**\n * Get or set the selection direction of a text selection.\n *\n * > **_NOTE:_** This property has no effect when used as an attribute.\n *\n * @webnative\n */\n @Prop({ mutable: true })\n // eslint-disable-next-line unicorn/no-null\n public selectionDirection: HTMLInputElement['selectionDirection'] = null\n\n /**\n * Get or set the ending position or offset of a text selection.\n *\n * > **_NOTE:_** This property has no effect when used as an attribute.\n *\n * @webnative\n */\n @Prop({ mutable: true })\n // eslint-disable-next-line unicorn/no-null\n public selectionEnd: HTMLInputElement['selectionEnd'] = null\n\n /**\n * Get or set the starting position or offset of a text selection.\n *\n * > **_NOTE:_** This property has no effect when used as an attribute.\n *\n * @webnative\n */\n @Prop({ mutable: true })\n // eslint-disable-next-line unicorn/no-null\n public selectionStart: HTMLInputElement['selectionStart'] = null\n\n /**\n * Specifies the granularity that the `value` must adhere to. Only valid for\n * `date`, `datetime-local`, `month`, `number`, `time`, and `week` inputs.\n *\n * The value must be a positive number—integer or float—or the special value\n * `any`, which means no stepping is implied, and any value is allowed\n * (barring other constraints, such as `min` and `max`).\n *\n * If `any` is not explicitly set, valid values for the `number` are the\n * basis for stepping — the `min` value and increments of the step value, up\n * to the `max` value, if specified.\n *\n * @webnative\n */\n @Prop() public readonly step?: number | 'any'\n\n /**\n * The type of input to render:\n *\n * - `\"date\"`: An input for entering a date (year, month, and day, with no\n * time). Opens a date picker or numeric wheels for year, month, day when\n * active in supporting browsers.\n * - `\"datetime-local\"`: An input for entering a date and time, with no time\n * zone. Opens a date picker or numeric wheels for date and time components\n * when active in supporting browsers.\n * - `\"email\"`: An input for editing an email address. Looks like a `\"text\"`\n * input, but has validation parameters and relevant keyboard in supporting\n * browsers and devices with dynamic keyboards.\n * - `\"month\"`: An input for entering a month and year, with no time zone.\n * - `\"number\"`: An input for entering a number. Displays a spinner and adds\n * default validation when supported. Displays a numeric keypad in some\n * devices with dynamic keypads.\n * - `\"password\"`: A single-line text input whose value is obscured. Will\n * alert user if site is not secure.\n * - `\"search\"`: A single-line text input for entering search strings.\n * Line-breaks are automatically removed from the input value. May include a\n * delete icon in supporting browsers that can be used to clear the input.\n * Displays a search icon instead of enter key on some devices with dynamic\n * keypads.\n * - `\"tel\"`: An input for entering a telephone number. Displays a telephone\n * keypad in some devices with dynamic keypads.\n * - `\"text\"`: A single-line text input. Line-breaks are automatically\n * removed from the input value.\n * - `\"time\"`: An input for entering a time value with no time zone.\n * - `\"url\"`: An input for entering a URL. Looks like a `\"text\"` input, but\n * has validation parameters and relevant keyboard in supporting browsers and\n * devices with dynamic keyboards.\n * - `\"week\"`: An input for entering a date consisting of a week-year number\n * and a week number with no time zone.\n *\n * @webnative\n */\n @Prop() public readonly type?: InputType\n\n /**\n * The error message that would be shown to the user if the `<qds-input>`\n * was to be checked for validity.\n *\n * @readonly\n * @webnative\n */\n @Prop()\n public readonly validationMessage: ElementInternals['validationMessage'] = ''\n\n /**\n * The [`ValidityState`][] object for this `<qds-input>`.\n *\n * [`ValidityState`]: https://developer.mozilla.org/docs/Web/API/ValidityState\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly validity: ElementInternals['validity'] = VALID_STATE\n\n /**\n * The value of the input.\n *\n * @webnative\n */\n @Prop({ mutable: true }) public value?: Value\n\n /**\n * True if `<qds-input>` will be validated when the form is submitted; false\n * otherwise.\n *\n * @readonly\n * @webnative\n */\n @Prop() public readonly willValidate: ElementInternals['willValidate'] = false\n\n @AttachInternals() private readonly internals!: ElementInternals\n\n /**\n * Emitted when the input loses focus.\n */\n @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the user cancels the file picker via the <kbd>Esc</kbd> key\n * or the cancel button and when the user re-selects the same files that were\n * previously selected.\n */\n @Event({ eventName: 'qdsCancel', cancelable: false })\n private readonly cancelEmitter!: EventEmitter<void>\n\n /**\n * Emitted when an alteration to the input's value is committed by the user.\n */\n @Event({ eventName: 'qdsChange', cancelable: false })\n private readonly changeEmitter!: EventEmitter<void>\n\n /**\n * Emitted when the input gains focus.\n */\n @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the input's value changes.\n */\n @Event({ eventName: 'qdsInput', cancelable: false })\n private readonly inputEmitter!: EventEmitter<QdsInputEventDetail>\n\n @Element() private readonly host!: HTMLElement\n\n @State() private tabIndex?: number\n\n @State() private isPasswordVisible = false\n\n #inheritedAttributes: Attributes = {}\n\n #input?: HTMLInputElement\n\n get #computedDisabled(): boolean {\n return this.host.matches(':disabled') || (this.disabled ?? false)\n }\n\n get #computedIconName():\n | `input-${InputType}`\n | `input-password-hide`\n | `input-password-show`\n | undefined {\n if (this.type === 'password')\n return this.isPasswordVisible\n ? 'input-password-hide'\n : 'input-password-show'\n\n switch (this.type) {\n case 'date':\n case 'datetime-local':\n case 'email':\n case 'month':\n case 'search':\n case 'tel':\n case 'time':\n case 'url':\n case 'week': {\n return `input-${this.type}`\n }\n default: {\n return undefined\n }\n }\n }\n\n get #computedSize(): Size {\n switch (this.size) {\n case 'standard':\n case 'small':\n case 'large': {\n return this.size\n }\n default: {\n return 'standard'\n }\n }\n }\n\n get #computedValue(): Parameters<ElementInternals['setFormValue']>[0] {\n if (typeof this.value === 'number') return this.value.toString()\n // eslint-disable-next-line unicorn/no-null\n return this.value === undefined ? null : this.value\n }\n\n get #hasIcon(): boolean {\n return (\n typeof this.type === 'string' &&\n ['email', 'tel', 'url'].includes(this.type)\n )\n }\n\n get #hasInteractiveIcon(): boolean {\n return (\n typeof this.type === 'string' &&\n ['month', 'time', 'date', 'datetime-local', 'week', 'password'].includes(\n this.type,\n )\n )\n }\n\n get #iconClickHandler(): () => void {\n return this.type === 'password'\n ? this.#togglePasswordVisibility\n : this.showPicker\n }\n\n get #computedType(): InputType {\n return this.type === 'password' && this.isPasswordVisible\n ? 'text'\n : (this.type ?? 'text')\n }\n\n get #computedAriaLabel(): string {\n return this.type === 'password'\n ? this.isPasswordVisible\n ? 'Hide password'\n : 'Show password'\n : (this.type ?? '')\n }\n\n @Listen('click')\n protected onClick(event: MouseEvent): void {\n if (this.#computedDisabled) event.stopImmediatePropagation()\n }\n\n @Listen('keydown')\n protected onKeydown(event: KeyboardEvent): void {\n if (this.#computedDisabled) {\n event.stopImmediatePropagation()\n return\n }\n\n if (event.key === 'Enter' && this.internals.form) {\n this.internals.form.requestSubmit()\n event.preventDefault()\n }\n }\n\n @Watch('disabled')\n protected disabledChanged(): void {\n if (this.#computedDisabled)\n // eslint-disable-next-line unicorn/no-null\n this.internals.setFormValue(null)\n else this.internals.setFormValue(this.#computedValue)\n }\n\n @Watch('selectionDirection')\n protected selectionDirectionChanged(): void {\n invariant(this.#input)\n\n this.#input.selectionDirection = this.selectionDirection\n }\n\n @Watch('selectionEnd')\n protected selectionEndChanged(): void {\n invariant(this.#input)\n\n this.#input.selectionEnd = this.selectionEnd\n }\n\n @Watch('selectionStart')\n protected selectionStartChanged(): void {\n invariant(this.#input)\n\n this.#input.selectionStart = this.selectionStart\n }\n\n @Watch('tabindex')\n protected tabindexChanged(newValue: string): void {\n const parsedValue = Number.parseInt(newValue, 10)\n this.tabIndex =\n parsedValue === 0 || Number.isNaN(parsedValue) ? undefined : parsedValue\n }\n\n @Watch('max')\n @Watch('maxLength')\n @Watch('min')\n @Watch('minLength')\n @Watch('pattern')\n @Watch('required')\n @Watch('step')\n @Watch('type')\n @Watch('value')\n protected validationChanged(): void {\n if (!this.#input) return\n\n if (this.#input.max !== this.max && this.max !== undefined)\n this.#input.max = this.max.toString()\n if (this.maxLength !== undefined) this.#input.maxLength = this.maxLength\n if (this.#input.min !== this.min && this.min !== undefined)\n this.#input.min = this.min.toString()\n if (this.minLength !== undefined) this.#input.minLength = this.minLength\n if (this.pattern !== undefined) this.#input.pattern = this.pattern\n this.#input.required = this.required ?? false\n if (this.#input.step !== this.step && this.step !== undefined)\n this.#input.step = this.step.toString()\n this.#input.type = this.#computedType\n\n // eslint-disable-next-line unicorn/no-null\n if (this.type !== 'file' && this.value != null)\n this.#input.value = this.value.toString()\n\n const { valid } = this.#input.validity\n if (valid)\n this.internals.setValidity(NO_ERROR_FLAGS, undefined, this.#input)\n else\n this.internals.setValidity(\n this.#input.validity,\n this.#input.validationMessage,\n this.#input,\n )\n }\n\n @Watch('value')\n protected valueChanged(): void {\n if (!this.#computedDisabled)\n this.internals.setFormValue(this.#computedValue)\n\n if (\n (this.#computedValue === null || this.#computedValue === '') &&\n this.type === 'file'\n ) {\n this.#clearValue()\n }\n }\n\n public componentWillLoad(): void {\n this.#defineGetter('form', () => this.internals.form)\n this.#defineGetter('willValidate', () => this.internals.willValidate)\n this.#defineGetter('validity', () => this.internals.validity)\n this.#defineGetter(\n 'validationMessage',\n () => this.internals.validationMessage,\n )\n this.#defineGetter('files', this.#getFiles)\n this.#defineGetter('labels', () => this.internals.labels)\n\n this.#inheritedAttributes = inheritAriaAttributes(this.host)\n this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\n }\n\n public componentDidLoad(): void {\n invariant(this.#input)\n\n this.validationChanged()\n this.valueChanged()\n // FIXME: This event is supported by the native `<input>` element but not\n // recognized by Stencil's type definitions, so it needs to be manually\n // bound here.\n this.#input.addEventListener('cancel', this.#onCancel)\n }\n\n public disconnectedCallback(): void {\n if (this.#input) this.#input.removeEventListener('cancel', this.#onCancel)\n }\n\n public render() {\n const hasValue =\n this.value !== null && this.value !== undefined && this.value !== ''\n const isSearchType = this.type === 'search'\n const shouldShowClearButton = isSearchType && hasValue\n const shouldShowSearchIcon = isSearchType && this.noIcon === false\n const shouldHideIcon = !isSearchType && this.noIcon === true\n const shouldRemoveSearchPadding = isSearchType && this.noIcon === true\n\n return (\n <div class=\"qds-container\">\n <input\n accept={this.accept}\n autoCapitalize={this.host.autocapitalize}\n autoComplete={this.autoComplete}\n // eslint-disable-next-line jsx-a11y/no-autofocus\n autoFocus={this.host.autofocus}\n capture={this.capture}\n class={{\n 'qds-search-padding': shouldRemoveSearchPadding,\n 'qds-input': true,\n 'qds-hide': shouldHideIcon,\n 'qds-padding': shouldHideIcon,\n 'qds-password-padding':\n this.type === 'password' ||\n (this.isPasswordVisible && this.type === 'text'),\n }}\n data-size={this.#computedSize}\n disabled={this.disabled}\n enterKeyHint={this.enterkeyhint}\n inputMode={this.inputmode}\n max={this.max}\n maxLength={this.maxLength}\n min={this.min}\n minLength={this.minLength}\n multiple={this.multiple}\n onBlur={this.#onBlur}\n onChange={this.#onChange}\n onFocus={this.#onFocus}\n onInput={this.#onInput}\n placeholder={this.placeholder}\n ref={this.#ref}\n spellcheck={this.host.spellcheck}\n step={this.step}\n tabIndex={this.#computedDisabled ? undefined : this.tabIndex}\n type={this.#computedType}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...this.#inheritedAttributes}\n />\n <div class=\"qds-focus-ring\" />\n {this.#computedIconName && (\n <div\n class={{\n 'qds-icon-container': true,\n 'no-padding': shouldRemoveSearchPadding,\n }}\n >\n {shouldShowClearButton && (\n <qds-button\n class={{\n 'qds-icon': true,\n 'qds-hide': !hasValue,\n }}\n disabled={this.disabled}\n iconLibrary=\"core\"\n iconName=\"clear\"\n iconOnly\n importance=\"subdued\"\n onClick={this.#onClear}\n size=\"small\"\n text=\"clear input\"\n />\n )}\n {this.#hasIcon && (\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon\"\n data-size={this.#computedSize}\n library=\"core\"\n name={this.#computedIconName}\n />\n )}\n {this.#hasInteractiveIcon && (\n <qds-button\n class=\"qds-icon\"\n disabled={this.disabled}\n iconLibrary=\"core\"\n iconName={this.#computedIconName}\n iconOnly\n importance=\"subdued\"\n onClick={this.#iconClickHandler}\n size=\"small\"\n text={this.#computedAriaLabel}\n />\n )}\n {shouldShowSearchIcon ? (\n <qds-icon\n aria-hidden=\"true\"\n class=\"qds-icon\"\n data-size={this.#computedSize}\n library=\"core\"\n name={this.#computedIconName}\n />\n ) : (\n <div />\n )}\n </div>\n )}\n </div>\n )\n }\n\n public checkValidity: ElementInternals['checkValidity'] = () =>\n this.internals.checkValidity()\n\n public reportValidity: ElementInternals['reportValidity'] = () =>\n this.internals.reportValidity()\n\n public setCustomValidity: HTMLInputElement['setCustomValidity'] = (error) => {\n invariant(this.#input)\n\n this.#input.setCustomValidity(error)\n if (error)\n this.internals.setValidity(CUSTOM_ERROR_FLAGS, error, this.#input)\n else this.internals.setValidity(NO_ERROR_FLAGS)\n }\n\n public select: HTMLInputElement['select'] = () => {\n invariant(this.#input)\n\n this.#input.select()\n }\n\n public getSelectionDirection: () => HTMLInputElement['selectionDirection'] =\n () => {\n invariant(this.#input)\n\n return this.#input.selectionDirection\n }\n\n public getSelectionStart: () => HTMLInputElement['selectionStart'] = () => {\n invariant(this.#input)\n\n return this.#input.selectionStart\n }\n\n public getSelectionEnd: () => HTMLInputElement['selectionEnd'] = () => {\n invariant(this.#input)\n\n return this.#input.selectionEnd\n }\n\n public setRangeText = (\n replacement: string,\n start: number,\n end: number,\n selectionMode?: SelectionMode,\n ): void => {\n invariant(this.#input)\n\n this.#input.setRangeText(replacement, start, end, selectionMode)\n\n if (this.value !== this.#input.value) {\n this.value = this.#input.value\n this.inputEmitter.emit()\n this.changeEmitter.emit()\n }\n }\n\n public setSelectionRange: HTMLInputElement['setSelectionRange'] = (\n start,\n end,\n direction,\n ) => {\n invariant(this.#input)\n\n this.#input.setSelectionRange(start, end, direction)\n }\n\n public stepDown: HTMLInputElement['stepDown'] = (n) => {\n invariant(this.#input)\n\n this.#input.stepDown(n)\n }\n\n public stepUp: HTMLInputElement['stepUp'] = (n) => {\n invariant(this.#input)\n\n this.#input.stepUp(n)\n }\n\n public showPicker: HTMLInputElement['showPicker'] = () => {\n invariant(this.#input)\n\n this.#input.showPicker()\n }\n\n readonly #togglePasswordVisibility = (): void => {\n invariant(this.#input)\n this.isPasswordVisible = !this.isPasswordVisible\n\n this.#input.type = this.#computedType\n }\n\n readonly #ref = (input?: HTMLInputElement): void => {\n this.#input = input\n }\n\n readonly #getFiles: () => HTMLInputElement['files'] = () => {\n invariant(this.#input)\n\n return this.#input.files\n }\n\n readonly #onBlur = (event: FocusEvent): void => {\n this.blurEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onCancel = (): void => {\n this.cancelEmitter.emit()\n }\n\n readonly #onChange = (): void => {\n this.changeEmitter.emit()\n }\n\n readonly #onClear = (): void => {\n this.#clearValue()\n this.#onInput(new InputEvent('input', { inputType: 'deleteContent' }))\n }\n\n readonly #onFocus = (event: FocusEvent): void => {\n this.focusEmitter.emit(pickFocusEventAttributes(event))\n }\n\n readonly #onInput = (event: InputEvent): void => {\n invariant(this.#input)\n\n this.value = this.#input.value\n this.inputEmitter.emit(pickInputEventAttributes(event))\n }\n\n #defineGetter(p: PropertyKey, get: () => unknown): void {\n Object.defineProperty(this.host, p, { enumerable: true, get })\n }\n\n #clearValue(): void {\n invariant(this.#input)\n\n this.#input.value = ''\n }\n}\n"],"version":3}
@@ -8,7 +8,7 @@
8
8
  Object.defineProperty(exports, '__esModule', { value: true });
9
9
 
10
10
  const index = require('./index-dbcccf98.js');
11
- const helpers = require('./helpers-10154521.js');
11
+ const helpers = require('./helpers-666c4403.js');
12
12
 
13
13
  const labelCss = ":host([hidden]){display:none!important}:host{display:inline-block}.qds-label{box-sizing:border-box;color:var(--qds-theme-control-text-standard);display:inline-flex;gap:var(--qds-text-icon-gap);width:100%}.qds-label:focus-visible{border-radius:var(--qds-focus-border-radius);outline:var(--qds-focus-border-width) solid var(--qds-theme-focus-border);outline-offset:var(--qds-focus-border-offset)}.qds-text{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.qds-required{color:var(--qds-theme-feedback-field-required);-webkit-user-select:none;user-select:none}[data-size=small]{font:var(--qds-control-small-text)}.qds-inline[data-size=small]{margin-block:var(--qds-control-small-padding-auto-height)}[data-size=standard]{font:var(--qds-control-standard-text)}.qds-inline[data-size=standard]{margin-block:var(--qds-control-standard-padding-auto-height)}[data-size=large]{font:var(--qds-control-large-text)}.qds-inline[data-size=large]{margin-block:var(--qds-control-large-padding-auto-height)}";
14
14
  const QdsLabelStyle0 = labelCss;
@@ -8,7 +8,7 @@
8
8
  Object.defineProperty(exports, '__esModule', { value: true });
9
9
 
10
10
  const index = require('./index-dbcccf98.js');
11
- const helpers = require('./helpers-10154521.js');
11
+ const helpers = require('./helpers-666c4403.js');
12
12
 
13
13
  const listItemCss = ":host([hidden]){display:none!important}:host{display:block}.qds-disabled{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-indented-content,.qds-list-item{align-items:center;box-sizing:border-box;display:flex}.qds-list-action{pointer-events:none}.qds-indented-content{align-self:stretch;flex:1 0}.qds-destination{transform:scaleX(var(--qds-direction-factor,1))}.qds-divider{border-block-end:var(--qds-list-border-width) solid var(--qds-theme-divider-standard)}.qds-icon{color:var(--qds-theme-text-standard)}.qds-texts{display:flex;flex:1 0;flex-direction:column;justify-items:center;padding:0;position:relative}.qds-input{-webkit-appearance:none;appearance:none;background:none;border:none;border-radius:var(--qds-control-border-radius);inset:0;margin:0;outline:none;position:absolute}.qds-title{color:var(--qds-theme-title)}.qds-subtitle{color:var(--qds-theme-subtitle)}.qds-kicker{color:var(--qds-theme-kicker)}.qds-list-item[data-size=small]{gap:var(--qds-list-item-small-gap-internal);padding-inline-start:var(--qds-list-item-small-padding-horizontal)}[data-size=small] .qds-indented-content{gap:var(--qds-list-item-small-gap-internal);min-height:var(--qds-list-item-small-height);padding-block:var(--qds-list-item-small-padding-vertical);padding-inline-end:var(--qds-list-item-small-padding-horizontal)}[data-size=small] .qds-icon{font-size:var(--qds-control-small-icon-size)}[data-size=small] .qds-main-icon{font-size:var(--qds-list-item-small-icon-size)}[data-size=small] .qds-texts{gap:var(--qds-list-item-small-titles-gap)}[data-size=small] .qds-kicker{font:var(--qds-list-item-small-kicker)}[data-size=small] .qds-title{font:var(--qds-list-item-small-title)}[data-size=small] .qds-subtitle{font:var(--qds-list-item-small-subtitle)}.qds-list-item[data-size=standard]{gap:var(--qds-list-item-standard-gap-internal);padding-inline-start:var(--qds-list-item-standard-padding-horizontal)}[data-size=standard] .qds-indented-content{gap:var(--qds-list-item-standard-gap-internal);min-height:var(--qds-list-item-standard-height);padding-block:var(--qds-list-item-standard-padding-vertical);padding-inline-end:var(--qds-list-item-standard-padding-horizontal)}[data-size=standard] .qds-icon{font-size:var(--qds-control-standard-icon-size)}[data-size=standard] .qds-main-icon{font-size:var(--qds-list-item-standard-icon-size)}[data-size=standard] .qds-texts{gap:var(--qds-list-item-standard-titles-gap)}[data-size=standard] .qds-kicker{font:var(--qds-list-item-standard-kicker)}[data-size=standard] .qds-title{font:var(--qds-list-item-standard-title)}[data-size=standard] .qds-subtitle{font:var(--qds-list-item-standard-subtitle)}.qds-list-item[data-size=large]{gap:var(--qds-list-item-large-gap-internal);padding-inline-start:var(--qds-list-item-large-padding-horizontal)}[data-size=large] .qds-indented-content{gap:var(--qds-list-item-large-gap-internal);min-height:var(--qds-list-item-large-height);padding-block:var(--qds-list-item-large-padding-vertical);padding-inline-end:var(--qds-list-item-large-padding-horizontal)}[data-size=large] .qds-icon{font-size:var(--qds-control-large-icon-size)}[data-size=large] .qds-main-icon{font-size:var(--qds-list-item-large-icon-size)}[data-size=large] .qds-texts{gap:var(--qds-list-item-large-titles-gap)}[data-size=large] .qds-kicker{font:var(--qds-list-item-large-kicker)}[data-size=large] .qds-title{font:var(--qds-list-item-large-title)}[data-size=large] .qds-subtitle{font:var(--qds-list-item-large-subtitle)}.qds-list-item:hover{background-color:var(--qds-theme-interactive-background-hover)}.qds-list-item:active{background-color:var(--qds-theme-interactive-background-pressed)}.qds-list-item:has(input:focus-visible){outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset)}.qds-selected.qds-list-item{background-color:var(--qds-theme-interactive-background-selected)}.qds-selected[data-size=small] .qds-title{font:var(--qds-list-item-small-title-emphasized)}.qds-selected[data-size=standard] .qds-title{font:var(--qds-list-item-standard-title-emphasized)}.qds-selected[data-size=large] .qds-title{font:var(--qds-list-item-large-title-emphasized)}:host(:last-of-type) .qds-divider{border-block-end:none}";
14
14
  const QdsListItemStyle0 = listItemCss;
@@ -0,0 +1,136 @@
1
+ /*!
2
+ * SPDX-FileCopyrightText: © 2025 Schneider Electric
3
+ *
4
+ * SPDX-License-Identifier: Apache-2.0
5
+ */
6
+ 'use strict';
7
+
8
+ Object.defineProperty(exports, '__esModule', { value: true });
9
+
10
+ const index = require('./index-dbcccf98.js');
11
+ const helpers = require('./helpers-666c4403.js');
12
+
13
+ const miniButtonCss = ":host{display:block}:host(:focus-visible){border-radius:var(--qds-focus-rounded-border-radius);outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width)}.qds-mini-button{align-items:center;border:none;border-radius:var(--qds-control-rounded-border-radius);color:var(--qds-theme-control-text-standard);display:flex;justify-content:center;min-height:var(--qds-control-mini-button-standard-size);padding:0;width:var(--qds-control-mini-button-standard-size)}.qds-mini-button:hover{background-color:var(--qds-theme-interactive-background-hover)}.qds-mini-button:active{background-color:var(--qds-theme-interactive-background-pressed)}.qds-mini-button:focus-visible{outline:none}.qds-mini-button:disabled{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-icon{align-content:center;font-size:var(--qds-control-standard-icon-size);line-height:normal}";
14
+ const QdsMiniButtonStyle0 = miniButtonCss;
15
+
16
+ // SPDX-FileCopyrightText: © 2025 Schneider Electric
17
+ //
18
+ // SPDX-License-Identifier: Apache-2.0
19
+ var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
20
+ if (kind === "a" && !f)
21
+ throw new TypeError("Private accessor was defined without a getter");
22
+ if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
23
+ throw new TypeError("Cannot read private member from an object whose class did not declare it");
24
+ return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
25
+ };
26
+ var __classPrivateFieldSet = (undefined && undefined.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
27
+ if (kind === "m")
28
+ throw new TypeError("Private method is not writable");
29
+ if (kind === "a" && !f)
30
+ throw new TypeError("Private accessor was defined without a setter");
31
+ if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
32
+ throw new TypeError("Cannot write private member to an object whose class did not declare it");
33
+ return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
34
+ };
35
+ var _MiniButton_instances, _MiniButton_savedTabIndex, _MiniButton_computedDisabled_get;
36
+ const preventDefault = (event) => {
37
+ event.preventDefault();
38
+ };
39
+ const MiniButton = class {
40
+ constructor(hostRef) {
41
+ index.registerInstance(this, hostRef);
42
+ this.blurEmitter = index.createEvent(this, "qdsBlur", 2);
43
+ this.focusEmitter = index.createEvent(this, "qdsFocus", 2);
44
+ if (hostRef.$hostElement$["s-ei"]) {
45
+ this.internals = hostRef.$hostElement$["s-ei"];
46
+ }
47
+ else {
48
+ this.internals = hostRef.$hostElement$.attachInternals();
49
+ hostRef.$hostElement$["s-ei"] = this.internals;
50
+ }
51
+ _MiniButton_instances.add(this);
52
+ /**
53
+ * The name of a registered icon library.
54
+ */
55
+ this.library = 'default';
56
+ /**
57
+ * When href is define and the button act as a link (`<a>`), the `rel` will be added to the element.
58
+ *
59
+ * @webnative
60
+ */
61
+ this.rel = 'noopener';
62
+ _MiniButton_savedTabIndex.set(this, 0);
63
+ }
64
+ disabledChanged() {
65
+ this.internals.ariaDisabled = __classPrivateFieldGet(this, _MiniButton_instances, "a", _MiniButton_computedDisabled_get).toString();
66
+ if (__classPrivateFieldGet(this, _MiniButton_instances, "a", _MiniButton_computedDisabled_get))
67
+ this.host.removeAttribute('tabindex');
68
+ else
69
+ this.host.tabIndex = __classPrivateFieldGet(this, _MiniButton_savedTabIndex, "f");
70
+ }
71
+ hrefChanged() {
72
+ this.internals.role = this.href === undefined ? 'button' : 'link';
73
+ }
74
+ tabindexChanged(newValue) {
75
+ if (newValue !== null) {
76
+ const parsedValue = Number.parseInt(newValue, 10);
77
+ __classPrivateFieldSet(this, _MiniButton_savedTabIndex, Number.isNaN(parsedValue) || !Number.isFinite(parsedValue)
78
+ ? 0
79
+ : parsedValue, "f");
80
+ }
81
+ if (__classPrivateFieldGet(this, _MiniButton_instances, "a", _MiniButton_computedDisabled_get))
82
+ this.host.removeAttribute('tabindex');
83
+ else
84
+ this.host.tabIndex = __classPrivateFieldGet(this, _MiniButton_savedTabIndex, "f");
85
+ }
86
+ textChanged() {
87
+ this.internals.ariaLabel = this.text;
88
+ }
89
+ onClick(event) {
90
+ if (__classPrivateFieldGet(this, _MiniButton_instances, "a", _MiniButton_computedDisabled_get)) {
91
+ event.stopImmediatePropagation();
92
+ }
93
+ }
94
+ onBlur(event) {
95
+ this.blurEmitter.emit(helpers.pickFocusEventAttributes(event));
96
+ }
97
+ onFocus(event) {
98
+ this.focusEmitter.emit(helpers.pickFocusEventAttributes(event));
99
+ }
100
+ onKeydown(event) {
101
+ if (event.key === 'Enter')
102
+ this.host.click();
103
+ }
104
+ onKeyup(event) {
105
+ if (event.key === ' ')
106
+ this.host.click();
107
+ }
108
+ componentWillLoad() {
109
+ this.hrefChanged();
110
+ this.textChanged();
111
+ this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0');
112
+ this.disabledChanged();
113
+ }
114
+ render() {
115
+ const Tag = this.href === undefined ? 'button' : 'a';
116
+ return (index.h(Tag, { key: 'a82d713053ab10096f20cc9305acdcff07c4d09a', type: Tag === 'a' ? undefined : 'button', class: "qds-mini-button", href: Tag === 'a' ? this.href : undefined, rel: Tag === 'a' ? this.rel : undefined, disabled: __classPrivateFieldGet(this, _MiniButton_instances, "a", _MiniButton_computedDisabled_get), "aria-hidden": "true", onKeyDown: preventDefault, onKeyUp: preventDefault, onKeyPress: preventDefault, tabIndex: -1 }, index.h("qds-icon", { key: 'c695e0af10a6eb172c8735193c470b9bbbeea8e7', class: "qds-icon", library: this.library, name: this.name })));
117
+ }
118
+ static get formAssociated() { return true; }
119
+ get host() { return index.getElement(this); }
120
+ static get watchers() { return {
121
+ "disabled": ["disabledChanged"],
122
+ "href": ["hrefChanged"],
123
+ "tabindex": ["tabindexChanged"],
124
+ "text": ["textChanged"]
125
+ }; }
126
+ };
127
+ _MiniButton_savedTabIndex = new WeakMap(), _MiniButton_instances = new WeakSet(), _MiniButton_computedDisabled_get = function _MiniButton_computedDisabled_get() {
128
+ return (this.host.matches(':disabled') ||
129
+ (this.host.hasAttribute('disabled') &&
130
+ this.host.getAttribute('disabled') !== 'false'));
131
+ };
132
+ MiniButton.style = QdsMiniButtonStyle0;
133
+
134
+ exports.qds_mini_button = MiniButton;
135
+
136
+ //# sourceMappingURL=qds-mini-button.cjs.entry.js.map
@@ -0,0 +1 @@
1
+ {"file":"qds-mini-button.entry.cjs.js","mappings":"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","names":["pickFocusEventAttributes","h"],"sources":["src/components/mini-button/mini-button.css?tag=qds-mini-button&encapsulation=shadow","src/components/mini-button/mini-button.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2025 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n:host {\n display: block;\n}\n\n:host(:focus-visible) {\n outline: var(--qds-theme-focus-border) solid var(--qds-focus-border-width);\n border-radius: var(--qds-focus-rounded-border-radius);\n}\n\n.qds-mini-button {\n display: flex;\n width: var(--qds-control-mini-button-standard-size);\n min-height: var(--qds-control-mini-button-standard-size);\n align-items: center;\n border-radius: var(--qds-control-rounded-border-radius);\n border: none;\n justify-content: center;\n color: var(--qds-theme-control-text-standard);\n padding: 0;\n\n &:hover {\n background-color: var(--qds-theme-interactive-background-hover);\n }\n\n &:active {\n background-color: var(--qds-theme-interactive-background-pressed);\n }\n\n &:focus-visible {\n outline: none;\n }\n}\n\n.qds-mini-button:disabled {\n opacity: var(--qds-theme-disabled);\n pointer-events: none;\n}\n\n.qds-icon {\n font-size: var(--qds-control-standard-icon-size);\n align-content: center;\n line-height: normal;\n}\n","// SPDX-FileCopyrightText: © 2025 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport {\n AttachInternals,\n Component,\n Element,\n Event,\n h,\n Listen,\n Prop,\n Watch,\n} from '@stencil/core'\nimport type { LiteralUnion } from 'type-fest'\n\nimport type { QdsFocusEventDetail } from '../../helpers'\nimport { pickFocusEventAttributes } from '../../helpers'\nimport type { ButtonTarget } from '../button/button'\n\nconst preventDefault = (event: KeyboardEvent | MouseEvent): void => {\n event.preventDefault()\n}\n\n/**\n * @experimental\n */\n@Component({\n tag: 'qds-mini-button',\n formAssociated: true,\n styleUrl: 'mini-button.css',\n shadow: true,\n})\nexport class MiniButton implements ComponentInterface {\n /**\n * Prevents the mini button from being interacted with: it cannot be pressed or\n * focused.\n *\n * @webnative\n */\n @Prop()\n public readonly disabled?: boolean\n\n /**\n * The name of the icon to render.\n *\n * Available names depend on the icon library being used.\n */\n @Prop() public readonly name!: string\n\n /**\n * The name of a registered icon library.\n */\n @Prop() public readonly library: string = 'default'\n\n /**\n * Where to display the linked URL, as the name for a browsing context (a\n * tab, window, or\n * [`<iframe>`](https://developer.mozilla.org/docs/Web/HTML/Element/iframe).\n * The following keywords have special meanings for where to load the URL:\n *\n * - `_blank`: usually a new tab, but users can configure browsers to open a new\n * window instead.\n * - `_parent`: the parent browsing context of the current one. If no parent,\n * behaves as `_self`.\n * - `_self`: the current browsing context.\n * - `_top`: the topmost browsing context (the \"highest\" context that's an\n * ancestor of the current one). If no ancestors, behaves as `_self`.\n *\n * @webnative\n */\n @Prop() public readonly target?: LiteralUnion<ButtonTarget, string>\n\n /**\n * When set, the underlying button will be rendered as an `<a>` with this\n * `href` instead of a `<button>`.\n *\n * @webnative\n */\n @Prop() public readonly href?: string\n\n /**\n * When href is define and the button act as a link (`<a>`), the `rel` will be added to the element.\n *\n * @webnative\n */\n @Prop() public readonly rel?: string = 'noopener'\n\n /**\n * The mini button's accessible name.\n */\n @Prop() public readonly text!: string\n\n /**\n * Emitted when the button loses focus.\n */\n @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n /**\n * Emitted when the button gains focus.\n */\n @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n @Element() private readonly host!: HTMLElement\n\n @AttachInternals() private readonly internals!: ElementInternals\n\n #savedTabIndex = 0\n\n get #computedDisabled(): boolean {\n return (\n this.host.matches(':disabled') ||\n (this.host.hasAttribute('disabled') &&\n this.host.getAttribute('disabled') !== 'false')\n )\n }\n\n @Watch('disabled')\n protected disabledChanged(): void {\n this.internals.ariaDisabled = this.#computedDisabled.toString()\n if (this.#computedDisabled) this.host.removeAttribute('tabindex')\n else this.host.tabIndex = this.#savedTabIndex\n }\n\n @Watch('href')\n protected hrefChanged(): void {\n this.internals.role = this.href === undefined ? 'button' : 'link'\n }\n\n @Watch('tabindex')\n protected tabindexChanged(newValue: string | null): void {\n if (newValue !== null) {\n const parsedValue = Number.parseInt(newValue, 10)\n this.#savedTabIndex =\n Number.isNaN(parsedValue) || !Number.isFinite(parsedValue)\n ? 0\n : parsedValue\n }\n if (this.#computedDisabled) this.host.removeAttribute('tabindex')\n else this.host.tabIndex = this.#savedTabIndex\n }\n\n @Watch('text')\n protected textChanged(): void {\n this.internals.ariaLabel = this.text\n }\n\n @Listen('click')\n protected onClick(event: MouseEvent): void {\n if (this.#computedDisabled) {\n event.stopImmediatePropagation()\n }\n }\n\n @Listen('blur')\n protected onBlur(event: FocusEvent): void {\n this.blurEmitter.emit(pickFocusEventAttributes(event))\n }\n\n @Listen('focus')\n protected onFocus(event: FocusEvent): void {\n this.focusEmitter.emit(pickFocusEventAttributes(event))\n }\n\n @Listen('keydown')\n protected onKeydown(event: KeyboardEvent): void {\n if (event.key === 'Enter') this.host.click()\n }\n\n @Listen('keyup')\n protected onKeyup(event: KeyboardEvent): void {\n if (event.key === ' ') this.host.click()\n }\n\n public componentWillLoad(): void {\n this.hrefChanged()\n this.textChanged()\n this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\n this.disabledChanged()\n }\n\n public render() {\n const Tag = this.href === undefined ? 'button' : 'a'\n\n return (\n <Tag\n type={Tag === 'a' ? undefined : 'button'}\n class=\"qds-mini-button\"\n href={Tag === 'a' ? this.href : undefined}\n rel={Tag === 'a' ? this.rel : undefined}\n disabled={this.#computedDisabled}\n aria-hidden=\"true\"\n onKeyDown={preventDefault}\n onKeyUp={preventDefault}\n onKeyPress={preventDefault}\n tabIndex={-1}\n >\n <qds-icon class=\"qds-icon\" library={this.library} name={this.name} />\n </Tag>\n )\n }\n}\n"],"version":3}
@@ -8,7 +8,7 @@
8
8
  Object.defineProperty(exports, '__esModule', { value: true });
9
9
 
10
10
  const index = require('./index-dbcccf98.js');
11
- const helpers = require('./helpers-10154521.js');
11
+ const helpers = require('./helpers-666c4403.js');
12
12
 
13
13
  const navListItemCss = ":host([hidden]){display:none!important}:host{display:block}.qds-button,.qds-nav-list-item,.qds-texts{display:flex}.qds-button,.qds-texts{flex:1 0}.qds-icon,.qds-text{color:var(--qds-theme-title)}.qds-button{align-items:center;-webkit-appearance:none;appearance:none;background:none;border:none;cursor:pointer;text-align:initial}.qds-button:focus-visible{border-radius:var(--qds-focus-border-radius);outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width)}.qds-button:not(.qds-selected):hover{background-color:var(--qds-theme-interactive-background-hover)}.qds-button:not(.qds-selected):active{background-color:var(--qds-theme-interactive-background-pressed)}.qds-disabled{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-subtext{color:var(--qds-theme-subtitle)}.qds-texts{flex-direction:column}.qds-button[data-size=small]{gap:var(--qds-list-item-small-gap-internal);min-height:var(--qds-list-item-small-height);padding-block:var(--qds-list-item-small-padding-vertical);padding-inline:var(--qds-list-item-small-padding-horizontal)}[data-size=small]>.qds-icon{font-size:var(--qds-list-item-small-icon-size)}[data-size=small]>.qds-texts{gap:var(--qds-list-item-small-titles-gap)}[data-size=small] .qds-text{font:var(--qds-list-item-small-title)}[data-size=small] .qds-subtext{font:var(--qds-list-item-small-subtitle)}.qds-button[data-size=standard]{gap:var(--qds-list-item-standard-gap-internal);min-height:var(--qds-list-item-standard-height);padding-block:var(--qds-list-item-standard-padding-vertical);padding-inline:var(--qds-list-item-standard-padding-horizontal)}[data-size=standard]>.qds-icon{font-size:var(--qds-list-item-standard-icon-size)}[data-size=standard]>.qds-texts{gap:var(--qds-list-item-standard-titles-gap)}[data-size=standard] .qds-text{font:var(--qds-list-item-standard-title)}[data-size=standard] .qds-subtext{font:var(--qds-list-item-standard-subtitle)}.qds-button[data-size=large]{gap:var(--qds-list-item-large-gap-internal);min-height:var(--qds-list-item-large-height);padding-block:var(--qds-list-item-large-padding-vertical);padding-inline:var(--qds-list-item-large-padding-horizontal)}[data-size=large]>.qds-icon{font-size:var(--qds-list-item-large-icon-size)}[data-size=large]>.qds-texts{gap:var(--qds-list-item-large-titles-gap)}[data-size=large] .qds-text{font:var(--qds-list-item-large-title)}[data-size=large] .qds-subtext{font:var(--qds-list-item-large-subtitle)}.qds-selected.qds-nav-list-item{background-color:var(\n --qds-theme-navigation-subsection-standard-background\n )}.qds-selected.qds-nav-list-item:after{background-color:var(--qds-theme-signature-color-default);border-radius:var(--qds-signature-line-connection-cap-radius);content:\"\";cursor:pointer;margin-right:calc(var(--qds-signature-line-connection-width)*-1/2);width:var(--qds-signature-line-connection-width)}.qds-selected .qds-icon{color:var(--qds-theme-signature-color-default)}.qds-selected[data-size=small] .qds-text{font:var(--qds-list-item-small-title-emphasized)}.qds-selected[data-size=standard] .qds-text{font:var(--qds-list-item-standard-title-emphasized)}.qds-selected[data-size=large] .qds-text{font:var(--qds-list-item-large-title-emphasized)}";
14
14
  const QdsNavListItemStyle0 = navListItemCss;
@@ -85,14 +85,14 @@ const NavListItem = class {
85
85
  this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0');
86
86
  }
87
87
  render() {
88
- return (index.h(index.Host, { key: '99a81e745bc4599a97dfa7aec01d71293cee182b' }, index.h("li", { key: '59890b7f870e94b97658f5135d89884e40b5afb0', class: {
88
+ return (index.h(index.Host, { key: '88eaa31989bd2b28a7256c8820f857568736d6b8' }, index.h("li", { key: '0250edce147e1885b89e4258063807cc6c54cfbb', class: {
89
89
  'qds-nav-list-item': true,
90
90
  'qds-disabled': this.disabled,
91
91
  'qds-selected': this.selected,
92
- }, ref: __classPrivateFieldGet(this, _NavListItem_liRef, "f"), ...this.inheritedAttributes }, index.h("button", { key: '8b694264eb209f81a3a3f4e2cc1367417e04159d', class: {
92
+ }, ref: __classPrivateFieldGet(this, _NavListItem_liRef, "f"), ...this.inheritedAttributes }, index.h("button", { key: '57e3719f754e9ef68ea8797094be6db169a966a7', class: {
93
93
  'qds-button': true,
94
94
  'qds-selected': this.selected,
95
- }, "data-size": __classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_computedSize_get), disabled: this.disabled, onBlur: __classPrivateFieldGet(this, _NavListItem_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _NavListItem_onFocus, "f"), tabIndex: this.disabled ? undefined : this.tabIndex, type: "button" }, this.iconName !== undefined && this.iconName !== '' && (index.h("qds-icon", { key: 'c34196a1277950cc1720f40ff738fb917594d65f', "aria-hidden": "true", class: "qds-icon", library: this.iconLibrary, name: this.iconName })), !__classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_shouldCollapse_get) && this.text && this.renderText())), __classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_shouldCollapse_get) && this.text && (index.h("qds-tooltip", { key: '7ba42ecc5e21236376c5e31bdb8b7ae0a6274e4c', placement: "right", ref: __classPrivateFieldGet(this, _NavListItem_tooltipRef, "f") }, this.renderText()))));
95
+ }, "data-size": __classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_computedSize_get), disabled: this.disabled, onBlur: __classPrivateFieldGet(this, _NavListItem_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _NavListItem_onFocus, "f"), tabIndex: this.disabled ? undefined : this.tabIndex, type: "button" }, this.iconName !== undefined && this.iconName !== '' && (index.h("qds-icon", { key: 'f5b3ad3e5a57dc0c892a00b85d306513c474f6c3', "aria-hidden": "true", class: "qds-icon", library: this.iconLibrary, name: this.iconName })), !__classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_shouldCollapse_get) && this.text && this.renderText())), __classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_shouldCollapse_get) && this.text && (index.h("qds-tooltip", { key: '94043aa8869d4a1c99f4805d141b07059630d0e9', placement: "right", ref: __classPrivateFieldGet(this, _NavListItem_tooltipRef, "f") }, this.renderText()))));
96
96
  }
97
97
  renderText() {
98
98
  return (index.h("div", { class: "qds-texts" }, index.h("div", { class: "qds-text" }, this.text), this.subtext !== undefined && this.subtext !== '' && (index.h("div", { class: "qds-subtext" }, this.subtext))));
@@ -95,7 +95,7 @@ const ProgressBar = class {
95
95
  this.valueChanged();
96
96
  }
97
97
  render() {
98
- return (index.h("div", { key: 'f6f710fc3a8cbd3da6015fcc6baa3469d4b271cf', "aria-hidden": "true", class: "qds-track", "data-size": __classPrivateFieldGet(this, _ProgressBar_instances, "a", _ProgressBar_computedSize_get) }, index.h("div", { key: '8d9bee80586cbdc5682e3a45dbc9d91a03549e81', class: {
98
+ return (index.h("div", { key: '9db8d359460393ab8b7dadfa916f7ef168dd2ace', "aria-hidden": "true", class: "qds-track", "data-size": __classPrivateFieldGet(this, _ProgressBar_instances, "a", _ProgressBar_computedSize_get) }, index.h("div", { key: '69c5a453374524390a1da8649f09f769800c4c79', class: {
99
99
  'qds-bar': true,
100
100
  'qds-indeterminate': __classPrivateFieldGet(this, _ProgressBar_position, "f") === -1,
101
101
  }, "data-size": __classPrivateFieldGet(this, _ProgressBar_instances, "a", _ProgressBar_computedSize_get), style: { width: this.width } })));
@@ -8,7 +8,7 @@
8
8
  Object.defineProperty(exports, '__esModule', { value: true });
9
9
 
10
10
  const index = require('./index-dbcccf98.js');
11
- const helpers = require('./helpers-10154521.js');
11
+ const helpers = require('./helpers-666c4403.js');
12
12
 
13
13
  const radioCss = "[hidden].sc-qds-radio-h{display:none!important}.sc-qds-radio-h{display:inline-block;line-height:0}.qds-box.sc-qds-radio,.qds-icon.sc-qds-radio,.qds-radio.sc-qds-radio{grid-area:g;place-self:center}.qds-box.sc-qds-radio,.qds-icon.sc-qds-radio{display:none;pointer-events:none}.qds-box.sc-qds-radio{border-radius:var(--qds-control-rounded-border-radius)}.qds-container.sc-qds-radio{align-self:flex-start;display:grid;grid-template-areas:\"g\"}.qds-icon.sc-qds-radio{color:var(--qds-theme-signature-color-contrast)}.qds-label.sc-qds-radio{cursor:pointer;display:inline-flex;width:inherit}.qds-label-inner.sc-qds-radio{flex:1 1 auto;min-width:0}.qds-radio.sc-qds-radio{-webkit-appearance:none;appearance:none;background-color:var(--qds-theme-control-input-background);border:var(--qds-control-border-width) solid var(--qds-theme-control-border);border-radius:var(--qds-control-rounded-border-radius);cursor:pointer;margin:0;-webkit-print-color-adjust:exact;print-color-adjust:exact}.qds-radio.sc-qds-radio:focus-visible{outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset)}.qds-radio.sc-qds-radio:active~.qds-box.sc-qds-radio,.qds-radio.sc-qds-radio:hover~.qds-box.sc-qds-radio{display:block}.qds-radio.sc-qds-radio:hover~.qds-box.sc-qds-radio{background-color:var(--qds-theme-signature-color-hover)}.qds-radio.sc-qds-radio:active~.qds-box.sc-qds-radio{background-color:var(--qds-theme-signature-color-pressed)}.qds-radio.sc-qds-radio:checked{background-color:var(--qds-theme-signature-color-default);border-color:#0000}.qds-radio.sc-qds-radio:checked~.qds-icon.sc-qds-radio{display:block}.qds-radio.sc-qds-radio:checked:hover{background-color:var(--qds-theme-signature-color-hover)}.qds-radio.sc-qds-radio:checked:active{background-color:var(--qds-theme-signature-color-pressed)}[aria-disabled=true].sc-qds-radio{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-radio[data-size=small].sc-qds-radio{height:var(--qds-control-toggle-box-small-size);width:var(--qds-control-toggle-box-small-size)}.qds-icon[data-size=small].sc-qds-radio{font-size:var(--qds-control-small-icon-size)}.qds-box[data-size=small].sc-qds-radio{height:var(--qds-control-toggle-indicator-small-size);width:var(--qds-control-toggle-indicator-small-size)}.qds-inline[data-size=small].sc-qds-radio{margin-block:var(--qds-control-small-padding-auto-height)}.qds-label[data-size=small].sc-qds-radio{gap:var(--qds-control-small-gap-siblings-related)}.qds-radio[data-size=standard].sc-qds-radio{height:var(--qds-control-toggle-box-standard-size);width:var(--qds-control-toggle-box-standard-size)}.qds-icon[data-size=standard].sc-qds-radio{font-size:var(--qds-control-standard-icon-size)}.qds-box[data-size=standard].sc-qds-radio{height:var(--qds-control-toggle-indicator-standard-size);width:var(--qds-control-toggle-indicator-standard-size)}.qds-inline[data-size=standard].sc-qds-radio{margin-block:var(--qds-control-standard-padding-auto-height)}.qds-label[data-size=standard].sc-qds-radio{gap:var(--qds-control-standard-gap-siblings-related)}.qds-radio[data-size=large].sc-qds-radio{height:var(--qds-control-toggle-box-large-size);width:var(--qds-control-toggle-box-large-size)}.qds-icon[data-size=large].sc-qds-radio{font-size:var(--qds-control-large-icon-size)}.qds-box[data-size=large].sc-qds-radio{height:var(--qds-control-toggle-indicator-large-size);width:var(--qds-control-toggle-indicator-large-size)}.qds-inline[data-size=large].sc-qds-radio{margin-block:var(--qds-control-large-padding-auto-height)}.qds-label[data-size=large].sc-qds-radio{gap:var(--qds-control-large-gap-siblings-related)}";
14
14
  const QdsRadioStyle0 = radioCss;
@@ -86,10 +86,10 @@ const Radio = class {
86
86
  render() {
87
87
  return (
88
88
  // eslint-disable-next-line jsx-a11y/label-has-associated-control
89
- index.h("label", { key: '84c6d523bbede422745081dc2fd4600645e0a35c', "aria-disabled": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedDisabled_get) ? 'true' : undefined, class: {
89
+ index.h("label", { key: '23ace2714389b46c3add4b490c8ac6f55280225c', "aria-disabled": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedDisabled_get) ? 'true' : undefined, class: {
90
90
  'qds-inline': this.inline,
91
91
  'qds-label': true,
92
- }, "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get) }, index.h("div", { key: '631b31c5c10b8876a1f69bd0e483c16db8e55b46', class: "qds-container" }, index.h("input", { key: 'b9dd48afbb2bd6fbadbd4316490f6227b20644c4', checked: this.checked, class: "qds-radio", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), disabled: this.disabled, form: this.form, name: this.name, onBlur: __classPrivateFieldGet(this, _Radio_onBlur, "f"), onChange: __classPrivateFieldGet(this, _Radio_onChange, "f"), onFocus: __classPrivateFieldGet(this, _Radio_onFocus, "f"), ref: __classPrivateFieldGet(this, _Radio_ref, "f"), required: this.required, tabIndex: __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedDisabled_get) ? undefined : this.tabIndex, type: "radio", value: this.value ?? undefined, ...__classPrivateFieldGet(this, _Radio_inheritedAttributes, "f") }), index.h("div", { key: 'c18595ddf8c3500215b878a998cf57bf8c57bb4c', class: "qds-box", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get) }), index.h("qds-icon", { key: 'f6c59a38ec683a0bbfa3f2059ed160dbaebc4560', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), library: "core", name: "checked" })), __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_hasText_get) && (index.h("qds-label", { key: '523698a797362538234838dd3c8c86dba593ff40', class: "qds-label-inner", size: __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), text: this.text }))));
92
+ }, "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get) }, index.h("div", { key: 'bce520672b4a0c298fb9ca3997ff2fe461ae08cc', class: "qds-container" }, index.h("input", { key: 'c8a220f45b5f525ebbbd7c305dc66feea19edb98', checked: this.checked, class: "qds-radio", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), disabled: this.disabled, form: this.form, name: this.name, onBlur: __classPrivateFieldGet(this, _Radio_onBlur, "f"), onChange: __classPrivateFieldGet(this, _Radio_onChange, "f"), onFocus: __classPrivateFieldGet(this, _Radio_onFocus, "f"), ref: __classPrivateFieldGet(this, _Radio_ref, "f"), required: this.required, tabIndex: __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedDisabled_get) ? undefined : this.tabIndex, type: "radio", value: this.value ?? undefined, ...__classPrivateFieldGet(this, _Radio_inheritedAttributes, "f") }), index.h("div", { key: '94a43d8c542c88bfacf34f58f2fae3afa6dda7d7', class: "qds-box", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get) }), index.h("qds-icon", { key: '2f0d140af1b891448c4f233068cd3c286c20fbf5', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), library: "core", name: "checked" })), __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_hasText_get) && (index.h("qds-label", { key: '77fd0b965803598675ea5d65c7e8eedfc935f51e', class: "qds-label-inner", size: __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), text: this.text }))));
93
93
  }
94
94
  get host() { return index.getElement(this); }
95
95
  static get watchers() { return {
@@ -8,7 +8,7 @@
8
8
  Object.defineProperty(exports, '__esModule', { value: true });
9
9
 
10
10
  const index = require('./index-dbcccf98.js');
11
- const helpers = require('./helpers-10154521.js');
11
+ const helpers = require('./helpers-666c4403.js');
12
12
  const controls = require('./controls-ee3d2ec8.js');
13
13
 
14
14
  const selectCss = ":host([hidden]){display:none!important}:host{display:inline-block}slot{display:none}.qds-container{box-sizing:border-box;display:grid;grid-template-areas:\"i\"}.qds-container,.qds-select{width:inherit}.qds-icon,.qds-select{color:var(--qds-theme-control-text-standard);grid-area:i}.qds-icon{margin-inline-end:calc(var(--qds-control-input-padding-horizontal) + var(--qds-control-border-width));place-self:center end;pointer-events:none}.qds-select{-webkit-appearance:none;appearance:none;background-color:var(--qds-theme-control-input-background);border-color:var(--qds-theme-control-border);border-radius:var(\n --qds-control-border-radius-top-left,var(--qds-control-border-radius)\n ) var(--qds-control-border-radius-top-right,var(--qds-control-border-radius)) var(\n --qds-control-border-radius-bottom-right,var(--qds-control-border-radius)\n ) var(\n --qds-control-border-radius-bottom-left,var(--qds-control-border-radius)\n );border-style:solid;border-width:var(--qds-control-border-width) var(--qds-control-border-width-inline-end,var(--qds-control-border-width)) var(--qds-control-border-width-block-end,var(--qds-control-border-width)) var(--qds-control-border-width);margin:0;outline:0;padding-block:0;padding-inline:var(--qds-control-input-padding-horizontal);text-overflow:ellipsis}.qds-select:not(:focus):user-invalid{border-color:var(--qds-theme-feedback-result-failure)}.qds-select:disabled,.qds-select:disabled+.qds-icon{opacity:var(--qds-theme-disabled)}:is(::slotted(optgroup),::slotted(optgroup:not(:disabled)>option),::slotted(option)):disabled{opacity:var(--qds-theme-disabled)}::slotted(optgroup){font:var(--qds-accessory-section-title)}::slotted(optgroup>option),::slotted(option){font:var(--qds-list-item-label-main)}.qds-select[data-size=small]{font:var(--qds-control-small-text)}.qds-select[data-size=small]:not([multiple]){height:var(--qds-control-small-height);padding-inline-end:calc(var(--qds-control-small-icon-size) + var(--qds-text-icon-gap) + var(--qds-control-input-padding-horizontal))}.qds-icon[data-size=small]{height:var(--qds-control-small-icon-size);width:var(--qds-control-small-icon-size)}.qds-select[data-size=standard]{font:var(--qds-control-standard-text)}.qds-select[data-size=standard]:not([multiple]){height:var(--qds-control-standard-height);padding-inline-end:calc(var(--qds-control-standard-icon-size) + var(--qds-text-icon-gap) + var(--qds-control-input-padding-horizontal))}.qds-icon[data-size=standard]{height:var(--qds-control-standard-icon-size);width:var(--qds-control-standard-icon-size)}.qds-select[data-size=large]{font:var(--qds-control-large-text)}.qds-select[data-size=large]:not([multiple]){height:var(--qds-control-large-height);padding-inline-end:calc(var(--qds-control-large-icon-size) + var(--qds-text-icon-gap) + var(--qds-control-input-padding-horizontal))}.qds-icon[data-size=large]{height:var(--qds-control-large-icon-size);width:var(--qds-control-large-icon-size)}.qds-focus-ring{border-radius:max(1px,var(\n --qds-control-border-radius-top-left,var(--qds-control-border-radius)\n )) max(1px,var(\n --qds-control-border-radius-top-right,var(--qds-control-border-radius)\n )) max(1px,var(\n --qds-control-border-radius-bottom-right,var(--qds-control-border-radius)\n )) max(1px,var(\n --qds-control-border-radius-bottom-left,var(--qds-control-border-radius)\n ));grid-area:i;height:calc(100% + var(--qds-control-border-width) - var(--qds-control-border-width-block-end, var(--qds-control-border-width)));isolation:isolate;outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset);pointer-events:none;visibility:hidden;width:calc(100% + var(--qds-control-border-width) - var(\n --qds-control-border-width-inline-end,\n var(--qds-control-border-width)\n ))}.qds-select:focus-visible~.qds-focus-ring{visibility:visible}";