@veeqo/ui 15.15.3 → 15.16.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -118,8 +118,7 @@ src/icons/
118
118
  2. Run the following commands to update the icon library:
119
119
 
120
120
  ```terminal
121
- npm run figma:export # Export SVGs from Figma
122
- npm run build:icons # Convert SVGs to React components
121
+ npm run figma:export-icons # Export icon SVGs from Figma & build React components
123
122
  ```
124
123
 
125
124
  These scripts:
@@ -147,7 +146,7 @@ For more detailed information about the icon system, see our [Icon System Figma
147
146
 
148
147
  ### Adding additional SVG icon sets
149
148
 
150
- The build script supports multiple icon sets through the `ICON_SETS` configuration object. To add a new icon set:
149
+ Each icon set has its own build script that calls the shared `buildSvgSet` pipeline. To add a new set:
151
150
 
152
151
  #### Create a new directory structure for your icons
153
152
 
@@ -158,33 +157,42 @@ src/icons/
158
157
  └── imports/ # Raw SVGs
159
158
  ```
160
159
 
161
- #### Add your configuration to ICON_SETS in the build script
162
-
163
- ```typescript
164
- const ICON_SETS = {
165
- // Existing configurations...
166
- yourIconSet: {
167
- import: './src/icons/your-icon-set/imports', // Directory containing source SVG files
168
- output: './src/icons/your-icon-set/components', // Directory where React components will be generated
169
- svgrConfig: {
170
- plugins: ['@svgr/plugin-jsx', '@svgr/plugin-prettier'],
171
- typescript: true,
172
- exportType: 'named',
173
- ref: false,
174
- prettierConfig: './.prettierrc',
175
- // Additional SVGR configurations as needed:
176
- replaceAttrValues: {
177
- '#000000': 'currentColor', // Replace specific colors
178
- }, // SVGR transformation options, for full list of options see: https://react-svgr.com/docs/options/
179
- icon: 24, // Set default icon size
180
- },
160
+ #### Create a build script
161
+
162
+ Create `scripts/build-your-icons.js` that imports `buildSvgSet` from the shared module:
163
+
164
+ ```js
165
+ import { buildSvgSet } from './shared/build-svg-set.js';
166
+
167
+ buildSvgSet({
168
+ importDir: './src/icons/your-icon-set/imports',
169
+ outputDir: './src/icons/your-icon-set/components',
170
+ indexPath: './src/icons/your-icon-set/components/index.ts',
171
+ importPrefix: './',
172
+ buildMode: 'parallel',
173
+ label: 'icons',
174
+ logNoun: 'icon',
175
+ lintGlob: './src/icons/your-icon-set/**/*.tsx',
176
+ svgrConfig: {
177
+ plugins: ['@svgr/plugin-jsx', '@svgr/plugin-prettier'],
178
+ typescript: true,
179
+ exportType: 'named',
180
+ ref: false,
181
+ prettierConfig: './.prettierrc',
182
+ // Additional SVGR options: https://react-svgr.com/docs/options/
183
+ replaceAttrValues: { '#000000': 'currentColor' },
184
+ icon: 24,
181
185
  },
182
- };
186
+ });
183
187
  ```
184
188
 
185
- This will add it to the build script `npm run build`
189
+ #### Add a package.json script
190
+
191
+ ```json
192
+ "build:your-icons": "node scripts/build-your-icons.js"
193
+ ```
186
194
 
187
- The build script will automatically:
195
+ The `buildSvgSet` pipeline will automatically:
188
196
 
189
197
  - Clean the output directory
190
198
  - Generate React components from SVGs
@@ -198,9 +206,12 @@ The UI library includes automated scripts to export assets from Figma files. For
198
206
  ### Quick Start
199
207
 
200
208
  ```bash
201
- # Export design system icons
209
+ # Export all icons and logos
202
210
  npm run figma:export
203
211
 
204
- # Export integration marks
205
- npm run figma:export-integrations
212
+ # Export icons only
213
+ npm run figma:export-icons
214
+
215
+ # Export logos (formerly "integration marks")
216
+ npm run figma:export-logos
206
217
  ```
@@ -2,8 +2,8 @@
2
2
 
3
3
  var ___$insertStyle = require('../../../_virtual/____insertStyle.cjs');
4
4
 
5
- ___$insertStyle("._heading-xxl_j4l26_1 {\n font-family: var(--text-heading-xxl-font-family);\n font-style: var(--text-heading-xxl-font-style);\n font-weight: var(--text-heading-xxl-font-weight);\n font-size: var(--text-heading-xxl-font-size);\n line-height: var(--text-heading-xxl-line-height);\n color: var(--text-heading-xxl-color);\n text-decoration: var(--text-heading-xxl-text-decoration);\n letter-spacing: var(--text-heading-xxl-letter-spacing);\n}\n\n._heading-xl_j4l26_12 {\n font-family: var(--text-heading-xl-font-family);\n font-style: var(--text-heading-xl-font-style);\n font-weight: var(--text-heading-xl-font-weight);\n font-size: var(--text-heading-xl-font-size);\n line-height: var(--text-heading-xl-line-height);\n color: var(--text-heading-xl-color);\n text-decoration: var(--text-heading-xl-text-decoration);\n letter-spacing: var(--text-heading-xl-letter-spacing);\n}\n\n._heading-large_j4l26_23 {\n font-family: var(--text-heading-large-font-family);\n font-style: var(--text-heading-large-font-style);\n font-weight: var(--text-heading-large-font-weight);\n font-size: var(--text-heading-large-font-size);\n line-height: var(--text-heading-large-line-height);\n color: var(--text-heading-large-color);\n text-decoration: var(--text-heading-large-text-decoration);\n letter-spacing: var(--text-heading-large-letter-spacing);\n}\n\n._heading-medium_j4l26_34 {\n font-family: var(--text-heading-medium-font-family);\n font-style: var(--text-heading-medium-font-style);\n font-weight: var(--text-heading-medium-font-weight);\n font-size: var(--text-heading-medium-font-size);\n line-height: var(--text-heading-medium-line-height);\n color: var(--text-heading-medium-color);\n text-decoration: var(--text-heading-medium-text-decoration);\n letter-spacing: var(--text-heading-medium-letter-spacing);\n}\n\n._heading-small_j4l26_45 {\n font-family: var(--text-heading-small-font-family);\n font-style: var(--text-heading-small-font-style);\n font-weight: var(--text-heading-small-font-weight);\n font-size: var(--text-heading-small-font-size);\n line-height: var(--text-heading-small-line-height);\n color: var(--text-heading-small-color);\n text-decoration: var(--text-heading-small-text-decoration);\n letter-spacing: var(--text-heading-small-letter-spacing);\n}\n\n._heading-table_j4l26_56 {\n font-family: var(--text-heading-table-font-family);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n font-size: var(--text-heading-table-font-size);\n line-height: var(--text-heading-table-line-height);\n color: var(--text-heading-table-color);\n text-decoration: var(--text-heading-table-text-decoration);\n letter-spacing: var(--text-heading-table-letter-spacing);\n}\n\n._subheading-large_j4l26_67 {\n font-family: var(--text-subheading-large-font-family);\n font-style: var(--text-subheading-large-font-style);\n font-weight: var(--text-subheading-large-font-weight);\n font-size: var(--text-subheading-large-font-size);\n line-height: var(--text-subheading-large-line-height);\n color: var(--text-subheading-large-color);\n text-decoration: var(--text-subheading-large-text-decoration);\n letter-spacing: var(--text-subheading-large-letter-spacing);\n}\n\n._subheading-medium_j4l26_78 {\n font-family: var(--text-subheading-medium-font-family);\n font-style: var(--text-subheading-medium-font-style);\n font-weight: var(--text-subheading-medium-font-weight);\n font-size: var(--text-subheading-medium-font-size);\n line-height: var(--text-subheading-medium-line-height);\n color: var(--text-subheading-medium-color);\n text-decoration: var(--text-subheading-medium-text-decoration);\n letter-spacing: var(--text-subheading-medium-letter-spacing);\n}\n\n._subheading-small_j4l26_89 {\n font-family: var(--text-subheading-small-font-family);\n font-style: var(--text-subheading-small-font-style);\n font-weight: var(--text-subheading-small-font-weight);\n font-size: var(--text-subheading-small-font-size);\n line-height: var(--text-subheading-small-line-height);\n color: var(--text-subheading-small-color);\n text-decoration: var(--text-subheading-small-text-decoration);\n letter-spacing: var(--text-subheading-small-letter-spacing);\n}\n\n._subheading-small-bold_j4l26_100 {\n font-family: var(--text-subheading-small-bold-font-family);\n font-style: var(--text-subheading-small-bold-font-style);\n font-weight: var(--text-subheading-small-bold-font-weight);\n font-size: var(--text-subheading-small-bold-font-size);\n line-height: var(--text-subheading-small-bold-line-height);\n color: var(--text-subheading-small-bold-color);\n text-decoration: var(--text-subheading-small-bold-text-decoration);\n letter-spacing: var(--text-subheading-small-bold-letter-spacing);\n}\n\n._body_j4l26_111 {\n font-family: var(--text-body-font-family);\n font-style: var(--text-body-font-style);\n font-weight: var(--text-body-font-weight);\n font-size: var(--text-body-font-size);\n line-height: var(--text-body-line-height);\n color: var(--text-body-color);\n text-decoration: var(--text-body-text-decoration);\n letter-spacing: var(--text-body-letter-spacing);\n}\n\n._body-small_j4l26_122 {\n font-family: var(--text-body-small-font-family);\n font-style: var(--text-body-small-font-style);\n font-weight: var(--text-body-small-font-weight);\n font-size: var(--text-body-small-font-size);\n line-height: var(--text-body-small-line-height);\n color: var(--text-body-small-color);\n text-decoration: var(--text-body-small-text-decoration);\n letter-spacing: var(--text-body-small-letter-spacing);\n}\n\n._body-bold_j4l26_133 {\n font-family: var(--text-body-bold-font-family);\n font-style: var(--text-body-bold-font-style);\n font-weight: var(--text-body-bold-font-weight);\n font-size: var(--text-body-bold-font-size);\n line-height: var(--text-body-bold-line-height);\n color: var(--text-body-bold-color);\n text-decoration: var(--text-body-bold-text-decoration);\n letter-spacing: var(--text-body-bold-letter-spacing);\n}\n\n._body-bold-dark_j4l26_144 {\n font-family: var(--text-body-bold-dark-font-family);\n font-style: var(--text-body-bold-dark-font-style);\n font-weight: var(--text-body-bold-dark-font-weight);\n font-size: var(--text-body-bold-dark-font-size);\n line-height: var(--text-body-bold-dark-line-height);\n color: var(--text-body-bold-dark-color);\n text-decoration: var(--text-body-bold-dark-text-decoration);\n letter-spacing: var(--text-body-bold-dark-letter-spacing);\n}\n\n._body-small-bold_j4l26_155 {\n font-family: var(--text-body-small-bold-font-family);\n font-style: var(--text-body-small-bold-font-style);\n font-weight: var(--text-body-small-bold-font-weight);\n font-size: var(--text-body-small-bold-font-size);\n line-height: var(--text-body-small-bold-line-height);\n color: var(--text-body-small-bold-color);\n text-decoration: var(--text-body-small-bold-text-decoration);\n letter-spacing: var(--text-body-small-bold-letter-spacing);\n}\n\n._button_j4l26_166 {\n font-family: var(--text-button-font-family);\n font-style: var(--text-button-font-style);\n font-weight: var(--text-button-font-weight);\n font-size: var(--text-button-font-size);\n line-height: var(--text-button-line-height);\n color: var(--text-button-color);\n text-decoration: var(--text-button-text-decoration);\n letter-spacing: var(--text-button-letter-spacing);\n}\n\n._button-small_j4l26_177 {\n font-family: var(--text-button-small-font-family);\n font-style: var(--text-button-small-font-style);\n font-weight: var(--text-button-small-font-weight);\n font-size: var(--text-button-small-font-size);\n line-height: var(--text-button-small-line-height);\n color: var(--text-button-small-color);\n text-decoration: var(--text-button-small-text-decoration);\n letter-spacing: var(--text-button-small-letter-spacing);\n}\n\n._link-large_j4l26_188 {\n font-family: var(--text-link-large-font-family);\n font-style: var(--text-link-large-font-style);\n font-weight: var(--text-link-large-font-weight);\n font-size: var(--text-link-large-font-size);\n line-height: var(--text-link-large-line-height);\n color: var(--text-link-large-color);\n text-decoration: var(--text-link-large-text-decoration);\n letter-spacing: var(--text-link-large-letter-spacing);\n}\n\n._link-medium_j4l26_199 {\n font-family: var(--text-link-medium-font-family);\n font-style: var(--text-link-medium-font-style);\n font-weight: var(--text-link-medium-font-weight);\n font-size: var(--text-link-medium-font-size);\n line-height: var(--text-link-medium-line-height);\n color: var(--text-link-medium-color);\n text-decoration: var(--text-link-medium-text-decoration);\n letter-spacing: var(--text-link-medium-letter-spacing);\n}\n\n._link_j4l26_188 {\n font-family: var(--text-link-font-family);\n font-style: var(--text-link-font-style);\n font-weight: var(--text-link-font-weight);\n font-size: var(--text-link-font-size);\n line-height: var(--text-link-line-height);\n color: var(--text-link-color);\n text-decoration: var(--text-link-text-decoration);\n letter-spacing: var(--text-link-letter-spacing);\n}\n\n._link-small_j4l26_221 {\n font-family: var(--text-link-small-font-family);\n font-style: var(--text-link-small-font-style);\n font-weight: var(--text-link-small-font-weight);\n font-size: var(--text-link-small-font-size);\n line-height: var(--text-link-small-line-height);\n color: var(--text-link-small-color);\n text-decoration: var(--text-link-small-text-decoration);\n letter-spacing: var(--text-link-small-letter-spacing);\n}\n\n._input-label_j4l26_232 {\n font-family: var(--text-input-label-font-family);\n font-style: var(--text-input-label-font-style);\n font-weight: var(--text-input-label-font-weight);\n font-size: var(--text-input-label-font-size);\n line-height: var(--text-input-label-line-height);\n color: var(--text-input-label-color);\n text-decoration: var(--text-input-label-text-decoration);\n letter-spacing: var(--text-input-label-letter-spacing);\n}\n\n._input-label-small_j4l26_243 {\n font-family: var(--text-input-label-small-font-family);\n font-style: var(--text-input-label-small-font-style);\n font-weight: var(--text-input-label-small-font-weight);\n font-size: var(--text-input-label-small-font-size);\n line-height: var(--text-input-label-small-line-height);\n color: var(--text-input-label-small-color);\n text-decoration: var(--text-input-label-small-text-decoration);\n letter-spacing: var(--text-input-label-small-letter-spacing);\n}\n\n._hint-text_j4l26_254 {\n font-family: var(--text-hint-text-font-family);\n font-style: var(--text-hint-text-font-style);\n font-weight: var(--text-hint-text-font-weight);\n font-size: var(--text-hint-text-font-size);\n line-height: var(--text-hint-text-line-height);\n color: var(--text-hint-text-color);\n text-decoration: var(--text-hint-text-text-decoration);\n letter-spacing: var(--text-hint-text-letter-spacing);\n}\n\n._placeholder_j4l26_265 {\n font-family: var(--text-placeholder-font-family);\n font-style: var(--text-placeholder-font-style);\n font-weight: var(--text-placeholder-font-weight);\n font-size: var(--text-placeholder-font-size);\n line-height: var(--text-placeholder-line-height);\n color: var(--text-placeholder-color);\n text-decoration: var(--text-placeholder-text-decoration);\n letter-spacing: var(--text-placeholder-letter-spacing);\n}\n\n._placeholder-small_j4l26_276 {\n font-family: var(--text-placeholder-small-font-family);\n font-style: var(--text-placeholder-small-font-style);\n font-weight: var(--text-placeholder-small-font-weight);\n font-size: var(--text-placeholder-small-font-size);\n line-height: var(--text-placeholder-small-line-height);\n color: var(--text-placeholder-small-color);\n text-decoration: var(--text-placeholder-small-text-decoration);\n letter-spacing: var(--text-placeholder-small-letter-spacing);\n}\n\n._placeholder-code_j4l26_287 {\n font-family: var(--text-placeholder-code-font-family);\n font-style: var(--text-placeholder-code-font-style);\n font-weight: var(--text-placeholder-code-font-weight);\n font-size: var(--text-placeholder-code-font-size);\n line-height: var(--text-placeholder-code-line-height);\n color: var(--text-placeholder-code-color);\n text-decoration: var(--text-placeholder-code-text-decoration);\n letter-spacing: var(--text-placeholder-code-letter-spacing);\n}\n\n._placeholder-code-small_j4l26_298 {\n font-family: var(--text-placeholder-code-small-font-family);\n font-style: var(--text-placeholder-code-small-font-style);\n font-weight: var(--text-placeholder-code-small-font-weight);\n font-size: var(--text-placeholder-code-small-font-size);\n line-height: var(--text-placeholder-code-small-line-height);\n color: var(--text-placeholder-code-small-color);\n text-decoration: var(--text-placeholder-code-small-text-decoration);\n letter-spacing: var(--text-placeholder-code-small-letter-spacing);\n}\n\n._error_j4l26_309 {\n font-family: var(--text-error-font-family);\n font-style: var(--text-error-font-style);\n font-weight: var(--text-error-font-weight);\n font-size: var(--text-error-font-size);\n line-height: var(--text-error-line-height);\n color: var(--text-error-color);\n text-decoration: var(--text-error-text-decoration);\n letter-spacing: var(--text-error-letter-spacing);\n}\n\n._error-small_j4l26_320 {\n font-family: var(--text-error-small-font-family);\n font-style: var(--text-error-small-font-style);\n font-weight: var(--text-error-small-font-weight);\n font-size: var(--text-error-small-font-size);\n line-height: var(--text-error-small-line-height);\n color: var(--text-error-small-color);\n text-decoration: var(--text-error-small-text-decoration);\n letter-spacing: var(--text-error-small-letter-spacing);\n}\n\n._success-small_j4l26_331 {\n font-family: var(--text-success-small-font-family);\n font-style: var(--text-success-small-font-style);\n font-weight: var(--text-success-small-font-weight);\n font-size: var(--text-success-small-font-size);\n line-height: var(--text-success-small-line-height);\n color: var(--text-success-small-color);\n text-decoration: var(--text-success-small-text-decoration);\n letter-spacing: var(--text-success-small-letter-spacing);\n}\n\n._reset_j4l26_342 {\n appearance: none;\n border: 0;\n background-color: transparent;\n padding: unset;\n font: inherit;\n text-decoration: none;\n text-align: start;\n color: inherit;\n}\n._reset_j4l26_342:hover {\n cursor: pointer;\n}\n\n._base_j4l26_356 {\n --link-icon-size: var(--sizes-base);\n appearance: none;\n border: 0;\n background-color: transparent;\n padding: unset;\n font: inherit;\n text-decoration: none;\n text-align: start;\n color: inherit;\n font-family: var(--text-link-font-family);\n font-style: var(--text-link-font-style);\n font-weight: var(--text-link-font-weight);\n font-size: var(--text-link-font-size);\n line-height: var(--text-link-line-height);\n color: var(--text-link-color);\n text-decoration: var(--text-link-text-decoration);\n letter-spacing: var(--text-link-letter-spacing);\n display: inline-flex;\n align-items: center;\n gap: var(--radius-sm);\n color: var(--colors-secondary-blue-base);\n text-decoration: underline;\n}\n._base_j4l26_356:hover {\n cursor: pointer;\n}\n._base_j4l26_356 svg {\n width: var(--link-icon-size);\n height: var(--link-icon-size);\n vertical-align: middle;\n flex-shrink: 0;\n}\n._base_j4l26_356._xl-size_j4l26_389 {\n --link-icon-size: var(--sizes-5);\n font-family: var(--text-link-large-font-family);\n font-style: var(--text-link-large-font-style);\n font-weight: var(--text-link-large-font-weight);\n font-size: var(--text-link-large-font-size);\n line-height: var(--text-link-large-line-height);\n color: var(--text-link-large-color);\n text-decoration: var(--text-link-large-text-decoration);\n letter-spacing: var(--text-link-large-letter-spacing);\n}\n._base_j4l26_356._sm-size_j4l26_400, ._base_j4l26_356._xs-size_j4l26_400 {\n --link-icon-size: var(--sizes-3);\n font-family: var(--text-link-small-font-family);\n font-style: var(--text-link-small-font-style);\n font-weight: var(--text-link-small-font-weight);\n font-size: var(--text-link-small-font-size);\n line-height: var(--text-link-small-line-height);\n color: var(--text-link-small-color);\n text-decoration: var(--text-link-small-text-decoration);\n letter-spacing: var(--text-link-small-letter-spacing);\n}\n._base_j4l26_356:hover {\n text-decoration-thickness: 2px;\n cursor: pointer;\n}\n._base_j4l26_356:focus-visible {\n outline: 0;\n box-shadow: 0 0 0 var(--sizes-xs) white, 0 0 0 var(--sizes-sm) var(--colors-secondary-blue-light);\n border-radius: var(--sizes-xs);\n}\n._base_j4l26_356._inherit-size_j4l26_420 {\n font-size: inherit;\n line-height: inherit;\n --link-icon-size: 1em;\n}");
6
- var linkStyles = {"heading-xxl":"_heading-xxl_j4l26_1","heading-xl":"_heading-xl_j4l26_12","heading-large":"_heading-large_j4l26_23","heading-medium":"_heading-medium_j4l26_34","heading-small":"_heading-small_j4l26_45","heading-table":"_heading-table_j4l26_56","subheading-large":"_subheading-large_j4l26_67","subheading-medium":"_subheading-medium_j4l26_78","subheading-small":"_subheading-small_j4l26_89","subheading-small-bold":"_subheading-small-bold_j4l26_100","body":"_body_j4l26_111","body-small":"_body-small_j4l26_122","body-bold":"_body-bold_j4l26_133","body-bold-dark":"_body-bold-dark_j4l26_144","body-small-bold":"_body-small-bold_j4l26_155","button":"_button_j4l26_166","button-small":"_button-small_j4l26_177","link-large":"_link-large_j4l26_188","link-medium":"_link-medium_j4l26_199","link":"_link_j4l26_188","link-small":"_link-small_j4l26_221","input-label":"_input-label_j4l26_232","input-label-small":"_input-label-small_j4l26_243","hint-text":"_hint-text_j4l26_254","placeholder":"_placeholder_j4l26_265","placeholder-small":"_placeholder-small_j4l26_276","placeholder-code":"_placeholder-code_j4l26_287","placeholder-code-small":"_placeholder-code-small_j4l26_298","error":"_error_j4l26_309","error-small":"_error-small_j4l26_320","success-small":"_success-small_j4l26_331","reset":"_reset_j4l26_342","base":"_base_j4l26_356","xl-size":"_xl-size_j4l26_389","sm-size":"_sm-size_j4l26_400","xs-size":"_xs-size_j4l26_400","inherit-size":"_inherit-size_j4l26_420"};
5
+ ___$insertStyle("._heading-xxl_1rp50_1 {\n font-family: var(--text-heading-xxl-font-family);\n font-style: var(--text-heading-xxl-font-style);\n font-weight: var(--text-heading-xxl-font-weight);\n font-size: var(--text-heading-xxl-font-size);\n line-height: var(--text-heading-xxl-line-height);\n color: var(--text-heading-xxl-color);\n text-decoration: var(--text-heading-xxl-text-decoration);\n letter-spacing: var(--text-heading-xxl-letter-spacing);\n}\n\n._heading-xl_1rp50_12 {\n font-family: var(--text-heading-xl-font-family);\n font-style: var(--text-heading-xl-font-style);\n font-weight: var(--text-heading-xl-font-weight);\n font-size: var(--text-heading-xl-font-size);\n line-height: var(--text-heading-xl-line-height);\n color: var(--text-heading-xl-color);\n text-decoration: var(--text-heading-xl-text-decoration);\n letter-spacing: var(--text-heading-xl-letter-spacing);\n}\n\n._heading-large_1rp50_23 {\n font-family: var(--text-heading-large-font-family);\n font-style: var(--text-heading-large-font-style);\n font-weight: var(--text-heading-large-font-weight);\n font-size: var(--text-heading-large-font-size);\n line-height: var(--text-heading-large-line-height);\n color: var(--text-heading-large-color);\n text-decoration: var(--text-heading-large-text-decoration);\n letter-spacing: var(--text-heading-large-letter-spacing);\n}\n\n._heading-medium_1rp50_34 {\n font-family: var(--text-heading-medium-font-family);\n font-style: var(--text-heading-medium-font-style);\n font-weight: var(--text-heading-medium-font-weight);\n font-size: var(--text-heading-medium-font-size);\n line-height: var(--text-heading-medium-line-height);\n color: var(--text-heading-medium-color);\n text-decoration: var(--text-heading-medium-text-decoration);\n letter-spacing: var(--text-heading-medium-letter-spacing);\n}\n\n._heading-small_1rp50_45 {\n font-family: var(--text-heading-small-font-family);\n font-style: var(--text-heading-small-font-style);\n font-weight: var(--text-heading-small-font-weight);\n font-size: var(--text-heading-small-font-size);\n line-height: var(--text-heading-small-line-height);\n color: var(--text-heading-small-color);\n text-decoration: var(--text-heading-small-text-decoration);\n letter-spacing: var(--text-heading-small-letter-spacing);\n}\n\n._heading-table_1rp50_56 {\n font-family: var(--text-heading-table-font-family);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n font-size: var(--text-heading-table-font-size);\n line-height: var(--text-heading-table-line-height);\n color: var(--text-heading-table-color);\n text-decoration: var(--text-heading-table-text-decoration);\n letter-spacing: var(--text-heading-table-letter-spacing);\n}\n\n._subheading-large_1rp50_67 {\n font-family: var(--text-subheading-large-font-family);\n font-style: var(--text-subheading-large-font-style);\n font-weight: var(--text-subheading-large-font-weight);\n font-size: var(--text-subheading-large-font-size);\n line-height: var(--text-subheading-large-line-height);\n color: var(--text-subheading-large-color);\n text-decoration: var(--text-subheading-large-text-decoration);\n letter-spacing: var(--text-subheading-large-letter-spacing);\n}\n\n._subheading-medium_1rp50_78 {\n font-family: var(--text-subheading-medium-font-family);\n font-style: var(--text-subheading-medium-font-style);\n font-weight: var(--text-subheading-medium-font-weight);\n font-size: var(--text-subheading-medium-font-size);\n line-height: var(--text-subheading-medium-line-height);\n color: var(--text-subheading-medium-color);\n text-decoration: var(--text-subheading-medium-text-decoration);\n letter-spacing: var(--text-subheading-medium-letter-spacing);\n}\n\n._subheading-small_1rp50_89 {\n font-family: var(--text-subheading-small-font-family);\n font-style: var(--text-subheading-small-font-style);\n font-weight: var(--text-subheading-small-font-weight);\n font-size: var(--text-subheading-small-font-size);\n line-height: var(--text-subheading-small-line-height);\n color: var(--text-subheading-small-color);\n text-decoration: var(--text-subheading-small-text-decoration);\n letter-spacing: var(--text-subheading-small-letter-spacing);\n}\n\n._subheading-small-bold_1rp50_100 {\n font-family: var(--text-subheading-small-bold-font-family);\n font-style: var(--text-subheading-small-bold-font-style);\n font-weight: var(--text-subheading-small-bold-font-weight);\n font-size: var(--text-subheading-small-bold-font-size);\n line-height: var(--text-subheading-small-bold-line-height);\n color: var(--text-subheading-small-bold-color);\n text-decoration: var(--text-subheading-small-bold-text-decoration);\n letter-spacing: var(--text-subheading-small-bold-letter-spacing);\n}\n\n._body_1rp50_111 {\n font-family: var(--text-body-font-family);\n font-style: var(--text-body-font-style);\n font-weight: var(--text-body-font-weight);\n font-size: var(--text-body-font-size);\n line-height: var(--text-body-line-height);\n color: var(--text-body-color);\n text-decoration: var(--text-body-text-decoration);\n letter-spacing: var(--text-body-letter-spacing);\n}\n\n._body-small_1rp50_122 {\n font-family: var(--text-body-small-font-family);\n font-style: var(--text-body-small-font-style);\n font-weight: var(--text-body-small-font-weight);\n font-size: var(--text-body-small-font-size);\n line-height: var(--text-body-small-line-height);\n color: var(--text-body-small-color);\n text-decoration: var(--text-body-small-text-decoration);\n letter-spacing: var(--text-body-small-letter-spacing);\n}\n\n._body-bold_1rp50_133 {\n font-family: var(--text-body-bold-font-family);\n font-style: var(--text-body-bold-font-style);\n font-weight: var(--text-body-bold-font-weight);\n font-size: var(--text-body-bold-font-size);\n line-height: var(--text-body-bold-line-height);\n color: var(--text-body-bold-color);\n text-decoration: var(--text-body-bold-text-decoration);\n letter-spacing: var(--text-body-bold-letter-spacing);\n}\n\n._body-bold-dark_1rp50_144 {\n font-family: var(--text-body-bold-dark-font-family);\n font-style: var(--text-body-bold-dark-font-style);\n font-weight: var(--text-body-bold-dark-font-weight);\n font-size: var(--text-body-bold-dark-font-size);\n line-height: var(--text-body-bold-dark-line-height);\n color: var(--text-body-bold-dark-color);\n text-decoration: var(--text-body-bold-dark-text-decoration);\n letter-spacing: var(--text-body-bold-dark-letter-spacing);\n}\n\n._body-small-bold_1rp50_155 {\n font-family: var(--text-body-small-bold-font-family);\n font-style: var(--text-body-small-bold-font-style);\n font-weight: var(--text-body-small-bold-font-weight);\n font-size: var(--text-body-small-bold-font-size);\n line-height: var(--text-body-small-bold-line-height);\n color: var(--text-body-small-bold-color);\n text-decoration: var(--text-body-small-bold-text-decoration);\n letter-spacing: var(--text-body-small-bold-letter-spacing);\n}\n\n._button_1rp50_166 {\n font-family: var(--text-button-font-family);\n font-style: var(--text-button-font-style);\n font-weight: var(--text-button-font-weight);\n font-size: var(--text-button-font-size);\n line-height: var(--text-button-line-height);\n color: var(--text-button-color);\n text-decoration: var(--text-button-text-decoration);\n letter-spacing: var(--text-button-letter-spacing);\n}\n\n._button-small_1rp50_177 {\n font-family: var(--text-button-small-font-family);\n font-style: var(--text-button-small-font-style);\n font-weight: var(--text-button-small-font-weight);\n font-size: var(--text-button-small-font-size);\n line-height: var(--text-button-small-line-height);\n color: var(--text-button-small-color);\n text-decoration: var(--text-button-small-text-decoration);\n letter-spacing: var(--text-button-small-letter-spacing);\n}\n\n._link-large_1rp50_188 {\n font-family: var(--text-link-large-font-family);\n font-style: var(--text-link-large-font-style);\n font-weight: var(--text-link-large-font-weight);\n font-size: var(--text-link-large-font-size);\n line-height: var(--text-link-large-line-height);\n color: var(--text-link-large-color);\n text-decoration: var(--text-link-large-text-decoration);\n letter-spacing: var(--text-link-large-letter-spacing);\n}\n\n._link-medium_1rp50_199 {\n font-family: var(--text-link-medium-font-family);\n font-style: var(--text-link-medium-font-style);\n font-weight: var(--text-link-medium-font-weight);\n font-size: var(--text-link-medium-font-size);\n line-height: var(--text-link-medium-line-height);\n color: var(--text-link-medium-color);\n text-decoration: var(--text-link-medium-text-decoration);\n letter-spacing: var(--text-link-medium-letter-spacing);\n}\n\n._link_1rp50_188 {\n font-family: var(--text-link-font-family);\n font-style: var(--text-link-font-style);\n font-weight: var(--text-link-font-weight);\n font-size: var(--text-link-font-size);\n line-height: var(--text-link-line-height);\n color: var(--text-link-color);\n text-decoration: var(--text-link-text-decoration);\n letter-spacing: var(--text-link-letter-spacing);\n}\n\n._link-small_1rp50_221 {\n font-family: var(--text-link-small-font-family);\n font-style: var(--text-link-small-font-style);\n font-weight: var(--text-link-small-font-weight);\n font-size: var(--text-link-small-font-size);\n line-height: var(--text-link-small-line-height);\n color: var(--text-link-small-color);\n text-decoration: var(--text-link-small-text-decoration);\n letter-spacing: var(--text-link-small-letter-spacing);\n}\n\n._input-label_1rp50_232 {\n font-family: var(--text-input-label-font-family);\n font-style: var(--text-input-label-font-style);\n font-weight: var(--text-input-label-font-weight);\n font-size: var(--text-input-label-font-size);\n line-height: var(--text-input-label-line-height);\n color: var(--text-input-label-color);\n text-decoration: var(--text-input-label-text-decoration);\n letter-spacing: var(--text-input-label-letter-spacing);\n}\n\n._input-label-small_1rp50_243 {\n font-family: var(--text-input-label-small-font-family);\n font-style: var(--text-input-label-small-font-style);\n font-weight: var(--text-input-label-small-font-weight);\n font-size: var(--text-input-label-small-font-size);\n line-height: var(--text-input-label-small-line-height);\n color: var(--text-input-label-small-color);\n text-decoration: var(--text-input-label-small-text-decoration);\n letter-spacing: var(--text-input-label-small-letter-spacing);\n}\n\n._hint-text_1rp50_254 {\n font-family: var(--text-hint-text-font-family);\n font-style: var(--text-hint-text-font-style);\n font-weight: var(--text-hint-text-font-weight);\n font-size: var(--text-hint-text-font-size);\n line-height: var(--text-hint-text-line-height);\n color: var(--text-hint-text-color);\n text-decoration: var(--text-hint-text-text-decoration);\n letter-spacing: var(--text-hint-text-letter-spacing);\n}\n\n._placeholder_1rp50_265 {\n font-family: var(--text-placeholder-font-family);\n font-style: var(--text-placeholder-font-style);\n font-weight: var(--text-placeholder-font-weight);\n font-size: var(--text-placeholder-font-size);\n line-height: var(--text-placeholder-line-height);\n color: var(--text-placeholder-color);\n text-decoration: var(--text-placeholder-text-decoration);\n letter-spacing: var(--text-placeholder-letter-spacing);\n}\n\n._placeholder-small_1rp50_276 {\n font-family: var(--text-placeholder-small-font-family);\n font-style: var(--text-placeholder-small-font-style);\n font-weight: var(--text-placeholder-small-font-weight);\n font-size: var(--text-placeholder-small-font-size);\n line-height: var(--text-placeholder-small-line-height);\n color: var(--text-placeholder-small-color);\n text-decoration: var(--text-placeholder-small-text-decoration);\n letter-spacing: var(--text-placeholder-small-letter-spacing);\n}\n\n._placeholder-code_1rp50_287 {\n font-family: var(--text-placeholder-code-font-family);\n font-style: var(--text-placeholder-code-font-style);\n font-weight: var(--text-placeholder-code-font-weight);\n font-size: var(--text-placeholder-code-font-size);\n line-height: var(--text-placeholder-code-line-height);\n color: var(--text-placeholder-code-color);\n text-decoration: var(--text-placeholder-code-text-decoration);\n letter-spacing: var(--text-placeholder-code-letter-spacing);\n}\n\n._placeholder-code-small_1rp50_298 {\n font-family: var(--text-placeholder-code-small-font-family);\n font-style: var(--text-placeholder-code-small-font-style);\n font-weight: var(--text-placeholder-code-small-font-weight);\n font-size: var(--text-placeholder-code-small-font-size);\n line-height: var(--text-placeholder-code-small-line-height);\n color: var(--text-placeholder-code-small-color);\n text-decoration: var(--text-placeholder-code-small-text-decoration);\n letter-spacing: var(--text-placeholder-code-small-letter-spacing);\n}\n\n._error_1rp50_309 {\n font-family: var(--text-error-font-family);\n font-style: var(--text-error-font-style);\n font-weight: var(--text-error-font-weight);\n font-size: var(--text-error-font-size);\n line-height: var(--text-error-line-height);\n color: var(--text-error-color);\n text-decoration: var(--text-error-text-decoration);\n letter-spacing: var(--text-error-letter-spacing);\n}\n\n._error-small_1rp50_320 {\n font-family: var(--text-error-small-font-family);\n font-style: var(--text-error-small-font-style);\n font-weight: var(--text-error-small-font-weight);\n font-size: var(--text-error-small-font-size);\n line-height: var(--text-error-small-line-height);\n color: var(--text-error-small-color);\n text-decoration: var(--text-error-small-text-decoration);\n letter-spacing: var(--text-error-small-letter-spacing);\n}\n\n._success-small_1rp50_331 {\n font-family: var(--text-success-small-font-family);\n font-style: var(--text-success-small-font-style);\n font-weight: var(--text-success-small-font-weight);\n font-size: var(--text-success-small-font-size);\n line-height: var(--text-success-small-line-height);\n color: var(--text-success-small-color);\n text-decoration: var(--text-success-small-text-decoration);\n letter-spacing: var(--text-success-small-letter-spacing);\n}\n\n._reset_1rp50_342 {\n appearance: none;\n border: 0;\n background-color: transparent;\n padding: unset;\n font: inherit;\n text-decoration: none;\n text-align: start;\n color: inherit;\n}\n._reset_1rp50_342:hover {\n cursor: pointer;\n}\n\n._base_1rp50_356 {\n --link-icon-size: var(--sizes-base);\n --line-thickness: 2.5px;\n appearance: none;\n border: 0;\n background-color: transparent;\n padding: unset;\n font: inherit;\n text-decoration: none;\n text-align: start;\n color: inherit;\n font-family: var(--text-link-medium-font-family);\n font-style: var(--text-link-medium-font-style);\n font-weight: var(--text-link-medium-font-weight);\n font-size: var(--text-link-medium-font-size);\n line-height: var(--text-link-medium-line-height);\n color: var(--text-link-medium-color);\n text-decoration: var(--text-link-medium-text-decoration);\n letter-spacing: var(--text-link-medium-letter-spacing);\n display: inline-flex;\n align-items: center;\n gap: var(--radius-sm);\n color: var(--colors-secondary-blue-base);\n text-decoration-line: underline;\n text-decoration-style: solid;\n}\n._base_1rp50_356:hover {\n cursor: pointer;\n}\n._base_1rp50_356 svg {\n width: var(--link-icon-size);\n height: var(--link-icon-size);\n vertical-align: middle;\n flex-shrink: 0;\n}\n._base_1rp50_356._xl-size_1rp50_391 {\n --link-icon-size: var(--sizes-5);\n --line-thickness: 3px;\n font-family: var(--text-link-large-font-family);\n font-style: var(--text-link-large-font-style);\n font-weight: var(--text-link-large-font-weight);\n font-size: var(--text-link-large-font-size);\n line-height: var(--text-link-large-line-height);\n color: var(--text-link-large-color);\n text-decoration: var(--text-link-large-text-decoration);\n letter-spacing: var(--text-link-large-letter-spacing);\n}\n._base_1rp50_356._sm-size_1rp50_403 {\n --link-icon-size: var(--sizes-4);\n --line-thickness: 2px;\n font-family: var(--text-link-font-family);\n font-style: var(--text-link-font-style);\n font-weight: var(--text-link-font-weight);\n font-size: var(--text-link-font-size);\n line-height: var(--text-link-line-height);\n color: var(--text-link-color);\n text-decoration: var(--text-link-text-decoration);\n letter-spacing: var(--text-link-letter-spacing);\n}\n._base_1rp50_356._xs-size_1rp50_415 {\n --link-icon-size: var(--sizes-3);\n --line-thickness: 1.5px;\n font-family: var(--text-link-small-font-family);\n font-style: var(--text-link-small-font-style);\n font-weight: var(--text-link-small-font-weight);\n font-size: var(--text-link-small-font-size);\n line-height: var(--text-link-small-line-height);\n color: var(--text-link-small-color);\n text-decoration: var(--text-link-small-text-decoration);\n letter-spacing: var(--text-link-small-letter-spacing);\n}\n._base_1rp50_356:hover {\n text-decoration-thickness: var(--line-thickness);\n cursor: pointer;\n}\n._base_1rp50_356:focus-visible {\n text-decoration-thickness: var(--line-thickness);\n outline: 0;\n box-shadow: 0 0 0 var(--sizes-xs) white, 0 0 0 var(--sizes-sm) var(--colors-secondary-blue-light);\n border-radius: var(--sizes-xs);\n}\n._base_1rp50_356._inherit-size_1rp50_437 {\n font-size: inherit;\n line-height: inherit;\n --link-icon-size: 1em;\n --line-thickness: 0.15em;\n}");
6
+ var linkStyles = {"heading-xxl":"_heading-xxl_1rp50_1","heading-xl":"_heading-xl_1rp50_12","heading-large":"_heading-large_1rp50_23","heading-medium":"_heading-medium_1rp50_34","heading-small":"_heading-small_1rp50_45","heading-table":"_heading-table_1rp50_56","subheading-large":"_subheading-large_1rp50_67","subheading-medium":"_subheading-medium_1rp50_78","subheading-small":"_subheading-small_1rp50_89","subheading-small-bold":"_subheading-small-bold_1rp50_100","body":"_body_1rp50_111","body-small":"_body-small_1rp50_122","body-bold":"_body-bold_1rp50_133","body-bold-dark":"_body-bold-dark_1rp50_144","body-small-bold":"_body-small-bold_1rp50_155","button":"_button_1rp50_166","button-small":"_button-small_1rp50_177","link-large":"_link-large_1rp50_188","link-medium":"_link-medium_1rp50_199","link":"_link_1rp50_188","link-small":"_link-small_1rp50_221","input-label":"_input-label_1rp50_232","input-label-small":"_input-label-small_1rp50_243","hint-text":"_hint-text_1rp50_254","placeholder":"_placeholder_1rp50_265","placeholder-small":"_placeholder-small_1rp50_276","placeholder-code":"_placeholder-code_1rp50_287","placeholder-code-small":"_placeholder-code-small_1rp50_298","error":"_error_1rp50_309","error-small":"_error-small_1rp50_320","success-small":"_success-small_1rp50_331","reset":"_reset_1rp50_342","base":"_base_1rp50_356","xl-size":"_xl-size_1rp50_391","sm-size":"_sm-size_1rp50_403","xs-size":"_xs-size_1rp50_415","inherit-size":"_inherit-size_1rp50_437"};
7
7
 
8
8
  module.exports = linkStyles;
9
9
  //# sourceMappingURL=link.module.scss.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"link.module.scss.cjs","sources":["../../../../src/components/Action/styles/link.module.scss"],"sourcesContent":["@use '../../../theme/scss/text.module.scss' as text;\n@use '../styles/reset.module.scss' as reset;\n\n.base {\n --link-icon-size: var(--sizes-base);\n\n @include reset.reset;\n @include text.link;\n display: inline-flex;\n align-items: center;\n gap: var(--radius-sm);\n\n color: var(--colors-secondary-blue-base);\n text-decoration: underline;\n & svg {\n width: var(--link-icon-size);\n height: var(--link-icon-size);\n vertical-align: middle;\n flex-shrink: 0;\n }\n\n &.xl-size {\n --link-icon-size: var(--sizes-5);\n\n @include text.link-large;\n }\n\n &.sm-size,\n &.xs-size {\n --link-icon-size: var(--sizes-3);\n\n @include text.link-small;\n }\n\n &:hover {\n text-decoration-thickness: 2px;\n cursor: pointer;\n }\n\n &:focus-visible {\n outline: 0;\n box-shadow:\n 0 0 0 var(--sizes-xs) white,\n 0 0 0 var(--sizes-sm) var(--colors-secondary-blue-light);\n border-radius: var(--sizes-xs);\n }\n &.inherit-size {\n font-size: inherit;\n line-height: inherit;\n\n --link-icon-size: 1em;\n }\n}\n"],"names":[],"mappings":";;;;AAGE,eAAA,CAAA,okhBAAA;AACA,iBAAA,CAAA,aAAA,CAAA,sBAAA,CAAA,YAAA,CAAA,sBAAA,CAAA,eAAA,CAAA,yBAAA,CAAA,gBAAA,CAAA,0BAAA,CAAA,eAAA,CAAA,yBAAA,CAAA,eAAA,CAAA,yBAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,mBAAA,CAAA,6BAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,uBAAA,CAAA,kCAAA,CAAA,MAAA,CAAA,iBAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,WAAA,CAAA,sBAAA,CAAA,gBAAA,CAAA,2BAAA,CAAA,iBAAA,CAAA,4BAAA,CAAA,QAAA,CAAA,mBAAA,CAAA,cAAA,CAAA,yBAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,MAAA,CAAA,iBAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,mBAAA,CAAA,8BAAA,CAAA,WAAA,CAAA,sBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,mBAAA,CAAA,8BAAA,CAAA,kBAAA,CAAA,6BAAA,CAAA,wBAAA,CAAA,mCAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,eAAA,CAAA,0BAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,MAAA,CAAA,iBAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,cAAA,CAAA,yBAAA;;;;"}
1
+ {"version":3,"file":"link.module.scss.cjs","sources":["../../../../src/components/Action/styles/link.module.scss"],"sourcesContent":["@use '../../../theme/scss/text.module.scss' as text;\n@use '../styles/reset.module.scss' as reset;\n\n.base {\n --link-icon-size: var(--sizes-base);\n --line-thickness: 2.5px;\n\n @include reset.reset;\n @include text.link-medium;\n display: inline-flex;\n align-items: center;\n gap: var(--radius-sm);\n\n color: var(--colors-secondary-blue-base);\n text-decoration-line: underline;\n text-decoration-style: solid;\n & svg {\n width: var(--link-icon-size);\n height: var(--link-icon-size);\n vertical-align: middle;\n flex-shrink: 0;\n }\n\n &.xl-size {\n --link-icon-size: var(--sizes-5);\n --line-thickness: 3px;\n\n @include text.link-large;\n }\n\n &.sm-size {\n --link-icon-size: var(--sizes-4);\n --line-thickness: 2px;\n\n @include text.link;\n }\n\n &.xs-size {\n --link-icon-size: var(--sizes-3);\n --line-thickness: 1.5px;\n\n @include text.link-small;\n }\n\n &:hover {\n text-decoration-thickness: var(--line-thickness);\n cursor: pointer;\n }\n\n &:focus-visible {\n text-decoration-thickness: var(--line-thickness);\n outline: 0;\n box-shadow:\n 0 0 0 var(--sizes-xs) white,\n 0 0 0 var(--sizes-sm) var(--colors-secondary-blue-light);\n border-radius: var(--sizes-xs);\n }\n &.inherit-size {\n font-size: inherit;\n line-height: inherit;\n\n --link-icon-size: 1em;\n --line-thickness: 0.15em;\n }\n}\n"],"names":[],"mappings":";;;;AAGE,eAAA,CAAA,wwiBAAA;AACA,iBAAA,CAAA,aAAA,CAAA,sBAAA,CAAA,YAAA,CAAA,sBAAA,CAAA,eAAA,CAAA,yBAAA,CAAA,gBAAA,CAAA,0BAAA,CAAA,eAAA,CAAA,yBAAA,CAAA,eAAA,CAAA,yBAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,mBAAA,CAAA,6BAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,uBAAA,CAAA,kCAAA,CAAA,MAAA,CAAA,iBAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,WAAA,CAAA,sBAAA,CAAA,gBAAA,CAAA,2BAAA,CAAA,iBAAA,CAAA,4BAAA,CAAA,QAAA,CAAA,mBAAA,CAAA,cAAA,CAAA,yBAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,MAAA,CAAA,iBAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,mBAAA,CAAA,8BAAA,CAAA,WAAA,CAAA,sBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,mBAAA,CAAA,8BAAA,CAAA,kBAAA,CAAA,6BAAA,CAAA,wBAAA,CAAA,mCAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,eAAA,CAAA,0BAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,MAAA,CAAA,iBAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,cAAA,CAAA,yBAAA;;;;"}
@@ -1,7 +1,7 @@
1
1
  import insertStyle from '../../../_virtual/____insertStyle.js';
2
2
 
3
- insertStyle("._heading-xxl_j4l26_1 {\n font-family: var(--text-heading-xxl-font-family);\n font-style: var(--text-heading-xxl-font-style);\n font-weight: var(--text-heading-xxl-font-weight);\n font-size: var(--text-heading-xxl-font-size);\n line-height: var(--text-heading-xxl-line-height);\n color: var(--text-heading-xxl-color);\n text-decoration: var(--text-heading-xxl-text-decoration);\n letter-spacing: var(--text-heading-xxl-letter-spacing);\n}\n\n._heading-xl_j4l26_12 {\n font-family: var(--text-heading-xl-font-family);\n font-style: var(--text-heading-xl-font-style);\n font-weight: var(--text-heading-xl-font-weight);\n font-size: var(--text-heading-xl-font-size);\n line-height: var(--text-heading-xl-line-height);\n color: var(--text-heading-xl-color);\n text-decoration: var(--text-heading-xl-text-decoration);\n letter-spacing: var(--text-heading-xl-letter-spacing);\n}\n\n._heading-large_j4l26_23 {\n font-family: var(--text-heading-large-font-family);\n font-style: var(--text-heading-large-font-style);\n font-weight: var(--text-heading-large-font-weight);\n font-size: var(--text-heading-large-font-size);\n line-height: var(--text-heading-large-line-height);\n color: var(--text-heading-large-color);\n text-decoration: var(--text-heading-large-text-decoration);\n letter-spacing: var(--text-heading-large-letter-spacing);\n}\n\n._heading-medium_j4l26_34 {\n font-family: var(--text-heading-medium-font-family);\n font-style: var(--text-heading-medium-font-style);\n font-weight: var(--text-heading-medium-font-weight);\n font-size: var(--text-heading-medium-font-size);\n line-height: var(--text-heading-medium-line-height);\n color: var(--text-heading-medium-color);\n text-decoration: var(--text-heading-medium-text-decoration);\n letter-spacing: var(--text-heading-medium-letter-spacing);\n}\n\n._heading-small_j4l26_45 {\n font-family: var(--text-heading-small-font-family);\n font-style: var(--text-heading-small-font-style);\n font-weight: var(--text-heading-small-font-weight);\n font-size: var(--text-heading-small-font-size);\n line-height: var(--text-heading-small-line-height);\n color: var(--text-heading-small-color);\n text-decoration: var(--text-heading-small-text-decoration);\n letter-spacing: var(--text-heading-small-letter-spacing);\n}\n\n._heading-table_j4l26_56 {\n font-family: var(--text-heading-table-font-family);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n font-size: var(--text-heading-table-font-size);\n line-height: var(--text-heading-table-line-height);\n color: var(--text-heading-table-color);\n text-decoration: var(--text-heading-table-text-decoration);\n letter-spacing: var(--text-heading-table-letter-spacing);\n}\n\n._subheading-large_j4l26_67 {\n font-family: var(--text-subheading-large-font-family);\n font-style: var(--text-subheading-large-font-style);\n font-weight: var(--text-subheading-large-font-weight);\n font-size: var(--text-subheading-large-font-size);\n line-height: var(--text-subheading-large-line-height);\n color: var(--text-subheading-large-color);\n text-decoration: var(--text-subheading-large-text-decoration);\n letter-spacing: var(--text-subheading-large-letter-spacing);\n}\n\n._subheading-medium_j4l26_78 {\n font-family: var(--text-subheading-medium-font-family);\n font-style: var(--text-subheading-medium-font-style);\n font-weight: var(--text-subheading-medium-font-weight);\n font-size: var(--text-subheading-medium-font-size);\n line-height: var(--text-subheading-medium-line-height);\n color: var(--text-subheading-medium-color);\n text-decoration: var(--text-subheading-medium-text-decoration);\n letter-spacing: var(--text-subheading-medium-letter-spacing);\n}\n\n._subheading-small_j4l26_89 {\n font-family: var(--text-subheading-small-font-family);\n font-style: var(--text-subheading-small-font-style);\n font-weight: var(--text-subheading-small-font-weight);\n font-size: var(--text-subheading-small-font-size);\n line-height: var(--text-subheading-small-line-height);\n color: var(--text-subheading-small-color);\n text-decoration: var(--text-subheading-small-text-decoration);\n letter-spacing: var(--text-subheading-small-letter-spacing);\n}\n\n._subheading-small-bold_j4l26_100 {\n font-family: var(--text-subheading-small-bold-font-family);\n font-style: var(--text-subheading-small-bold-font-style);\n font-weight: var(--text-subheading-small-bold-font-weight);\n font-size: var(--text-subheading-small-bold-font-size);\n line-height: var(--text-subheading-small-bold-line-height);\n color: var(--text-subheading-small-bold-color);\n text-decoration: var(--text-subheading-small-bold-text-decoration);\n letter-spacing: var(--text-subheading-small-bold-letter-spacing);\n}\n\n._body_j4l26_111 {\n font-family: var(--text-body-font-family);\n font-style: var(--text-body-font-style);\n font-weight: var(--text-body-font-weight);\n font-size: var(--text-body-font-size);\n line-height: var(--text-body-line-height);\n color: var(--text-body-color);\n text-decoration: var(--text-body-text-decoration);\n letter-spacing: var(--text-body-letter-spacing);\n}\n\n._body-small_j4l26_122 {\n font-family: var(--text-body-small-font-family);\n font-style: var(--text-body-small-font-style);\n font-weight: var(--text-body-small-font-weight);\n font-size: var(--text-body-small-font-size);\n line-height: var(--text-body-small-line-height);\n color: var(--text-body-small-color);\n text-decoration: var(--text-body-small-text-decoration);\n letter-spacing: var(--text-body-small-letter-spacing);\n}\n\n._body-bold_j4l26_133 {\n font-family: var(--text-body-bold-font-family);\n font-style: var(--text-body-bold-font-style);\n font-weight: var(--text-body-bold-font-weight);\n font-size: var(--text-body-bold-font-size);\n line-height: var(--text-body-bold-line-height);\n color: var(--text-body-bold-color);\n text-decoration: var(--text-body-bold-text-decoration);\n letter-spacing: var(--text-body-bold-letter-spacing);\n}\n\n._body-bold-dark_j4l26_144 {\n font-family: var(--text-body-bold-dark-font-family);\n font-style: var(--text-body-bold-dark-font-style);\n font-weight: var(--text-body-bold-dark-font-weight);\n font-size: var(--text-body-bold-dark-font-size);\n line-height: var(--text-body-bold-dark-line-height);\n color: var(--text-body-bold-dark-color);\n text-decoration: var(--text-body-bold-dark-text-decoration);\n letter-spacing: var(--text-body-bold-dark-letter-spacing);\n}\n\n._body-small-bold_j4l26_155 {\n font-family: var(--text-body-small-bold-font-family);\n font-style: var(--text-body-small-bold-font-style);\n font-weight: var(--text-body-small-bold-font-weight);\n font-size: var(--text-body-small-bold-font-size);\n line-height: var(--text-body-small-bold-line-height);\n color: var(--text-body-small-bold-color);\n text-decoration: var(--text-body-small-bold-text-decoration);\n letter-spacing: var(--text-body-small-bold-letter-spacing);\n}\n\n._button_j4l26_166 {\n font-family: var(--text-button-font-family);\n font-style: var(--text-button-font-style);\n font-weight: var(--text-button-font-weight);\n font-size: var(--text-button-font-size);\n line-height: var(--text-button-line-height);\n color: var(--text-button-color);\n text-decoration: var(--text-button-text-decoration);\n letter-spacing: var(--text-button-letter-spacing);\n}\n\n._button-small_j4l26_177 {\n font-family: var(--text-button-small-font-family);\n font-style: var(--text-button-small-font-style);\n font-weight: var(--text-button-small-font-weight);\n font-size: var(--text-button-small-font-size);\n line-height: var(--text-button-small-line-height);\n color: var(--text-button-small-color);\n text-decoration: var(--text-button-small-text-decoration);\n letter-spacing: var(--text-button-small-letter-spacing);\n}\n\n._link-large_j4l26_188 {\n font-family: var(--text-link-large-font-family);\n font-style: var(--text-link-large-font-style);\n font-weight: var(--text-link-large-font-weight);\n font-size: var(--text-link-large-font-size);\n line-height: var(--text-link-large-line-height);\n color: var(--text-link-large-color);\n text-decoration: var(--text-link-large-text-decoration);\n letter-spacing: var(--text-link-large-letter-spacing);\n}\n\n._link-medium_j4l26_199 {\n font-family: var(--text-link-medium-font-family);\n font-style: var(--text-link-medium-font-style);\n font-weight: var(--text-link-medium-font-weight);\n font-size: var(--text-link-medium-font-size);\n line-height: var(--text-link-medium-line-height);\n color: var(--text-link-medium-color);\n text-decoration: var(--text-link-medium-text-decoration);\n letter-spacing: var(--text-link-medium-letter-spacing);\n}\n\n._link_j4l26_188 {\n font-family: var(--text-link-font-family);\n font-style: var(--text-link-font-style);\n font-weight: var(--text-link-font-weight);\n font-size: var(--text-link-font-size);\n line-height: var(--text-link-line-height);\n color: var(--text-link-color);\n text-decoration: var(--text-link-text-decoration);\n letter-spacing: var(--text-link-letter-spacing);\n}\n\n._link-small_j4l26_221 {\n font-family: var(--text-link-small-font-family);\n font-style: var(--text-link-small-font-style);\n font-weight: var(--text-link-small-font-weight);\n font-size: var(--text-link-small-font-size);\n line-height: var(--text-link-small-line-height);\n color: var(--text-link-small-color);\n text-decoration: var(--text-link-small-text-decoration);\n letter-spacing: var(--text-link-small-letter-spacing);\n}\n\n._input-label_j4l26_232 {\n font-family: var(--text-input-label-font-family);\n font-style: var(--text-input-label-font-style);\n font-weight: var(--text-input-label-font-weight);\n font-size: var(--text-input-label-font-size);\n line-height: var(--text-input-label-line-height);\n color: var(--text-input-label-color);\n text-decoration: var(--text-input-label-text-decoration);\n letter-spacing: var(--text-input-label-letter-spacing);\n}\n\n._input-label-small_j4l26_243 {\n font-family: var(--text-input-label-small-font-family);\n font-style: var(--text-input-label-small-font-style);\n font-weight: var(--text-input-label-small-font-weight);\n font-size: var(--text-input-label-small-font-size);\n line-height: var(--text-input-label-small-line-height);\n color: var(--text-input-label-small-color);\n text-decoration: var(--text-input-label-small-text-decoration);\n letter-spacing: var(--text-input-label-small-letter-spacing);\n}\n\n._hint-text_j4l26_254 {\n font-family: var(--text-hint-text-font-family);\n font-style: var(--text-hint-text-font-style);\n font-weight: var(--text-hint-text-font-weight);\n font-size: var(--text-hint-text-font-size);\n line-height: var(--text-hint-text-line-height);\n color: var(--text-hint-text-color);\n text-decoration: var(--text-hint-text-text-decoration);\n letter-spacing: var(--text-hint-text-letter-spacing);\n}\n\n._placeholder_j4l26_265 {\n font-family: var(--text-placeholder-font-family);\n font-style: var(--text-placeholder-font-style);\n font-weight: var(--text-placeholder-font-weight);\n font-size: var(--text-placeholder-font-size);\n line-height: var(--text-placeholder-line-height);\n color: var(--text-placeholder-color);\n text-decoration: var(--text-placeholder-text-decoration);\n letter-spacing: var(--text-placeholder-letter-spacing);\n}\n\n._placeholder-small_j4l26_276 {\n font-family: var(--text-placeholder-small-font-family);\n font-style: var(--text-placeholder-small-font-style);\n font-weight: var(--text-placeholder-small-font-weight);\n font-size: var(--text-placeholder-small-font-size);\n line-height: var(--text-placeholder-small-line-height);\n color: var(--text-placeholder-small-color);\n text-decoration: var(--text-placeholder-small-text-decoration);\n letter-spacing: var(--text-placeholder-small-letter-spacing);\n}\n\n._placeholder-code_j4l26_287 {\n font-family: var(--text-placeholder-code-font-family);\n font-style: var(--text-placeholder-code-font-style);\n font-weight: var(--text-placeholder-code-font-weight);\n font-size: var(--text-placeholder-code-font-size);\n line-height: var(--text-placeholder-code-line-height);\n color: var(--text-placeholder-code-color);\n text-decoration: var(--text-placeholder-code-text-decoration);\n letter-spacing: var(--text-placeholder-code-letter-spacing);\n}\n\n._placeholder-code-small_j4l26_298 {\n font-family: var(--text-placeholder-code-small-font-family);\n font-style: var(--text-placeholder-code-small-font-style);\n font-weight: var(--text-placeholder-code-small-font-weight);\n font-size: var(--text-placeholder-code-small-font-size);\n line-height: var(--text-placeholder-code-small-line-height);\n color: var(--text-placeholder-code-small-color);\n text-decoration: var(--text-placeholder-code-small-text-decoration);\n letter-spacing: var(--text-placeholder-code-small-letter-spacing);\n}\n\n._error_j4l26_309 {\n font-family: var(--text-error-font-family);\n font-style: var(--text-error-font-style);\n font-weight: var(--text-error-font-weight);\n font-size: var(--text-error-font-size);\n line-height: var(--text-error-line-height);\n color: var(--text-error-color);\n text-decoration: var(--text-error-text-decoration);\n letter-spacing: var(--text-error-letter-spacing);\n}\n\n._error-small_j4l26_320 {\n font-family: var(--text-error-small-font-family);\n font-style: var(--text-error-small-font-style);\n font-weight: var(--text-error-small-font-weight);\n font-size: var(--text-error-small-font-size);\n line-height: var(--text-error-small-line-height);\n color: var(--text-error-small-color);\n text-decoration: var(--text-error-small-text-decoration);\n letter-spacing: var(--text-error-small-letter-spacing);\n}\n\n._success-small_j4l26_331 {\n font-family: var(--text-success-small-font-family);\n font-style: var(--text-success-small-font-style);\n font-weight: var(--text-success-small-font-weight);\n font-size: var(--text-success-small-font-size);\n line-height: var(--text-success-small-line-height);\n color: var(--text-success-small-color);\n text-decoration: var(--text-success-small-text-decoration);\n letter-spacing: var(--text-success-small-letter-spacing);\n}\n\n._reset_j4l26_342 {\n appearance: none;\n border: 0;\n background-color: transparent;\n padding: unset;\n font: inherit;\n text-decoration: none;\n text-align: start;\n color: inherit;\n}\n._reset_j4l26_342:hover {\n cursor: pointer;\n}\n\n._base_j4l26_356 {\n --link-icon-size: var(--sizes-base);\n appearance: none;\n border: 0;\n background-color: transparent;\n padding: unset;\n font: inherit;\n text-decoration: none;\n text-align: start;\n color: inherit;\n font-family: var(--text-link-font-family);\n font-style: var(--text-link-font-style);\n font-weight: var(--text-link-font-weight);\n font-size: var(--text-link-font-size);\n line-height: var(--text-link-line-height);\n color: var(--text-link-color);\n text-decoration: var(--text-link-text-decoration);\n letter-spacing: var(--text-link-letter-spacing);\n display: inline-flex;\n align-items: center;\n gap: var(--radius-sm);\n color: var(--colors-secondary-blue-base);\n text-decoration: underline;\n}\n._base_j4l26_356:hover {\n cursor: pointer;\n}\n._base_j4l26_356 svg {\n width: var(--link-icon-size);\n height: var(--link-icon-size);\n vertical-align: middle;\n flex-shrink: 0;\n}\n._base_j4l26_356._xl-size_j4l26_389 {\n --link-icon-size: var(--sizes-5);\n font-family: var(--text-link-large-font-family);\n font-style: var(--text-link-large-font-style);\n font-weight: var(--text-link-large-font-weight);\n font-size: var(--text-link-large-font-size);\n line-height: var(--text-link-large-line-height);\n color: var(--text-link-large-color);\n text-decoration: var(--text-link-large-text-decoration);\n letter-spacing: var(--text-link-large-letter-spacing);\n}\n._base_j4l26_356._sm-size_j4l26_400, ._base_j4l26_356._xs-size_j4l26_400 {\n --link-icon-size: var(--sizes-3);\n font-family: var(--text-link-small-font-family);\n font-style: var(--text-link-small-font-style);\n font-weight: var(--text-link-small-font-weight);\n font-size: var(--text-link-small-font-size);\n line-height: var(--text-link-small-line-height);\n color: var(--text-link-small-color);\n text-decoration: var(--text-link-small-text-decoration);\n letter-spacing: var(--text-link-small-letter-spacing);\n}\n._base_j4l26_356:hover {\n text-decoration-thickness: 2px;\n cursor: pointer;\n}\n._base_j4l26_356:focus-visible {\n outline: 0;\n box-shadow: 0 0 0 var(--sizes-xs) white, 0 0 0 var(--sizes-sm) var(--colors-secondary-blue-light);\n border-radius: var(--sizes-xs);\n}\n._base_j4l26_356._inherit-size_j4l26_420 {\n font-size: inherit;\n line-height: inherit;\n --link-icon-size: 1em;\n}");
4
- var linkStyles = {"heading-xxl":"_heading-xxl_j4l26_1","heading-xl":"_heading-xl_j4l26_12","heading-large":"_heading-large_j4l26_23","heading-medium":"_heading-medium_j4l26_34","heading-small":"_heading-small_j4l26_45","heading-table":"_heading-table_j4l26_56","subheading-large":"_subheading-large_j4l26_67","subheading-medium":"_subheading-medium_j4l26_78","subheading-small":"_subheading-small_j4l26_89","subheading-small-bold":"_subheading-small-bold_j4l26_100","body":"_body_j4l26_111","body-small":"_body-small_j4l26_122","body-bold":"_body-bold_j4l26_133","body-bold-dark":"_body-bold-dark_j4l26_144","body-small-bold":"_body-small-bold_j4l26_155","button":"_button_j4l26_166","button-small":"_button-small_j4l26_177","link-large":"_link-large_j4l26_188","link-medium":"_link-medium_j4l26_199","link":"_link_j4l26_188","link-small":"_link-small_j4l26_221","input-label":"_input-label_j4l26_232","input-label-small":"_input-label-small_j4l26_243","hint-text":"_hint-text_j4l26_254","placeholder":"_placeholder_j4l26_265","placeholder-small":"_placeholder-small_j4l26_276","placeholder-code":"_placeholder-code_j4l26_287","placeholder-code-small":"_placeholder-code-small_j4l26_298","error":"_error_j4l26_309","error-small":"_error-small_j4l26_320","success-small":"_success-small_j4l26_331","reset":"_reset_j4l26_342","base":"_base_j4l26_356","xl-size":"_xl-size_j4l26_389","sm-size":"_sm-size_j4l26_400","xs-size":"_xs-size_j4l26_400","inherit-size":"_inherit-size_j4l26_420"};
3
+ insertStyle("._heading-xxl_1rp50_1 {\n font-family: var(--text-heading-xxl-font-family);\n font-style: var(--text-heading-xxl-font-style);\n font-weight: var(--text-heading-xxl-font-weight);\n font-size: var(--text-heading-xxl-font-size);\n line-height: var(--text-heading-xxl-line-height);\n color: var(--text-heading-xxl-color);\n text-decoration: var(--text-heading-xxl-text-decoration);\n letter-spacing: var(--text-heading-xxl-letter-spacing);\n}\n\n._heading-xl_1rp50_12 {\n font-family: var(--text-heading-xl-font-family);\n font-style: var(--text-heading-xl-font-style);\n font-weight: var(--text-heading-xl-font-weight);\n font-size: var(--text-heading-xl-font-size);\n line-height: var(--text-heading-xl-line-height);\n color: var(--text-heading-xl-color);\n text-decoration: var(--text-heading-xl-text-decoration);\n letter-spacing: var(--text-heading-xl-letter-spacing);\n}\n\n._heading-large_1rp50_23 {\n font-family: var(--text-heading-large-font-family);\n font-style: var(--text-heading-large-font-style);\n font-weight: var(--text-heading-large-font-weight);\n font-size: var(--text-heading-large-font-size);\n line-height: var(--text-heading-large-line-height);\n color: var(--text-heading-large-color);\n text-decoration: var(--text-heading-large-text-decoration);\n letter-spacing: var(--text-heading-large-letter-spacing);\n}\n\n._heading-medium_1rp50_34 {\n font-family: var(--text-heading-medium-font-family);\n font-style: var(--text-heading-medium-font-style);\n font-weight: var(--text-heading-medium-font-weight);\n font-size: var(--text-heading-medium-font-size);\n line-height: var(--text-heading-medium-line-height);\n color: var(--text-heading-medium-color);\n text-decoration: var(--text-heading-medium-text-decoration);\n letter-spacing: var(--text-heading-medium-letter-spacing);\n}\n\n._heading-small_1rp50_45 {\n font-family: var(--text-heading-small-font-family);\n font-style: var(--text-heading-small-font-style);\n font-weight: var(--text-heading-small-font-weight);\n font-size: var(--text-heading-small-font-size);\n line-height: var(--text-heading-small-line-height);\n color: var(--text-heading-small-color);\n text-decoration: var(--text-heading-small-text-decoration);\n letter-spacing: var(--text-heading-small-letter-spacing);\n}\n\n._heading-table_1rp50_56 {\n font-family: var(--text-heading-table-font-family);\n font-style: var(--text-heading-table-font-style);\n font-weight: var(--text-heading-table-font-weight);\n font-size: var(--text-heading-table-font-size);\n line-height: var(--text-heading-table-line-height);\n color: var(--text-heading-table-color);\n text-decoration: var(--text-heading-table-text-decoration);\n letter-spacing: var(--text-heading-table-letter-spacing);\n}\n\n._subheading-large_1rp50_67 {\n font-family: var(--text-subheading-large-font-family);\n font-style: var(--text-subheading-large-font-style);\n font-weight: var(--text-subheading-large-font-weight);\n font-size: var(--text-subheading-large-font-size);\n line-height: var(--text-subheading-large-line-height);\n color: var(--text-subheading-large-color);\n text-decoration: var(--text-subheading-large-text-decoration);\n letter-spacing: var(--text-subheading-large-letter-spacing);\n}\n\n._subheading-medium_1rp50_78 {\n font-family: var(--text-subheading-medium-font-family);\n font-style: var(--text-subheading-medium-font-style);\n font-weight: var(--text-subheading-medium-font-weight);\n font-size: var(--text-subheading-medium-font-size);\n line-height: var(--text-subheading-medium-line-height);\n color: var(--text-subheading-medium-color);\n text-decoration: var(--text-subheading-medium-text-decoration);\n letter-spacing: var(--text-subheading-medium-letter-spacing);\n}\n\n._subheading-small_1rp50_89 {\n font-family: var(--text-subheading-small-font-family);\n font-style: var(--text-subheading-small-font-style);\n font-weight: var(--text-subheading-small-font-weight);\n font-size: var(--text-subheading-small-font-size);\n line-height: var(--text-subheading-small-line-height);\n color: var(--text-subheading-small-color);\n text-decoration: var(--text-subheading-small-text-decoration);\n letter-spacing: var(--text-subheading-small-letter-spacing);\n}\n\n._subheading-small-bold_1rp50_100 {\n font-family: var(--text-subheading-small-bold-font-family);\n font-style: var(--text-subheading-small-bold-font-style);\n font-weight: var(--text-subheading-small-bold-font-weight);\n font-size: var(--text-subheading-small-bold-font-size);\n line-height: var(--text-subheading-small-bold-line-height);\n color: var(--text-subheading-small-bold-color);\n text-decoration: var(--text-subheading-small-bold-text-decoration);\n letter-spacing: var(--text-subheading-small-bold-letter-spacing);\n}\n\n._body_1rp50_111 {\n font-family: var(--text-body-font-family);\n font-style: var(--text-body-font-style);\n font-weight: var(--text-body-font-weight);\n font-size: var(--text-body-font-size);\n line-height: var(--text-body-line-height);\n color: var(--text-body-color);\n text-decoration: var(--text-body-text-decoration);\n letter-spacing: var(--text-body-letter-spacing);\n}\n\n._body-small_1rp50_122 {\n font-family: var(--text-body-small-font-family);\n font-style: var(--text-body-small-font-style);\n font-weight: var(--text-body-small-font-weight);\n font-size: var(--text-body-small-font-size);\n line-height: var(--text-body-small-line-height);\n color: var(--text-body-small-color);\n text-decoration: var(--text-body-small-text-decoration);\n letter-spacing: var(--text-body-small-letter-spacing);\n}\n\n._body-bold_1rp50_133 {\n font-family: var(--text-body-bold-font-family);\n font-style: var(--text-body-bold-font-style);\n font-weight: var(--text-body-bold-font-weight);\n font-size: var(--text-body-bold-font-size);\n line-height: var(--text-body-bold-line-height);\n color: var(--text-body-bold-color);\n text-decoration: var(--text-body-bold-text-decoration);\n letter-spacing: var(--text-body-bold-letter-spacing);\n}\n\n._body-bold-dark_1rp50_144 {\n font-family: var(--text-body-bold-dark-font-family);\n font-style: var(--text-body-bold-dark-font-style);\n font-weight: var(--text-body-bold-dark-font-weight);\n font-size: var(--text-body-bold-dark-font-size);\n line-height: var(--text-body-bold-dark-line-height);\n color: var(--text-body-bold-dark-color);\n text-decoration: var(--text-body-bold-dark-text-decoration);\n letter-spacing: var(--text-body-bold-dark-letter-spacing);\n}\n\n._body-small-bold_1rp50_155 {\n font-family: var(--text-body-small-bold-font-family);\n font-style: var(--text-body-small-bold-font-style);\n font-weight: var(--text-body-small-bold-font-weight);\n font-size: var(--text-body-small-bold-font-size);\n line-height: var(--text-body-small-bold-line-height);\n color: var(--text-body-small-bold-color);\n text-decoration: var(--text-body-small-bold-text-decoration);\n letter-spacing: var(--text-body-small-bold-letter-spacing);\n}\n\n._button_1rp50_166 {\n font-family: var(--text-button-font-family);\n font-style: var(--text-button-font-style);\n font-weight: var(--text-button-font-weight);\n font-size: var(--text-button-font-size);\n line-height: var(--text-button-line-height);\n color: var(--text-button-color);\n text-decoration: var(--text-button-text-decoration);\n letter-spacing: var(--text-button-letter-spacing);\n}\n\n._button-small_1rp50_177 {\n font-family: var(--text-button-small-font-family);\n font-style: var(--text-button-small-font-style);\n font-weight: var(--text-button-small-font-weight);\n font-size: var(--text-button-small-font-size);\n line-height: var(--text-button-small-line-height);\n color: var(--text-button-small-color);\n text-decoration: var(--text-button-small-text-decoration);\n letter-spacing: var(--text-button-small-letter-spacing);\n}\n\n._link-large_1rp50_188 {\n font-family: var(--text-link-large-font-family);\n font-style: var(--text-link-large-font-style);\n font-weight: var(--text-link-large-font-weight);\n font-size: var(--text-link-large-font-size);\n line-height: var(--text-link-large-line-height);\n color: var(--text-link-large-color);\n text-decoration: var(--text-link-large-text-decoration);\n letter-spacing: var(--text-link-large-letter-spacing);\n}\n\n._link-medium_1rp50_199 {\n font-family: var(--text-link-medium-font-family);\n font-style: var(--text-link-medium-font-style);\n font-weight: var(--text-link-medium-font-weight);\n font-size: var(--text-link-medium-font-size);\n line-height: var(--text-link-medium-line-height);\n color: var(--text-link-medium-color);\n text-decoration: var(--text-link-medium-text-decoration);\n letter-spacing: var(--text-link-medium-letter-spacing);\n}\n\n._link_1rp50_188 {\n font-family: var(--text-link-font-family);\n font-style: var(--text-link-font-style);\n font-weight: var(--text-link-font-weight);\n font-size: var(--text-link-font-size);\n line-height: var(--text-link-line-height);\n color: var(--text-link-color);\n text-decoration: var(--text-link-text-decoration);\n letter-spacing: var(--text-link-letter-spacing);\n}\n\n._link-small_1rp50_221 {\n font-family: var(--text-link-small-font-family);\n font-style: var(--text-link-small-font-style);\n font-weight: var(--text-link-small-font-weight);\n font-size: var(--text-link-small-font-size);\n line-height: var(--text-link-small-line-height);\n color: var(--text-link-small-color);\n text-decoration: var(--text-link-small-text-decoration);\n letter-spacing: var(--text-link-small-letter-spacing);\n}\n\n._input-label_1rp50_232 {\n font-family: var(--text-input-label-font-family);\n font-style: var(--text-input-label-font-style);\n font-weight: var(--text-input-label-font-weight);\n font-size: var(--text-input-label-font-size);\n line-height: var(--text-input-label-line-height);\n color: var(--text-input-label-color);\n text-decoration: var(--text-input-label-text-decoration);\n letter-spacing: var(--text-input-label-letter-spacing);\n}\n\n._input-label-small_1rp50_243 {\n font-family: var(--text-input-label-small-font-family);\n font-style: var(--text-input-label-small-font-style);\n font-weight: var(--text-input-label-small-font-weight);\n font-size: var(--text-input-label-small-font-size);\n line-height: var(--text-input-label-small-line-height);\n color: var(--text-input-label-small-color);\n text-decoration: var(--text-input-label-small-text-decoration);\n letter-spacing: var(--text-input-label-small-letter-spacing);\n}\n\n._hint-text_1rp50_254 {\n font-family: var(--text-hint-text-font-family);\n font-style: var(--text-hint-text-font-style);\n font-weight: var(--text-hint-text-font-weight);\n font-size: var(--text-hint-text-font-size);\n line-height: var(--text-hint-text-line-height);\n color: var(--text-hint-text-color);\n text-decoration: var(--text-hint-text-text-decoration);\n letter-spacing: var(--text-hint-text-letter-spacing);\n}\n\n._placeholder_1rp50_265 {\n font-family: var(--text-placeholder-font-family);\n font-style: var(--text-placeholder-font-style);\n font-weight: var(--text-placeholder-font-weight);\n font-size: var(--text-placeholder-font-size);\n line-height: var(--text-placeholder-line-height);\n color: var(--text-placeholder-color);\n text-decoration: var(--text-placeholder-text-decoration);\n letter-spacing: var(--text-placeholder-letter-spacing);\n}\n\n._placeholder-small_1rp50_276 {\n font-family: var(--text-placeholder-small-font-family);\n font-style: var(--text-placeholder-small-font-style);\n font-weight: var(--text-placeholder-small-font-weight);\n font-size: var(--text-placeholder-small-font-size);\n line-height: var(--text-placeholder-small-line-height);\n color: var(--text-placeholder-small-color);\n text-decoration: var(--text-placeholder-small-text-decoration);\n letter-spacing: var(--text-placeholder-small-letter-spacing);\n}\n\n._placeholder-code_1rp50_287 {\n font-family: var(--text-placeholder-code-font-family);\n font-style: var(--text-placeholder-code-font-style);\n font-weight: var(--text-placeholder-code-font-weight);\n font-size: var(--text-placeholder-code-font-size);\n line-height: var(--text-placeholder-code-line-height);\n color: var(--text-placeholder-code-color);\n text-decoration: var(--text-placeholder-code-text-decoration);\n letter-spacing: var(--text-placeholder-code-letter-spacing);\n}\n\n._placeholder-code-small_1rp50_298 {\n font-family: var(--text-placeholder-code-small-font-family);\n font-style: var(--text-placeholder-code-small-font-style);\n font-weight: var(--text-placeholder-code-small-font-weight);\n font-size: var(--text-placeholder-code-small-font-size);\n line-height: var(--text-placeholder-code-small-line-height);\n color: var(--text-placeholder-code-small-color);\n text-decoration: var(--text-placeholder-code-small-text-decoration);\n letter-spacing: var(--text-placeholder-code-small-letter-spacing);\n}\n\n._error_1rp50_309 {\n font-family: var(--text-error-font-family);\n font-style: var(--text-error-font-style);\n font-weight: var(--text-error-font-weight);\n font-size: var(--text-error-font-size);\n line-height: var(--text-error-line-height);\n color: var(--text-error-color);\n text-decoration: var(--text-error-text-decoration);\n letter-spacing: var(--text-error-letter-spacing);\n}\n\n._error-small_1rp50_320 {\n font-family: var(--text-error-small-font-family);\n font-style: var(--text-error-small-font-style);\n font-weight: var(--text-error-small-font-weight);\n font-size: var(--text-error-small-font-size);\n line-height: var(--text-error-small-line-height);\n color: var(--text-error-small-color);\n text-decoration: var(--text-error-small-text-decoration);\n letter-spacing: var(--text-error-small-letter-spacing);\n}\n\n._success-small_1rp50_331 {\n font-family: var(--text-success-small-font-family);\n font-style: var(--text-success-small-font-style);\n font-weight: var(--text-success-small-font-weight);\n font-size: var(--text-success-small-font-size);\n line-height: var(--text-success-small-line-height);\n color: var(--text-success-small-color);\n text-decoration: var(--text-success-small-text-decoration);\n letter-spacing: var(--text-success-small-letter-spacing);\n}\n\n._reset_1rp50_342 {\n appearance: none;\n border: 0;\n background-color: transparent;\n padding: unset;\n font: inherit;\n text-decoration: none;\n text-align: start;\n color: inherit;\n}\n._reset_1rp50_342:hover {\n cursor: pointer;\n}\n\n._base_1rp50_356 {\n --link-icon-size: var(--sizes-base);\n --line-thickness: 2.5px;\n appearance: none;\n border: 0;\n background-color: transparent;\n padding: unset;\n font: inherit;\n text-decoration: none;\n text-align: start;\n color: inherit;\n font-family: var(--text-link-medium-font-family);\n font-style: var(--text-link-medium-font-style);\n font-weight: var(--text-link-medium-font-weight);\n font-size: var(--text-link-medium-font-size);\n line-height: var(--text-link-medium-line-height);\n color: var(--text-link-medium-color);\n text-decoration: var(--text-link-medium-text-decoration);\n letter-spacing: var(--text-link-medium-letter-spacing);\n display: inline-flex;\n align-items: center;\n gap: var(--radius-sm);\n color: var(--colors-secondary-blue-base);\n text-decoration-line: underline;\n text-decoration-style: solid;\n}\n._base_1rp50_356:hover {\n cursor: pointer;\n}\n._base_1rp50_356 svg {\n width: var(--link-icon-size);\n height: var(--link-icon-size);\n vertical-align: middle;\n flex-shrink: 0;\n}\n._base_1rp50_356._xl-size_1rp50_391 {\n --link-icon-size: var(--sizes-5);\n --line-thickness: 3px;\n font-family: var(--text-link-large-font-family);\n font-style: var(--text-link-large-font-style);\n font-weight: var(--text-link-large-font-weight);\n font-size: var(--text-link-large-font-size);\n line-height: var(--text-link-large-line-height);\n color: var(--text-link-large-color);\n text-decoration: var(--text-link-large-text-decoration);\n letter-spacing: var(--text-link-large-letter-spacing);\n}\n._base_1rp50_356._sm-size_1rp50_403 {\n --link-icon-size: var(--sizes-4);\n --line-thickness: 2px;\n font-family: var(--text-link-font-family);\n font-style: var(--text-link-font-style);\n font-weight: var(--text-link-font-weight);\n font-size: var(--text-link-font-size);\n line-height: var(--text-link-line-height);\n color: var(--text-link-color);\n text-decoration: var(--text-link-text-decoration);\n letter-spacing: var(--text-link-letter-spacing);\n}\n._base_1rp50_356._xs-size_1rp50_415 {\n --link-icon-size: var(--sizes-3);\n --line-thickness: 1.5px;\n font-family: var(--text-link-small-font-family);\n font-style: var(--text-link-small-font-style);\n font-weight: var(--text-link-small-font-weight);\n font-size: var(--text-link-small-font-size);\n line-height: var(--text-link-small-line-height);\n color: var(--text-link-small-color);\n text-decoration: var(--text-link-small-text-decoration);\n letter-spacing: var(--text-link-small-letter-spacing);\n}\n._base_1rp50_356:hover {\n text-decoration-thickness: var(--line-thickness);\n cursor: pointer;\n}\n._base_1rp50_356:focus-visible {\n text-decoration-thickness: var(--line-thickness);\n outline: 0;\n box-shadow: 0 0 0 var(--sizes-xs) white, 0 0 0 var(--sizes-sm) var(--colors-secondary-blue-light);\n border-radius: var(--sizes-xs);\n}\n._base_1rp50_356._inherit-size_1rp50_437 {\n font-size: inherit;\n line-height: inherit;\n --link-icon-size: 1em;\n --line-thickness: 0.15em;\n}");
4
+ var linkStyles = {"heading-xxl":"_heading-xxl_1rp50_1","heading-xl":"_heading-xl_1rp50_12","heading-large":"_heading-large_1rp50_23","heading-medium":"_heading-medium_1rp50_34","heading-small":"_heading-small_1rp50_45","heading-table":"_heading-table_1rp50_56","subheading-large":"_subheading-large_1rp50_67","subheading-medium":"_subheading-medium_1rp50_78","subheading-small":"_subheading-small_1rp50_89","subheading-small-bold":"_subheading-small-bold_1rp50_100","body":"_body_1rp50_111","body-small":"_body-small_1rp50_122","body-bold":"_body-bold_1rp50_133","body-bold-dark":"_body-bold-dark_1rp50_144","body-small-bold":"_body-small-bold_1rp50_155","button":"_button_1rp50_166","button-small":"_button-small_1rp50_177","link-large":"_link-large_1rp50_188","link-medium":"_link-medium_1rp50_199","link":"_link_1rp50_188","link-small":"_link-small_1rp50_221","input-label":"_input-label_1rp50_232","input-label-small":"_input-label-small_1rp50_243","hint-text":"_hint-text_1rp50_254","placeholder":"_placeholder_1rp50_265","placeholder-small":"_placeholder-small_1rp50_276","placeholder-code":"_placeholder-code_1rp50_287","placeholder-code-small":"_placeholder-code-small_1rp50_298","error":"_error_1rp50_309","error-small":"_error-small_1rp50_320","success-small":"_success-small_1rp50_331","reset":"_reset_1rp50_342","base":"_base_1rp50_356","xl-size":"_xl-size_1rp50_391","sm-size":"_sm-size_1rp50_403","xs-size":"_xs-size_1rp50_415","inherit-size":"_inherit-size_1rp50_437"};
5
5
 
6
6
  export { linkStyles as default };
7
7
  //# sourceMappingURL=link.module.scss.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"link.module.scss.js","sources":["../../../../src/components/Action/styles/link.module.scss"],"sourcesContent":["@use '../../../theme/scss/text.module.scss' as text;\n@use '../styles/reset.module.scss' as reset;\n\n.base {\n --link-icon-size: var(--sizes-base);\n\n @include reset.reset;\n @include text.link;\n display: inline-flex;\n align-items: center;\n gap: var(--radius-sm);\n\n color: var(--colors-secondary-blue-base);\n text-decoration: underline;\n & svg {\n width: var(--link-icon-size);\n height: var(--link-icon-size);\n vertical-align: middle;\n flex-shrink: 0;\n }\n\n &.xl-size {\n --link-icon-size: var(--sizes-5);\n\n @include text.link-large;\n }\n\n &.sm-size,\n &.xs-size {\n --link-icon-size: var(--sizes-3);\n\n @include text.link-small;\n }\n\n &:hover {\n text-decoration-thickness: 2px;\n cursor: pointer;\n }\n\n &:focus-visible {\n outline: 0;\n box-shadow:\n 0 0 0 var(--sizes-xs) white,\n 0 0 0 var(--sizes-sm) var(--colors-secondary-blue-light);\n border-radius: var(--sizes-xs);\n }\n &.inherit-size {\n font-size: inherit;\n line-height: inherit;\n\n --link-icon-size: 1em;\n }\n}\n"],"names":["___$insertStyle"],"mappings":";;AAGEA,WAAA,CAAA,okhBAAA;AACA,iBAAA,CAAA,aAAA,CAAA,sBAAA,CAAA,YAAA,CAAA,sBAAA,CAAA,eAAA,CAAA,yBAAA,CAAA,gBAAA,CAAA,0BAAA,CAAA,eAAA,CAAA,yBAAA,CAAA,eAAA,CAAA,yBAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,mBAAA,CAAA,6BAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,uBAAA,CAAA,kCAAA,CAAA,MAAA,CAAA,iBAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,WAAA,CAAA,sBAAA,CAAA,gBAAA,CAAA,2BAAA,CAAA,iBAAA,CAAA,4BAAA,CAAA,QAAA,CAAA,mBAAA,CAAA,cAAA,CAAA,yBAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,MAAA,CAAA,iBAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,mBAAA,CAAA,8BAAA,CAAA,WAAA,CAAA,sBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,mBAAA,CAAA,8BAAA,CAAA,kBAAA,CAAA,6BAAA,CAAA,wBAAA,CAAA,mCAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,eAAA,CAAA,0BAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,MAAA,CAAA,iBAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,cAAA,CAAA,yBAAA;;;;"}
1
+ {"version":3,"file":"link.module.scss.js","sources":["../../../../src/components/Action/styles/link.module.scss"],"sourcesContent":["@use '../../../theme/scss/text.module.scss' as text;\n@use '../styles/reset.module.scss' as reset;\n\n.base {\n --link-icon-size: var(--sizes-base);\n --line-thickness: 2.5px;\n\n @include reset.reset;\n @include text.link-medium;\n display: inline-flex;\n align-items: center;\n gap: var(--radius-sm);\n\n color: var(--colors-secondary-blue-base);\n text-decoration-line: underline;\n text-decoration-style: solid;\n & svg {\n width: var(--link-icon-size);\n height: var(--link-icon-size);\n vertical-align: middle;\n flex-shrink: 0;\n }\n\n &.xl-size {\n --link-icon-size: var(--sizes-5);\n --line-thickness: 3px;\n\n @include text.link-large;\n }\n\n &.sm-size {\n --link-icon-size: var(--sizes-4);\n --line-thickness: 2px;\n\n @include text.link;\n }\n\n &.xs-size {\n --link-icon-size: var(--sizes-3);\n --line-thickness: 1.5px;\n\n @include text.link-small;\n }\n\n &:hover {\n text-decoration-thickness: var(--line-thickness);\n cursor: pointer;\n }\n\n &:focus-visible {\n text-decoration-thickness: var(--line-thickness);\n outline: 0;\n box-shadow:\n 0 0 0 var(--sizes-xs) white,\n 0 0 0 var(--sizes-sm) var(--colors-secondary-blue-light);\n border-radius: var(--sizes-xs);\n }\n &.inherit-size {\n font-size: inherit;\n line-height: inherit;\n\n --link-icon-size: 1em;\n --line-thickness: 0.15em;\n }\n}\n"],"names":["___$insertStyle"],"mappings":";;AAGEA,WAAA,CAAA,wwiBAAA;AACA,iBAAA,CAAA,aAAA,CAAA,sBAAA,CAAA,YAAA,CAAA,sBAAA,CAAA,eAAA,CAAA,yBAAA,CAAA,gBAAA,CAAA,0BAAA,CAAA,eAAA,CAAA,yBAAA,CAAA,eAAA,CAAA,yBAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,mBAAA,CAAA,6BAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,uBAAA,CAAA,kCAAA,CAAA,MAAA,CAAA,iBAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,WAAA,CAAA,sBAAA,CAAA,gBAAA,CAAA,2BAAA,CAAA,iBAAA,CAAA,4BAAA,CAAA,QAAA,CAAA,mBAAA,CAAA,cAAA,CAAA,yBAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,MAAA,CAAA,iBAAA,CAAA,YAAA,CAAA,uBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,mBAAA,CAAA,8BAAA,CAAA,WAAA,CAAA,sBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,mBAAA,CAAA,8BAAA,CAAA,kBAAA,CAAA,6BAAA,CAAA,wBAAA,CAAA,mCAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,eAAA,CAAA,0BAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,MAAA,CAAA,iBAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,cAAA,CAAA,yBAAA;;;;"}
@@ -1,24 +1,40 @@
1
1
  import { ReactElement } from 'react';
2
2
  import { TextFieldProps } from '../TextField';
3
3
  export type PhoneOption = {
4
+ /** Unique identifier for the phone option */
4
5
  id: string;
6
+ /** Display label for the phone option */
5
7
  label: string;
8
+ /** Additional info slot element */
6
9
  itemInfoSlot: ReactElement;
10
+ /** Whether to disable selection rendering */
7
11
  shouldDisableSelectionRender: boolean;
12
+ /** Media slot element (typically flag icon) */
8
13
  mediaSlot: ReactElement;
9
14
  };
10
15
  export type InternationalCode = {
16
+ /** Country code (e.g., "US", "GB", "FR") */
11
17
  countryCode: string;
18
+ /** Full country name */
12
19
  country: string;
20
+ /** Country flag asset identifier used to resolve the flag SVG URL */
13
21
  countryFlag: string;
22
+ /** Expected phone number length for this country */
14
23
  length: number;
15
24
  };
25
+ /** Props for the PhoneInput component */
16
26
  export type PhoneInputProps = TextFieldProps & {
27
+ /** Phone number value including country code */
17
28
  value?: string;
29
+ /** Callback fired when phone number changes */
18
30
  onChange?: (value: string) => void;
31
+ /** Whether the input has validation errors */
19
32
  hasError?: boolean;
33
+ /** Whether the input is disabled */
20
34
  disabled?: boolean;
35
+ /** Error message to display */
21
36
  error?: string;
37
+ /** Additional CSS class name */
22
38
  className?: string;
23
39
  };
24
40
  export type PhoneOptions = PhoneOption[];
@@ -1,12 +1,22 @@
1
1
  import { ComponentSizeType } from '../types';
2
+ /** Base props for the PriceInput component */
2
3
  export interface PriceInputProps {
4
+ /** Additional CSS class name */
3
5
  className?: string;
6
+ /** Whether the input is disabled and non-interactive */
4
7
  disabled?: boolean;
8
+ /** Size of the input field */
5
9
  size?: ComponentSizeType;
10
+ /** Currency symbol displayed as prefix */
6
11
  currency: string;
12
+ /** Step value for increment/decrement buttons */
7
13
  step?: string;
14
+ /** Whether the input has validation errors */
8
15
  hasError?: boolean;
16
+ /** Current price value as string */
9
17
  priceValue: string;
18
+ /** Callback fired when the input value changes */
10
19
  onChange: (value: string) => void;
20
+ /** Callback fired when the price value changes */
11
21
  onPriceChange: (value: string) => void;
12
22
  }
@@ -1,8 +1,13 @@
1
1
  import { SyntheticEvent } from 'react';
2
2
  import { TextFieldProps } from '../TextField/types';
3
+ /** Props for the Search component */
3
4
  export type SearchProps = TextFieldProps & {
5
+ /** Whether to show loading spinner instead of search icon */
4
6
  isLoading?: boolean;
7
+ /** Fill color for the search/clear icon and loading spinner */
5
8
  fill?: string;
9
+ /** Callback fired when the clear button is clicked */
6
10
  onClearClick?: (event: SyntheticEvent) => void;
11
+ /** Whether to position the search icon on the left side */
7
12
  reversed?: boolean;
8
13
  };
@@ -1 +1 @@
1
- {"version":3,"file":"withLabels.cjs","sources":["../../../src/hoc/withLabels/withLabels.tsx"],"sourcesContent":["import React, { ComponentType, forwardRef, ReactNode } from 'react';\n\nimport { FlexCol } from '../../components/Flex/FlexCol';\nimport { FlexRow } from '../../components/Flex/FlexRow';\nimport { MiniAlert } from '../../components/Alerts/MiniAlert';\nimport { Text } from '../../components/Text';\nimport { useId } from '../../hooks/useId';\nimport { HelpIcon } from '../../icons';\nimport { theme } from '../../theme';\n\nimport { BlockTooltip } from './BlockTooltip';\nimport styles from './withLabels.module.scss';\n\nexport interface WithLabelsProps {\n id?: string;\n label?: ReactNode;\n hint?: ReactNode;\n error?: ReactNode;\n disabledMessage?: ReactNode;\n tooltip?: string;\n tooltipContent?: ReactNode;\n}\n\n// eslint-disable-next-line @typescript-eslint/comma-dangle -- comma is required so TS knows this is a generic, not JSX\nexport const withLabels = <P, R = unknown>(Component: ComponentType<P>) => {\n const ComponentWithLabels = forwardRef<R, P & WithLabelsProps>(\n ({ label, hint, error, disabledMessage, tooltip, tooltipContent, id, ...otherProps }, ref) => {\n const componentId = useId({ id, prefix: Component.name });\n\n if (!label)\n return (\n <Component\n ref={ref}\n id={componentId}\n hasError={!!error}\n disabled={!!disabledMessage}\n disabledMessage={disabledMessage}\n {...(otherProps as P)}\n />\n );\n\n return (\n <FlexCol className={styles.rootStack}>\n <FlexRow>\n <Text variant=\"inputLabel\" id={`${componentId}-label`} htmlFor={componentId}>\n {label}\n </Text>\n {(tooltip || tooltipContent) && (\n <BlockTooltip text={tooltip} content={tooltipContent}>\n <HelpIcon\n data-testid=\"tooltip-help\"\n width={theme.sizes.base}\n height={theme.sizes.base}\n color={theme.colors.neutral.ink.light}\n />\n </BlockTooltip>\n )}\n </FlexRow>\n {hint && (\n <Text variant=\"hintText\" as=\"span\" className={styles.hint} id={`${componentId}-hint`}>\n {hint}\n </Text>\n )}\n <Component\n ref={ref}\n id={componentId}\n hasError={!!error}\n disabled={!!disabledMessage}\n disabledMessage={disabledMessage}\n {...(otherProps as P)}\n />\n {error && (\n <MiniAlert\n id={`${componentId}-error`}\n variant=\"error\"\n isBold={false}\n role=\"alert\"\n title={error}\n />\n )}\n {disabledMessage && (\n <MiniAlert\n id={`${componentId}-disabled`}\n isBold={false}\n title={disabledMessage}\n />\n )}\n </FlexCol>\n );\n },\n );\n\n ComponentWithLabels.displayName = `withLabels(${Component.displayName || Component.name || 'Component'})`;\n\n return ComponentWithLabels;\n};\n"],"names":["forwardRef","useId","React","FlexCol","styles","FlexRow","Text","BlockTooltip","HelpIcon","theme","MiniAlert"],"mappings":";;;;;;;;;;;;;;;;;AAuBA;AACO,MAAM,UAAU,GAAG,CAAiB,SAA2B,KAAI;IACxE,MAAM,mBAAmB,GAAGA,gBAAU,CACpC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,eAAe,EAAE,OAAO,EAAE,cAAc,EAAE,EAAE,EAAE,GAAG,UAAU,EAAE,EAAE,GAAG,KAAI;AAC3F,QAAA,MAAM,WAAW,GAAGC,WAAK,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,CAAC,IAAI,EAAE,CAAC;AAEzD,QAAA,IAAI,CAAC,KAAK;AACR,YAAA,QACEC,sBAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EACR,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,WAAW,EACf,QAAQ,EAAE,CAAC,CAAC,KAAK,EACjB,QAAQ,EAAE,CAAC,CAAC,eAAe,EAC3B,eAAe,EAAE,eAAe,EAAA,GAC3B,UAAgB,EAAA,CACrB;QAGN,QACEA,qCAACC,eAAO,EAAA,EAAC,SAAS,EAAEC,iBAAM,CAAC,SAAS,EAAA;AAClC,YAAAF,sBAAA,CAAA,aAAA,CAACG,eAAO,EAAA,IAAA;AACN,gBAAAH,sBAAA,CAAA,aAAA,CAACI,SAAI,EAAA,EAAC,OAAO,EAAC,YAAY,EAAC,EAAE,EAAE,CAAA,EAAG,WAAW,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAA,EACxE,KAAK,CACD;AACN,gBAAA,CAAC,OAAO,IAAI,cAAc,MACzBJ,sBAAA,CAAA,aAAA,CAACK,yBAAY,EAAA,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,cAAc,EAAA;AAClD,oBAAAL,sBAAA,CAAA,aAAA,CAACM,uBAAQ,EAAA,EAAA,aAAA,EACK,cAAc,EAC1B,KAAK,EAAEC,WAAK,CAAC,KAAK,CAAC,IAAI,EACvB,MAAM,EAAEA,WAAK,CAAC,KAAK,CAAC,IAAI,EACxB,KAAK,EAAEA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,EAAA,CACrC,CACW,CAChB,CACO;YACT,IAAI,KACHP,sBAAA,CAAA,aAAA,CAACI,SAAI,EAAA,EAAC,OAAO,EAAC,UAAU,EAAC,EAAE,EAAC,MAAM,EAAC,SAAS,EAAEF,iBAAM,CAAC,IAAI,EAAE,EAAE,EAAE,CAAA,EAAG,WAAW,CAAA,KAAA,CAAO,EAAA,EACjF,IAAI,CACA,CACR;YACDF,sBAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EACR,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,WAAW,EACf,QAAQ,EAAE,CAAC,CAAC,KAAK,EACjB,QAAQ,EAAE,CAAC,CAAC,eAAe,EAC3B,eAAe,EAAE,eAAe,EAAA,GAC3B,UAAgB,EAAA,CACrB;YACD,KAAK,KACJA,sBAAA,CAAA,aAAA,CAACQ,mBAAS,EAAA,EACR,EAAE,EAAE,CAAA,EAAG,WAAW,CAAA,MAAA,CAAQ,EAC1B,OAAO,EAAC,OAAO,EACf,MAAM,EAAE,KAAK,EACb,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,KAAK,EAAA,CACZ,CACH;YACA,eAAe,KACdR,sBAAA,CAAA,aAAA,CAACQ,mBAAS,IACR,EAAE,EAAE,CAAA,EAAG,WAAW,CAAA,SAAA,CAAW,EAC7B,MAAM,EAAE,KAAK,EACb,KAAK,EAAE,eAAe,EAAA,CACtB,CACH,CACO;AAEd,IAAA,CAAC,CACF;AAED,IAAA,mBAAmB,CAAC,WAAW,GAAG,CAAA,WAAA,EAAc,SAAS,CAAC,WAAW,IAAI,SAAS,CAAC,IAAI,IAAI,WAAW,GAAG;AAEzG,IAAA,OAAO,mBAAmB;AAC5B;;;;"}
1
+ {"version":3,"file":"withLabels.cjs","sources":["../../../src/hoc/withLabels/withLabels.tsx"],"sourcesContent":["import React, { ComponentType, forwardRef, ReactNode } from 'react';\n\nimport { FlexCol } from '../../components/Flex/FlexCol';\nimport { FlexRow } from '../../components/Flex/FlexRow';\nimport { MiniAlert } from '../../components/Alerts/MiniAlert';\nimport { Text } from '../../components/Text';\nimport { useId } from '../../hooks/useId';\nimport { HelpIcon } from '../../icons';\nimport { theme } from '../../theme';\n\nimport { BlockTooltip } from './BlockTooltip';\nimport styles from './withLabels.module.scss';\n\nexport interface WithLabelsProps {\n /** Unique identifier for the component */\n id?: string;\n /** Label text displayed above the component */\n label?: ReactNode;\n /** Hint text displayed below the component for additional context */\n hint?: ReactNode;\n /** Error message displayed when validation fails */\n error?: ReactNode;\n /** Message displayed when the component is disabled */\n disabledMessage?: ReactNode;\n /** Tooltip text displayed on hover via help icon */\n tooltip?: string;\n /** Custom rich content for tooltip (ReactNode) */\n tooltipContent?: ReactNode;\n}\n\n// eslint-disable-next-line @typescript-eslint/comma-dangle -- comma is required so TS knows this is a generic, not JSX\nexport const withLabels = <P, R = unknown>(Component: ComponentType<P>) => {\n const ComponentWithLabels = forwardRef<R, P & WithLabelsProps>(\n ({ label, hint, error, disabledMessage, tooltip, tooltipContent, id, ...otherProps }, ref) => {\n const componentId = useId({ id, prefix: Component.name });\n\n if (!label)\n return (\n <Component\n ref={ref}\n id={componentId}\n hasError={!!error}\n disabled={!!disabledMessage}\n disabledMessage={disabledMessage}\n {...(otherProps as P)}\n />\n );\n\n return (\n <FlexCol className={styles.rootStack}>\n <FlexRow>\n <Text variant=\"inputLabel\" id={`${componentId}-label`} htmlFor={componentId}>\n {label}\n </Text>\n {(tooltip || tooltipContent) && (\n <BlockTooltip text={tooltip} content={tooltipContent}>\n <HelpIcon\n data-testid=\"tooltip-help\"\n width={theme.sizes.base}\n height={theme.sizes.base}\n color={theme.colors.neutral.ink.light}\n />\n </BlockTooltip>\n )}\n </FlexRow>\n {hint && (\n <Text variant=\"hintText\" as=\"span\" className={styles.hint} id={`${componentId}-hint`}>\n {hint}\n </Text>\n )}\n <Component\n ref={ref}\n id={componentId}\n hasError={!!error}\n disabled={!!disabledMessage}\n disabledMessage={disabledMessage}\n {...(otherProps as P)}\n />\n {error && (\n <MiniAlert\n id={`${componentId}-error`}\n variant=\"error\"\n isBold={false}\n role=\"alert\"\n title={error}\n />\n )}\n {disabledMessage && (\n <MiniAlert\n id={`${componentId}-disabled`}\n isBold={false}\n title={disabledMessage}\n />\n )}\n </FlexCol>\n );\n },\n );\n\n ComponentWithLabels.displayName = `withLabels(${Component.displayName || Component.name || 'Component'})`;\n\n return ComponentWithLabels;\n};\n"],"names":["forwardRef","useId","React","FlexCol","styles","FlexRow","Text","BlockTooltip","HelpIcon","theme","MiniAlert"],"mappings":";;;;;;;;;;;;;;;;;AA8BA;AACO,MAAM,UAAU,GAAG,CAAiB,SAA2B,KAAI;IACxE,MAAM,mBAAmB,GAAGA,gBAAU,CACpC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,eAAe,EAAE,OAAO,EAAE,cAAc,EAAE,EAAE,EAAE,GAAG,UAAU,EAAE,EAAE,GAAG,KAAI;AAC3F,QAAA,MAAM,WAAW,GAAGC,WAAK,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,CAAC,IAAI,EAAE,CAAC;AAEzD,QAAA,IAAI,CAAC,KAAK;AACR,YAAA,QACEC,sBAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EACR,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,WAAW,EACf,QAAQ,EAAE,CAAC,CAAC,KAAK,EACjB,QAAQ,EAAE,CAAC,CAAC,eAAe,EAC3B,eAAe,EAAE,eAAe,EAAA,GAC3B,UAAgB,EAAA,CACrB;QAGN,QACEA,qCAACC,eAAO,EAAA,EAAC,SAAS,EAAEC,iBAAM,CAAC,SAAS,EAAA;AAClC,YAAAF,sBAAA,CAAA,aAAA,CAACG,eAAO,EAAA,IAAA;AACN,gBAAAH,sBAAA,CAAA,aAAA,CAACI,SAAI,EAAA,EAAC,OAAO,EAAC,YAAY,EAAC,EAAE,EAAE,CAAA,EAAG,WAAW,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAA,EACxE,KAAK,CACD;AACN,gBAAA,CAAC,OAAO,IAAI,cAAc,MACzBJ,sBAAA,CAAA,aAAA,CAACK,yBAAY,EAAA,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,cAAc,EAAA;AAClD,oBAAAL,sBAAA,CAAA,aAAA,CAACM,uBAAQ,EAAA,EAAA,aAAA,EACK,cAAc,EAC1B,KAAK,EAAEC,WAAK,CAAC,KAAK,CAAC,IAAI,EACvB,MAAM,EAAEA,WAAK,CAAC,KAAK,CAAC,IAAI,EACxB,KAAK,EAAEA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,EAAA,CACrC,CACW,CAChB,CACO;YACT,IAAI,KACHP,sBAAA,CAAA,aAAA,CAACI,SAAI,EAAA,EAAC,OAAO,EAAC,UAAU,EAAC,EAAE,EAAC,MAAM,EAAC,SAAS,EAAEF,iBAAM,CAAC,IAAI,EAAE,EAAE,EAAE,CAAA,EAAG,WAAW,CAAA,KAAA,CAAO,EAAA,EACjF,IAAI,CACA,CACR;YACDF,sBAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EACR,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,WAAW,EACf,QAAQ,EAAE,CAAC,CAAC,KAAK,EACjB,QAAQ,EAAE,CAAC,CAAC,eAAe,EAC3B,eAAe,EAAE,eAAe,EAAA,GAC3B,UAAgB,EAAA,CACrB;YACD,KAAK,KACJA,sBAAA,CAAA,aAAA,CAACQ,mBAAS,EAAA,EACR,EAAE,EAAE,CAAA,EAAG,WAAW,CAAA,MAAA,CAAQ,EAC1B,OAAO,EAAC,OAAO,EACf,MAAM,EAAE,KAAK,EACb,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,KAAK,EAAA,CACZ,CACH;YACA,eAAe,KACdR,sBAAA,CAAA,aAAA,CAACQ,mBAAS,IACR,EAAE,EAAE,CAAA,EAAG,WAAW,CAAA,SAAA,CAAW,EAC7B,MAAM,EAAE,KAAK,EACb,KAAK,EAAE,eAAe,EAAA,CACtB,CACH,CACO;AAEd,IAAA,CAAC,CACF;AAED,IAAA,mBAAmB,CAAC,WAAW,GAAG,CAAA,WAAA,EAAc,SAAS,CAAC,WAAW,IAAI,SAAS,CAAC,IAAI,IAAI,WAAW,GAAG;AAEzG,IAAA,OAAO,mBAAmB;AAC5B;;;;"}
@@ -1,11 +1,18 @@
1
1
  import React, { ComponentType, ReactNode } from 'react';
2
2
  export interface WithLabelsProps {
3
+ /** Unique identifier for the component */
3
4
  id?: string;
5
+ /** Label text displayed above the component */
4
6
  label?: ReactNode;
7
+ /** Hint text displayed below the component for additional context */
5
8
  hint?: ReactNode;
9
+ /** Error message displayed when validation fails */
6
10
  error?: ReactNode;
11
+ /** Message displayed when the component is disabled */
7
12
  disabledMessage?: ReactNode;
13
+ /** Tooltip text displayed on hover via help icon */
8
14
  tooltip?: string;
15
+ /** Custom rich content for tooltip (ReactNode) */
9
16
  tooltipContent?: ReactNode;
10
17
  }
11
18
  export declare const withLabels: <P, R = unknown>(Component: React.ComponentType<P>) => React.ForwardRefExoticComponent<React.PropsWithoutRef<P & WithLabelsProps> & React.RefAttributes<R>>;
@@ -1 +1 @@
1
- {"version":3,"file":"withLabels.js","sources":["../../../src/hoc/withLabels/withLabels.tsx"],"sourcesContent":["import React, { ComponentType, forwardRef, ReactNode } from 'react';\n\nimport { FlexCol } from '../../components/Flex/FlexCol';\nimport { FlexRow } from '../../components/Flex/FlexRow';\nimport { MiniAlert } from '../../components/Alerts/MiniAlert';\nimport { Text } from '../../components/Text';\nimport { useId } from '../../hooks/useId';\nimport { HelpIcon } from '../../icons';\nimport { theme } from '../../theme';\n\nimport { BlockTooltip } from './BlockTooltip';\nimport styles from './withLabels.module.scss';\n\nexport interface WithLabelsProps {\n id?: string;\n label?: ReactNode;\n hint?: ReactNode;\n error?: ReactNode;\n disabledMessage?: ReactNode;\n tooltip?: string;\n tooltipContent?: ReactNode;\n}\n\n// eslint-disable-next-line @typescript-eslint/comma-dangle -- comma is required so TS knows this is a generic, not JSX\nexport const withLabels = <P, R = unknown>(Component: ComponentType<P>) => {\n const ComponentWithLabels = forwardRef<R, P & WithLabelsProps>(\n ({ label, hint, error, disabledMessage, tooltip, tooltipContent, id, ...otherProps }, ref) => {\n const componentId = useId({ id, prefix: Component.name });\n\n if (!label)\n return (\n <Component\n ref={ref}\n id={componentId}\n hasError={!!error}\n disabled={!!disabledMessage}\n disabledMessage={disabledMessage}\n {...(otherProps as P)}\n />\n );\n\n return (\n <FlexCol className={styles.rootStack}>\n <FlexRow>\n <Text variant=\"inputLabel\" id={`${componentId}-label`} htmlFor={componentId}>\n {label}\n </Text>\n {(tooltip || tooltipContent) && (\n <BlockTooltip text={tooltip} content={tooltipContent}>\n <HelpIcon\n data-testid=\"tooltip-help\"\n width={theme.sizes.base}\n height={theme.sizes.base}\n color={theme.colors.neutral.ink.light}\n />\n </BlockTooltip>\n )}\n </FlexRow>\n {hint && (\n <Text variant=\"hintText\" as=\"span\" className={styles.hint} id={`${componentId}-hint`}>\n {hint}\n </Text>\n )}\n <Component\n ref={ref}\n id={componentId}\n hasError={!!error}\n disabled={!!disabledMessage}\n disabledMessage={disabledMessage}\n {...(otherProps as P)}\n />\n {error && (\n <MiniAlert\n id={`${componentId}-error`}\n variant=\"error\"\n isBold={false}\n role=\"alert\"\n title={error}\n />\n )}\n {disabledMessage && (\n <MiniAlert\n id={`${componentId}-disabled`}\n isBold={false}\n title={disabledMessage}\n />\n )}\n </FlexCol>\n );\n },\n );\n\n ComponentWithLabels.displayName = `withLabels(${Component.displayName || Component.name || 'Component'})`;\n\n return ComponentWithLabels;\n};\n"],"names":["React","styles"],"mappings":";;;;;;;;;;;AAuBA;AACO,MAAM,UAAU,GAAG,CAAiB,SAA2B,KAAI;IACxE,MAAM,mBAAmB,GAAG,UAAU,CACpC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,eAAe,EAAE,OAAO,EAAE,cAAc,EAAE,EAAE,EAAE,GAAG,UAAU,EAAE,EAAE,GAAG,KAAI;AAC3F,QAAA,MAAM,WAAW,GAAG,KAAK,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,CAAC,IAAI,EAAE,CAAC;AAEzD,QAAA,IAAI,CAAC,KAAK;AACR,YAAA,QACEA,cAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EACR,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,WAAW,EACf,QAAQ,EAAE,CAAC,CAAC,KAAK,EACjB,QAAQ,EAAE,CAAC,CAAC,eAAe,EAC3B,eAAe,EAAE,eAAe,EAAA,GAC3B,UAAgB,EAAA,CACrB;QAGN,QACEA,6BAAC,OAAO,EAAA,EAAC,SAAS,EAAEC,WAAM,CAAC,SAAS,EAAA;AAClC,YAAAD,cAAA,CAAA,aAAA,CAAC,OAAO,EAAA,IAAA;AACN,gBAAAA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,OAAO,EAAC,YAAY,EAAC,EAAE,EAAE,CAAA,EAAG,WAAW,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAA,EACxE,KAAK,CACD;AACN,gBAAA,CAAC,OAAO,IAAI,cAAc,MACzBA,cAAA,CAAA,aAAA,CAAC,YAAY,EAAA,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,cAAc,EAAA;AAClD,oBAAAA,cAAA,CAAA,aAAA,CAAC,QAAQ,EAAA,EAAA,aAAA,EACK,cAAc,EAC1B,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,EACvB,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,EACxB,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,EAAA,CACrC,CACW,CAChB,CACO;YACT,IAAI,KACHA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,OAAO,EAAC,UAAU,EAAC,EAAE,EAAC,MAAM,EAAC,SAAS,EAAEC,WAAM,CAAC,IAAI,EAAE,EAAE,EAAE,CAAA,EAAG,WAAW,CAAA,KAAA,CAAO,EAAA,EACjF,IAAI,CACA,CACR;YACDD,cAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EACR,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,WAAW,EACf,QAAQ,EAAE,CAAC,CAAC,KAAK,EACjB,QAAQ,EAAE,CAAC,CAAC,eAAe,EAC3B,eAAe,EAAE,eAAe,EAAA,GAC3B,UAAgB,EAAA,CACrB;YACD,KAAK,KACJA,cAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EACR,EAAE,EAAE,CAAA,EAAG,WAAW,CAAA,MAAA,CAAQ,EAC1B,OAAO,EAAC,OAAO,EACf,MAAM,EAAE,KAAK,EACb,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,KAAK,EAAA,CACZ,CACH;YACA,eAAe,KACdA,cAAA,CAAA,aAAA,CAAC,SAAS,IACR,EAAE,EAAE,CAAA,EAAG,WAAW,CAAA,SAAA,CAAW,EAC7B,MAAM,EAAE,KAAK,EACb,KAAK,EAAE,eAAe,EAAA,CACtB,CACH,CACO;AAEd,IAAA,CAAC,CACF;AAED,IAAA,mBAAmB,CAAC,WAAW,GAAG,CAAA,WAAA,EAAc,SAAS,CAAC,WAAW,IAAI,SAAS,CAAC,IAAI,IAAI,WAAW,GAAG;AAEzG,IAAA,OAAO,mBAAmB;AAC5B;;;;"}
1
+ {"version":3,"file":"withLabels.js","sources":["../../../src/hoc/withLabels/withLabels.tsx"],"sourcesContent":["import React, { ComponentType, forwardRef, ReactNode } from 'react';\n\nimport { FlexCol } from '../../components/Flex/FlexCol';\nimport { FlexRow } from '../../components/Flex/FlexRow';\nimport { MiniAlert } from '../../components/Alerts/MiniAlert';\nimport { Text } from '../../components/Text';\nimport { useId } from '../../hooks/useId';\nimport { HelpIcon } from '../../icons';\nimport { theme } from '../../theme';\n\nimport { BlockTooltip } from './BlockTooltip';\nimport styles from './withLabels.module.scss';\n\nexport interface WithLabelsProps {\n /** Unique identifier for the component */\n id?: string;\n /** Label text displayed above the component */\n label?: ReactNode;\n /** Hint text displayed below the component for additional context */\n hint?: ReactNode;\n /** Error message displayed when validation fails */\n error?: ReactNode;\n /** Message displayed when the component is disabled */\n disabledMessage?: ReactNode;\n /** Tooltip text displayed on hover via help icon */\n tooltip?: string;\n /** Custom rich content for tooltip (ReactNode) */\n tooltipContent?: ReactNode;\n}\n\n// eslint-disable-next-line @typescript-eslint/comma-dangle -- comma is required so TS knows this is a generic, not JSX\nexport const withLabels = <P, R = unknown>(Component: ComponentType<P>) => {\n const ComponentWithLabels = forwardRef<R, P & WithLabelsProps>(\n ({ label, hint, error, disabledMessage, tooltip, tooltipContent, id, ...otherProps }, ref) => {\n const componentId = useId({ id, prefix: Component.name });\n\n if (!label)\n return (\n <Component\n ref={ref}\n id={componentId}\n hasError={!!error}\n disabled={!!disabledMessage}\n disabledMessage={disabledMessage}\n {...(otherProps as P)}\n />\n );\n\n return (\n <FlexCol className={styles.rootStack}>\n <FlexRow>\n <Text variant=\"inputLabel\" id={`${componentId}-label`} htmlFor={componentId}>\n {label}\n </Text>\n {(tooltip || tooltipContent) && (\n <BlockTooltip text={tooltip} content={tooltipContent}>\n <HelpIcon\n data-testid=\"tooltip-help\"\n width={theme.sizes.base}\n height={theme.sizes.base}\n color={theme.colors.neutral.ink.light}\n />\n </BlockTooltip>\n )}\n </FlexRow>\n {hint && (\n <Text variant=\"hintText\" as=\"span\" className={styles.hint} id={`${componentId}-hint`}>\n {hint}\n </Text>\n )}\n <Component\n ref={ref}\n id={componentId}\n hasError={!!error}\n disabled={!!disabledMessage}\n disabledMessage={disabledMessage}\n {...(otherProps as P)}\n />\n {error && (\n <MiniAlert\n id={`${componentId}-error`}\n variant=\"error\"\n isBold={false}\n role=\"alert\"\n title={error}\n />\n )}\n {disabledMessage && (\n <MiniAlert\n id={`${componentId}-disabled`}\n isBold={false}\n title={disabledMessage}\n />\n )}\n </FlexCol>\n );\n },\n );\n\n ComponentWithLabels.displayName = `withLabels(${Component.displayName || Component.name || 'Component'})`;\n\n return ComponentWithLabels;\n};\n"],"names":["React","styles"],"mappings":";;;;;;;;;;;AA8BA;AACO,MAAM,UAAU,GAAG,CAAiB,SAA2B,KAAI;IACxE,MAAM,mBAAmB,GAAG,UAAU,CACpC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,eAAe,EAAE,OAAO,EAAE,cAAc,EAAE,EAAE,EAAE,GAAG,UAAU,EAAE,EAAE,GAAG,KAAI;AAC3F,QAAA,MAAM,WAAW,GAAG,KAAK,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,CAAC,IAAI,EAAE,CAAC;AAEzD,QAAA,IAAI,CAAC,KAAK;AACR,YAAA,QACEA,cAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EACR,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,WAAW,EACf,QAAQ,EAAE,CAAC,CAAC,KAAK,EACjB,QAAQ,EAAE,CAAC,CAAC,eAAe,EAC3B,eAAe,EAAE,eAAe,EAAA,GAC3B,UAAgB,EAAA,CACrB;QAGN,QACEA,6BAAC,OAAO,EAAA,EAAC,SAAS,EAAEC,WAAM,CAAC,SAAS,EAAA;AAClC,YAAAD,cAAA,CAAA,aAAA,CAAC,OAAO,EAAA,IAAA;AACN,gBAAAA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,OAAO,EAAC,YAAY,EAAC,EAAE,EAAE,CAAA,EAAG,WAAW,QAAQ,EAAE,OAAO,EAAE,WAAW,EAAA,EACxE,KAAK,CACD;AACN,gBAAA,CAAC,OAAO,IAAI,cAAc,MACzBA,cAAA,CAAA,aAAA,CAAC,YAAY,EAAA,EAAC,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,cAAc,EAAA;AAClD,oBAAAA,cAAA,CAAA,aAAA,CAAC,QAAQ,EAAA,EAAA,aAAA,EACK,cAAc,EAC1B,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,EACvB,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,EACxB,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,EAAA,CACrC,CACW,CAChB,CACO;YACT,IAAI,KACHA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,OAAO,EAAC,UAAU,EAAC,EAAE,EAAC,MAAM,EAAC,SAAS,EAAEC,WAAM,CAAC,IAAI,EAAE,EAAE,EAAE,CAAA,EAAG,WAAW,CAAA,KAAA,CAAO,EAAA,EACjF,IAAI,CACA,CACR;YACDD,cAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EACR,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,WAAW,EACf,QAAQ,EAAE,CAAC,CAAC,KAAK,EACjB,QAAQ,EAAE,CAAC,CAAC,eAAe,EAC3B,eAAe,EAAE,eAAe,EAAA,GAC3B,UAAgB,EAAA,CACrB;YACD,KAAK,KACJA,cAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EACR,EAAE,EAAE,CAAA,EAAG,WAAW,CAAA,MAAA,CAAQ,EAC1B,OAAO,EAAC,OAAO,EACf,MAAM,EAAE,KAAK,EACb,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,KAAK,EAAA,CACZ,CACH;YACA,eAAe,KACdA,cAAA,CAAA,aAAA,CAAC,SAAS,IACR,EAAE,EAAE,CAAA,EAAG,WAAW,CAAA,SAAA,CAAW,EAC7B,MAAM,EAAE,KAAK,EACb,KAAK,EAAE,eAAe,EAAA,CACtB,CACH,CACO;AAEd,IAAA,CAAC,CACF;AAED,IAAA,mBAAmB,CAAC,WAAW,GAAG,CAAA,WAAA,EAAc,SAAS,CAAC,WAAW,IAAI,SAAS,CAAC,IAAI,IAAI,WAAW,GAAG;AAEzG,IAAA,OAAO,mBAAmB;AAC5B;;;;"}
@@ -2,8 +2,8 @@
2
2
 
3
3
  var ___$insertStyle = require('../../_virtual/____insertStyle.cjs');
4
4
 
5
- ___$insertStyle("._rootStack_1rs8c_1 {\n position: relative;\n}\n\n/* Overrides hintText token's 12px/16px to use body font-size/line-height */\n._hint_1rs8c_6 {\n margin-top: var(--sizes-xs);\n font-size: var(--text-body-font-size);\n line-height: var(--text-body-line-height);\n}\n\n/* Error token uses font-weight: 600, but form errors render at normal weight */\n._error_1rs8c_13 {\n font-weight: normal;\n}");
6
- var labelStyles = {"rootStack":"_rootStack_1rs8c_1","hint":"_hint_1rs8c_6","error":"_error_1rs8c_13"};
5
+ ___$insertStyle("._rootStack_idlam_1 {\n position: relative;\n}\n\n/* Overrides hintText token's 12px/16px to use body font-size/line-height */\n._hint_idlam_6 {\n font-size: var(--text-body-font-size);\n line-height: var(--text-body-line-height);\n}\n\n/* Error token uses font-weight: 600, but form errors render at normal weight */\n._error_idlam_12 {\n font-weight: normal;\n}");
6
+ var labelStyles = {"rootStack":"_rootStack_idlam_1","hint":"_hint_idlam_6","error":"_error_idlam_12"};
7
7
 
8
8
  module.exports = labelStyles;
9
9
  //# sourceMappingURL=withLabels.module.scss.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"withLabels.module.scss.cjs","sources":["../../../src/hoc/withLabels/withLabels.module.scss"],"sourcesContent":[".rootStack {\n position: relative;\n}\n\n/* Overrides hintText token's 12px/16px to use body font-size/line-height */\n.hint {\n margin-top: var(--sizes-xs);\n font-size: var(--text-body-font-size);\n line-height: var(--text-body-line-height);\n}\n\n/* Error token uses font-weight: 600, but form errors render at normal weight */\n.error {\n font-weight: normal;\n}\n"],"names":[],"mappings":";;;;AACE,eAAA,CAAA,iZAAA;;;;;"}
1
+ {"version":3,"file":"withLabels.module.scss.cjs","sources":["../../../src/hoc/withLabels/withLabels.module.scss"],"sourcesContent":[".rootStack {\n position: relative;\n}\n\n/* Overrides hintText token's 12px/16px to use body font-size/line-height */\n.hint {\n font-size: var(--text-body-font-size);\n line-height: var(--text-body-line-height);\n}\n\n/* Error token uses font-weight: 600, but form errors render at normal weight */\n.error {\n font-weight: normal;\n}\n"],"names":[],"mappings":";;;;AACE,eAAA,CAAA,iXAAA;;;;;"}
@@ -1,7 +1,7 @@
1
1
  import insertStyle from '../../_virtual/____insertStyle.js';
2
2
 
3
- insertStyle("._rootStack_1rs8c_1 {\n position: relative;\n}\n\n/* Overrides hintText token's 12px/16px to use body font-size/line-height */\n._hint_1rs8c_6 {\n margin-top: var(--sizes-xs);\n font-size: var(--text-body-font-size);\n line-height: var(--text-body-line-height);\n}\n\n/* Error token uses font-weight: 600, but form errors render at normal weight */\n._error_1rs8c_13 {\n font-weight: normal;\n}");
4
- var labelStyles = {"rootStack":"_rootStack_1rs8c_1","hint":"_hint_1rs8c_6","error":"_error_1rs8c_13"};
3
+ insertStyle("._rootStack_idlam_1 {\n position: relative;\n}\n\n/* Overrides hintText token's 12px/16px to use body font-size/line-height */\n._hint_idlam_6 {\n font-size: var(--text-body-font-size);\n line-height: var(--text-body-line-height);\n}\n\n/* Error token uses font-weight: 600, but form errors render at normal weight */\n._error_idlam_12 {\n font-weight: normal;\n}");
4
+ var labelStyles = {"rootStack":"_rootStack_idlam_1","hint":"_hint_idlam_6","error":"_error_idlam_12"};
5
5
 
6
6
  export { labelStyles as default };
7
7
  //# sourceMappingURL=withLabels.module.scss.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"withLabels.module.scss.js","sources":["../../../src/hoc/withLabels/withLabels.module.scss"],"sourcesContent":[".rootStack {\n position: relative;\n}\n\n/* Overrides hintText token's 12px/16px to use body font-size/line-height */\n.hint {\n margin-top: var(--sizes-xs);\n font-size: var(--text-body-font-size);\n line-height: var(--text-body-line-height);\n}\n\n/* Error token uses font-weight: 600, but form errors render at normal weight */\n.error {\n font-weight: normal;\n}\n"],"names":["___$insertStyle"],"mappings":";;AACEA,WAAA,CAAA,iZAAA;;;;;"}
1
+ {"version":3,"file":"withLabels.module.scss.js","sources":["../../../src/hoc/withLabels/withLabels.module.scss"],"sourcesContent":[".rootStack {\n position: relative;\n}\n\n/* Overrides hintText token's 12px/16px to use body font-size/line-height */\n.hint {\n font-size: var(--text-body-font-size);\n line-height: var(--text-body-line-height);\n}\n\n/* Error token uses font-weight: 600, but form errors render at normal weight */\n.error {\n font-weight: normal;\n}\n"],"names":["___$insertStyle"],"mappings":";;AACEA,WAAA,CAAA,iXAAA;;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@veeqo/ui",
3
- "version": "15.15.3",
3
+ "version": "15.16.0",
4
4
  "description": "New optimised component library for Veeqo.",
5
5
  "author": "Robert Wealthall",
6
6
  "license": "ISC",
@@ -36,19 +36,23 @@
36
36
  "lint:fix": "eslint --quiet src/* --ext .ts,.tsx --fix && stylelint 'src/**/*.scss' --fix",
37
37
  "emit-declarations": "echo 'Emit declarations is no longer required for buildstep. Deprecated.'",
38
38
  "prepublishOnly": "node scripts/internal-publish-rename.cjs && npm run test && npm run build",
39
- "patch": "npm version patch && npm run changelog:update",
40
- "minor": "npm version minor && npm run changelog:update",
41
- "major": "npm version major && npm run changelog:update",
39
+ "sync-config-version": "node scripts/sync-config-version.cjs && git add Config && git commit -m \"chore: sync Config version\"",
40
+ "patch": "npm version patch && npm run sync-config-version && npm run changelog:update",
41
+ "minor": "npm version minor && npm run sync-config-version && npm run changelog:update",
42
+ "major": "npm version major && npm run sync-config-version && npm run changelog:update",
42
43
  "tags:remove": "node scripts/remove-tag.cjs",
43
44
  "tags:update": "git fetch --tags && git push --follow-tags",
44
45
  "changelog:update": "npm run tags:update && auto-changelog -p && bash ./scripts/ai-changelog.sh && git add CHANGELOG.md NEW_CHANGELOG.md && (git diff --cached --quiet || git commit -m \"Update CHANGELOG and NEW_CHANGELOG\")",
45
- "figma:export": "rimraf ./src/icons/design-system/imports && dotenv figma-export use-config scripts/figma-export/.figmaexportrc.icons.js ",
46
+ "figma:export": "npm run figma:export-icons && npm run figma:export-logos",
47
+ "figma:export-icons": "rimraf ./src/icons/design-system/imports && dotenv figma-export use-config scripts/figma-export/.figmaexportrc.icons.js && npm run build:icons",
46
48
  "figma:publish": "if [ ! -f ./.env ]; then echo 'Error: .env not found — copy .env.sample to .env and set FIGMA_TOKEN' >&2; exit 1; fi; set -a && . ./.env && set +a; if [ -z \"$FIGMA_TOKEN\" ]; then echo 'Error: FIGMA_TOKEN is empty — set it in .env' >&2; exit 1; fi; FIGMA_ACCESS_TOKEN=\"$FIGMA_TOKEN\" npx figma connect publish --force",
47
49
  "icons:code-connect": "node scripts/figma-export/generate-icon-code-connect.js",
48
- "figma:export-integrations": "rimraf ./imports/integrations && dotenv figma-export use-config scripts/figma-export/.figmaexportrc.integrations.js -- --type=all",
49
- "figma:export-integrations:accounting": "rimraf ./imports/integrations/accounting && dotenv figma-export use-config scripts/figma-export/.figmaexportrc.integrations.js -- --type=accounting",
50
- "figma:export-integrations:carriers": "rimraf ./imports/integrations/carriers && dotenv figma-export use-config scripts/figma-export/.figmaexportrc.integrations.js -- --type=carriers",
51
- "figma:export-integrations:channels": "rimraf ./imports/integrations/channels && dotenv figma-export use-config scripts/figma-export/.figmaexportrc.integrations.js -- --type=channels"
50
+ "logos:code-connect": "node scripts/figma-export/generate-logo-code-connect.js",
51
+ "figma:export-code-connect": "npm run icons:code-connect && npm run logos:code-connect",
52
+ "figma:export-logos": "rimraf ./src/logos/imports && dotenv figma-export use-config scripts/figma-export/.figmaexportrc.logos.js -- --type=all && npm run build:logos",
53
+ "figma:export-logos:channels": "dotenv figma-export use-config scripts/figma-export/.figmaexportrc.logos.js -- --type=channels && npm run build:logos",
54
+ "figma:export-logos:carriers": "dotenv figma-export use-config scripts/figma-export/.figmaexportrc.logos.js -- --type=carriers && npm run build:logos",
55
+ "figma:export-logos:accounting": "dotenv figma-export use-config scripts/figma-export/.figmaexportrc.logos.js -- --type=accounting && npm run build:logos"
52
56
  },
53
57
  "auto-changelog": {
54
58
  "issueUrl": "https://sim.amazon.com/issues/{id}",
@@ -157,6 +161,7 @@
157
161
  },
158
162
  "@figma/code-connect": {
159
163
  "typescript": "$typescript"
160
- }
164
+ },
165
+ "websocket-driver": ">=0.7.5"
161
166
  }
162
167
  }