@warp-ds/elements 2.7.0-next.1 → 2.7.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/dist/custom-elements.json +752 -0
- package/dist/index.d.ts +220 -0
- package/dist/packages/affix/affix.js +11 -11
- package/dist/packages/affix/affix.js.map +3 -3
- package/dist/packages/alert/alert.js +7 -7
- package/dist/packages/alert/alert.js.map +3 -3
- package/dist/packages/attention/attention.js +22 -22
- package/dist/packages/attention/attention.js.map +3 -3
- package/dist/packages/breadcrumbs/breadcrumbs.js +9 -9
- package/dist/packages/breadcrumbs/breadcrumbs.js.map +3 -3
- package/dist/packages/button/button.js +11 -11
- package/dist/packages/button/button.js.map +3 -3
- package/dist/packages/card/card.js +8 -8
- package/dist/packages/card/card.js.map +3 -3
- package/dist/packages/checkbox/checkbox.a11y.test.d.ts +1 -0
- package/dist/packages/checkbox/checkbox.a11y.test.js +73 -0
- package/dist/packages/checkbox/checkbox.d.ts +49 -0
- package/dist/packages/checkbox/checkbox.js +2594 -0
- package/dist/packages/checkbox/checkbox.js.map +7 -0
- package/dist/packages/checkbox/checkbox.react.stories.d.ts +12 -0
- package/dist/packages/checkbox/checkbox.react.stories.js +10 -0
- package/dist/packages/checkbox/checkbox.stories.d.ts +25 -0
- package/dist/packages/checkbox/checkbox.stories.js +183 -0
- package/dist/packages/checkbox/checkbox.test.d.ts +1 -0
- package/dist/packages/checkbox/checkbox.test.js +142 -0
- package/dist/packages/checkbox/react.d.ts +5 -0
- package/dist/packages/checkbox/react.js +15 -0
- package/dist/packages/checkbox/styles.d.ts +1 -0
- package/dist/packages/checkbox/styles.js +134 -0
- package/dist/packages/checkbox-group/checkbox-group.a11y.test.d.ts +2 -0
- package/dist/packages/checkbox-group/checkbox-group.a11y.test.js +109 -0
- package/dist/packages/checkbox-group/checkbox-group.d.ts +33 -0
- package/dist/packages/checkbox-group/checkbox-group.js +71 -0
- package/dist/packages/checkbox-group/checkbox-group.js.map +7 -0
- package/dist/packages/checkbox-group/checkbox-group.test.d.ts +2 -0
- package/dist/packages/checkbox-group/checkbox-group.test.js +112 -0
- package/dist/packages/checkbox-group/locales/da/messages.d.mts +1 -0
- package/dist/packages/checkbox-group/locales/da/messages.mjs +1 -0
- package/dist/packages/checkbox-group/locales/en/messages.d.mts +1 -0
- package/dist/packages/checkbox-group/locales/en/messages.mjs +1 -0
- package/dist/packages/checkbox-group/locales/fi/messages.d.mts +1 -0
- package/dist/packages/checkbox-group/locales/fi/messages.mjs +1 -0
- package/dist/packages/checkbox-group/locales/nb/messages.d.mts +1 -0
- package/dist/packages/checkbox-group/locales/nb/messages.mjs +1 -0
- package/dist/packages/checkbox-group/locales/sv/messages.d.mts +1 -0
- package/dist/packages/checkbox-group/locales/sv/messages.mjs +1 -0
- package/dist/packages/checkbox-group/react.d.ts +2 -0
- package/dist/packages/checkbox-group/react.js +11 -0
- package/dist/packages/combobox/combobox.js +11 -11
- package/dist/packages/combobox/combobox.js.map +3 -3
- package/dist/packages/datepicker/datepicker.js +42 -42
- package/dist/packages/datepicker/datepicker.js.map +3 -3
- package/dist/packages/expandable/expandable.js +11 -11
- package/dist/packages/expandable/expandable.js.map +3 -3
- package/dist/packages/i18n.d.ts +2 -0
- package/dist/packages/i18n.js +87 -2
- package/dist/packages/modal-header/modal-header.js +15 -15
- package/dist/packages/modal-header/modal-header.js.map +3 -3
- package/dist/packages/page-indicator/page-indicator.js +7 -7
- package/dist/packages/page-indicator/page-indicator.js.map +3 -3
- package/dist/packages/pagination/pagination.js +24 -24
- package/dist/packages/pagination/pagination.js.map +3 -3
- package/dist/packages/pill/pill.js +10 -10
- package/dist/packages/pill/pill.js.map +3 -3
- package/dist/packages/select/select.js +20 -20
- package/dist/packages/select/select.js.map +3 -3
- package/dist/packages/slider/slider.js +21 -21
- package/dist/packages/slider/slider.js.map +3 -3
- package/dist/packages/step/step.js +13 -13
- package/dist/packages/step/step.js.map +3 -3
- package/dist/packages/step-indicator/step-indicator.a11y.test.js +6 -2
- package/dist/packages/textarea/textarea.a11y.test.js +1 -1
- package/dist/packages/textarea/textarea.test.js +2 -1
- package/dist/packages/toast/toast.js +13 -13
- package/dist/packages/toast/toast.js.map +3 -3
- package/dist/setup-tests.js +1 -1
- package/dist/web-types.json +160 -1
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -27,6 +27,8 @@ import type { WarpTabs } from "./packages/tabs/tabs.ts";
|
|
|
27
27
|
import type { WarpTextarea } from "./packages/textarea/textarea.ts";
|
|
28
28
|
import type { WarpTextField } from "./packages/textfield/textfield.ts";
|
|
29
29
|
import type { WarpToastContainer } from "./packages/toast-container/toast-container.ts";
|
|
30
|
+
import type { WCheckbox } from "./packages/checkbox/checkbox.ts";
|
|
31
|
+
import type { WCheckboxGroup } from "./packages/checkbox-group/checkbox-group.ts";
|
|
30
32
|
import type { WarpSliderThumb } from "./packages/slider-thumb/slider-thumb.ts";
|
|
31
33
|
import type { WarpSlider } from "./packages/slider/slider.ts";
|
|
32
34
|
|
|
@@ -1443,6 +1445,93 @@ export type WarpToastContainerSolidJsProps = {
|
|
|
1443
1445
|
textContent?: string | number;
|
|
1444
1446
|
};
|
|
1445
1447
|
|
|
1448
|
+
export type WCheckboxProps = {
|
|
1449
|
+
/** The name of the checkbox, submitted as a name/value pair with form data. */
|
|
1450
|
+
name?: WCheckbox["name"];
|
|
1451
|
+
/** The value of the checkbox, submitted as a name/value pair with form data. */
|
|
1452
|
+
value?: WCheckbox["value"];
|
|
1453
|
+
/** Draws the checkbox in an indeterminate state. */
|
|
1454
|
+
indeterminate?: WCheckbox["indeterminate"];
|
|
1455
|
+
/** Draws the checkbox in a checked state (reflected to attribute). */
|
|
1456
|
+
checked?: WCheckbox["checked"];
|
|
1457
|
+
/** Disables the checkbox. */
|
|
1458
|
+
disabled?: WCheckbox["disabled"];
|
|
1459
|
+
/** Makes the checkbox a required field. */
|
|
1460
|
+
required?: WCheckbox["required"];
|
|
1461
|
+
/** Draws the checkbox in an invalid state. */
|
|
1462
|
+
invalid?: WCheckbox["invalid"];
|
|
1463
|
+
/** */
|
|
1464
|
+
input?: WCheckbox["input"];
|
|
1465
|
+
|
|
1466
|
+
/** */
|
|
1467
|
+
onchange?: (e: Event) => void;
|
|
1468
|
+
};
|
|
1469
|
+
|
|
1470
|
+
export type WCheckboxSolidJsProps = {
|
|
1471
|
+
/** The name of the checkbox, submitted as a name/value pair with form data. */
|
|
1472
|
+
"prop:name"?: WCheckbox["name"];
|
|
1473
|
+
/** The value of the checkbox, submitted as a name/value pair with form data. */
|
|
1474
|
+
"prop:value"?: WCheckbox["value"];
|
|
1475
|
+
/** Draws the checkbox in an indeterminate state. */
|
|
1476
|
+
"prop:indeterminate"?: WCheckbox["indeterminate"];
|
|
1477
|
+
/** Draws the checkbox in a checked state (reflected to attribute). */
|
|
1478
|
+
"prop:checked"?: WCheckbox["checked"];
|
|
1479
|
+
/** Disables the checkbox. */
|
|
1480
|
+
"prop:disabled"?: WCheckbox["disabled"];
|
|
1481
|
+
/** Makes the checkbox a required field. */
|
|
1482
|
+
"prop:required"?: WCheckbox["required"];
|
|
1483
|
+
/** Draws the checkbox in an invalid state. */
|
|
1484
|
+
"prop:invalid"?: WCheckbox["invalid"];
|
|
1485
|
+
/** */
|
|
1486
|
+
"prop:input"?: WCheckbox["input"];
|
|
1487
|
+
/** */
|
|
1488
|
+
"on:change"?: (e: Event) => void;
|
|
1489
|
+
|
|
1490
|
+
/** Set the innerHTML of the element */
|
|
1491
|
+
innerHTML?: string;
|
|
1492
|
+
/** Set the textContent of the element */
|
|
1493
|
+
textContent?: string | number;
|
|
1494
|
+
};
|
|
1495
|
+
|
|
1496
|
+
export type WCheckboxGroupProps = {
|
|
1497
|
+
/** The group label displayed above the checkboxes. */
|
|
1498
|
+
label?: WCheckboxGroup["label"];
|
|
1499
|
+
/** The name applied to child checkboxes when they do not provide one. */
|
|
1500
|
+
name?: WCheckboxGroup["name"];
|
|
1501
|
+
/** Whether to show optional text next to the label. */
|
|
1502
|
+
optional?: WCheckboxGroup["optional"];
|
|
1503
|
+
/** */
|
|
1504
|
+
"help-text"?: WCheckboxGroup["helpText"];
|
|
1505
|
+
/** */
|
|
1506
|
+
helpText?: WCheckboxGroup["helpText"];
|
|
1507
|
+
/** Makes the checkbox group required. */
|
|
1508
|
+
required?: WCheckboxGroup["required"];
|
|
1509
|
+
/** Marks the checkbox group as invalid. */
|
|
1510
|
+
invalid?: WCheckboxGroup["invalid"];
|
|
1511
|
+
};
|
|
1512
|
+
|
|
1513
|
+
export type WCheckboxGroupSolidJsProps = {
|
|
1514
|
+
/** The group label displayed above the checkboxes. */
|
|
1515
|
+
"prop:label"?: WCheckboxGroup["label"];
|
|
1516
|
+
/** The name applied to child checkboxes when they do not provide one. */
|
|
1517
|
+
"prop:name"?: WCheckboxGroup["name"];
|
|
1518
|
+
/** Whether to show optional text next to the label. */
|
|
1519
|
+
"prop:optional"?: WCheckboxGroup["optional"];
|
|
1520
|
+
/** */
|
|
1521
|
+
"attr:help-text"?: WCheckboxGroup["helpText"];
|
|
1522
|
+
/** */
|
|
1523
|
+
"prop:helpText"?: WCheckboxGroup["helpText"];
|
|
1524
|
+
/** Makes the checkbox group required. */
|
|
1525
|
+
"prop:required"?: WCheckboxGroup["required"];
|
|
1526
|
+
/** Marks the checkbox group as invalid. */
|
|
1527
|
+
"prop:invalid"?: WCheckboxGroup["invalid"];
|
|
1528
|
+
|
|
1529
|
+
/** Set the innerHTML of the element */
|
|
1530
|
+
innerHTML?: string;
|
|
1531
|
+
/** Set the textContent of the element */
|
|
1532
|
+
textContent?: string | number;
|
|
1533
|
+
};
|
|
1534
|
+
|
|
1446
1535
|
export type WarpSliderThumbProps = {
|
|
1447
1536
|
/** */
|
|
1448
1537
|
"aria-label"?: WarpSliderThumb["ariaLabel"];
|
|
@@ -2351,6 +2440,69 @@ export type CustomElements = {
|
|
|
2351
2440
|
WarpToastContainerProps & BaseProps<WarpToastContainer> & BaseEvents
|
|
2352
2441
|
>;
|
|
2353
2442
|
|
|
2443
|
+
/**
|
|
2444
|
+
*
|
|
2445
|
+
*
|
|
2446
|
+
* ## Attributes & Properties
|
|
2447
|
+
*
|
|
2448
|
+
* Component attributes and properties that can be applied to the element or by using JavaScript.
|
|
2449
|
+
*
|
|
2450
|
+
* - `name`: The name of the checkbox, submitted as a name/value pair with form data.
|
|
2451
|
+
* - `value`: The value of the checkbox, submitted as a name/value pair with form data.
|
|
2452
|
+
* - `indeterminate`: Draws the checkbox in an indeterminate state.
|
|
2453
|
+
* - `checked`: Draws the checkbox in a checked state (reflected to attribute).
|
|
2454
|
+
* - `disabled`: Disables the checkbox.
|
|
2455
|
+
* - `required`: Makes the checkbox a required field.
|
|
2456
|
+
* - `invalid`: Draws the checkbox in an invalid state.
|
|
2457
|
+
* - `input`: undefined (property only)
|
|
2458
|
+
* - `validationMessage`: Returns the validation message if the checkbox is invalid, otherwise an empty string (property only) (readonly)
|
|
2459
|
+
* - `validity`: Returns the validity state of the checkbox (property only) (readonly)
|
|
2460
|
+
*
|
|
2461
|
+
* ## Events
|
|
2462
|
+
*
|
|
2463
|
+
* Events that will be emitted by the component.
|
|
2464
|
+
*
|
|
2465
|
+
* - `change`: undefined
|
|
2466
|
+
*
|
|
2467
|
+
* ## Methods
|
|
2468
|
+
*
|
|
2469
|
+
* Methods that can be called to access component functionality.
|
|
2470
|
+
*
|
|
2471
|
+
* - `resetFormControl() => void`: undefined
|
|
2472
|
+
* - `click() => void`: undefined
|
|
2473
|
+
* - `focus(options?: FocusOptions) => void`: undefined
|
|
2474
|
+
* - `blur() => void`: undefined
|
|
2475
|
+
* - `checkValidity() => boolean`: Checks whether the checkbox passes constraint validation
|
|
2476
|
+
* - `reportValidity() => boolean`: Checks validity and shows the browser's validation message if invalid
|
|
2477
|
+
*/
|
|
2478
|
+
"w-checkbox": Partial<WCheckboxProps & BaseProps<WCheckbox> & BaseEvents>;
|
|
2479
|
+
|
|
2480
|
+
/**
|
|
2481
|
+
*
|
|
2482
|
+
*
|
|
2483
|
+
* ## Attributes & Properties
|
|
2484
|
+
*
|
|
2485
|
+
* Component attributes and properties that can be applied to the element or by using JavaScript.
|
|
2486
|
+
*
|
|
2487
|
+
* - `label`: The group label displayed above the checkboxes.
|
|
2488
|
+
* - `name`: The name applied to child checkboxes when they do not provide one.
|
|
2489
|
+
* - `optional`: Whether to show optional text next to the label.
|
|
2490
|
+
* - `help-text`/`helpText`: undefined
|
|
2491
|
+
* - `required`: Makes the checkbox group required.
|
|
2492
|
+
* - `invalid`: Marks the checkbox group as invalid.
|
|
2493
|
+
*
|
|
2494
|
+
* ## Methods
|
|
2495
|
+
*
|
|
2496
|
+
* Methods that can be called to access component functionality.
|
|
2497
|
+
*
|
|
2498
|
+
* - `checkValidity() => boolean`: Checks whether the group passes constraint validation
|
|
2499
|
+
* - `reportValidity() => boolean`: Checks validity and shows the validation message if invalid
|
|
2500
|
+
* - `focus(options?: FocusOptions) => void`: Sets focus on the checkbox group.
|
|
2501
|
+
*/
|
|
2502
|
+
"w-checkbox-group": Partial<
|
|
2503
|
+
WCheckboxGroupProps & BaseProps<WCheckboxGroup> & BaseEvents
|
|
2504
|
+
>;
|
|
2505
|
+
|
|
2354
2506
|
/**
|
|
2355
2507
|
* Component to place inside a `<w-slider>`.
|
|
2356
2508
|
*
|
|
@@ -3268,6 +3420,74 @@ export type CustomElementsSolidJs = {
|
|
|
3268
3420
|
BaseEvents
|
|
3269
3421
|
>;
|
|
3270
3422
|
|
|
3423
|
+
/**
|
|
3424
|
+
*
|
|
3425
|
+
*
|
|
3426
|
+
* ## Attributes & Properties
|
|
3427
|
+
*
|
|
3428
|
+
* Component attributes and properties that can be applied to the element or by using JavaScript.
|
|
3429
|
+
*
|
|
3430
|
+
* - `name`: The name of the checkbox, submitted as a name/value pair with form data.
|
|
3431
|
+
* - `value`: The value of the checkbox, submitted as a name/value pair with form data.
|
|
3432
|
+
* - `indeterminate`: Draws the checkbox in an indeterminate state.
|
|
3433
|
+
* - `checked`: Draws the checkbox in a checked state (reflected to attribute).
|
|
3434
|
+
* - `disabled`: Disables the checkbox.
|
|
3435
|
+
* - `required`: Makes the checkbox a required field.
|
|
3436
|
+
* - `invalid`: Draws the checkbox in an invalid state.
|
|
3437
|
+
* - `input`: undefined (property only)
|
|
3438
|
+
* - `validationMessage`: Returns the validation message if the checkbox is invalid, otherwise an empty string (property only) (readonly)
|
|
3439
|
+
* - `validity`: Returns the validity state of the checkbox (property only) (readonly)
|
|
3440
|
+
*
|
|
3441
|
+
* ## Events
|
|
3442
|
+
*
|
|
3443
|
+
* Events that will be emitted by the component.
|
|
3444
|
+
*
|
|
3445
|
+
* - `change`: undefined
|
|
3446
|
+
*
|
|
3447
|
+
* ## Methods
|
|
3448
|
+
*
|
|
3449
|
+
* Methods that can be called to access component functionality.
|
|
3450
|
+
*
|
|
3451
|
+
* - `resetFormControl() => void`: undefined
|
|
3452
|
+
* - `click() => void`: undefined
|
|
3453
|
+
* - `focus(options?: FocusOptions) => void`: undefined
|
|
3454
|
+
* - `blur() => void`: undefined
|
|
3455
|
+
* - `checkValidity() => boolean`: Checks whether the checkbox passes constraint validation
|
|
3456
|
+
* - `reportValidity() => boolean`: Checks validity and shows the browser's validation message if invalid
|
|
3457
|
+
*/
|
|
3458
|
+
"w-checkbox": Partial<
|
|
3459
|
+
WCheckboxProps & WCheckboxSolidJsProps & BaseProps<WCheckbox> & BaseEvents
|
|
3460
|
+
>;
|
|
3461
|
+
|
|
3462
|
+
/**
|
|
3463
|
+
*
|
|
3464
|
+
*
|
|
3465
|
+
* ## Attributes & Properties
|
|
3466
|
+
*
|
|
3467
|
+
* Component attributes and properties that can be applied to the element or by using JavaScript.
|
|
3468
|
+
*
|
|
3469
|
+
* - `label`: The group label displayed above the checkboxes.
|
|
3470
|
+
* - `name`: The name applied to child checkboxes when they do not provide one.
|
|
3471
|
+
* - `optional`: Whether to show optional text next to the label.
|
|
3472
|
+
* - `help-text`/`helpText`: undefined
|
|
3473
|
+
* - `required`: Makes the checkbox group required.
|
|
3474
|
+
* - `invalid`: Marks the checkbox group as invalid.
|
|
3475
|
+
*
|
|
3476
|
+
* ## Methods
|
|
3477
|
+
*
|
|
3478
|
+
* Methods that can be called to access component functionality.
|
|
3479
|
+
*
|
|
3480
|
+
* - `checkValidity() => boolean`: Checks whether the group passes constraint validation
|
|
3481
|
+
* - `reportValidity() => boolean`: Checks validity and shows the validation message if invalid
|
|
3482
|
+
* - `focus(options?: FocusOptions) => void`: Sets focus on the checkbox group.
|
|
3483
|
+
*/
|
|
3484
|
+
"w-checkbox-group": Partial<
|
|
3485
|
+
WCheckboxGroupProps &
|
|
3486
|
+
WCheckboxGroupSolidJsProps &
|
|
3487
|
+
BaseProps<WCheckboxGroup> &
|
|
3488
|
+
BaseEvents
|
|
3489
|
+
>;
|
|
3490
|
+
|
|
3271
3491
|
/**
|
|
3272
3492
|
* Component to place inside a `<w-slider>`.
|
|
3273
3493
|
*
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var
|
|
1
|
+
var L=Object.defineProperty;var E=Object.getOwnPropertyDescriptor;var i=(e,o,r,t)=>{for(var a=t>1?void 0:t?E(o,r):o,l=e.length-1,p;l>=0;l--)(p=e[l])&&(a=(t?p(o,r,a):p(a))||a);return t&&a&&L(o,r,a),a};var g=function(){for(var e=[],o=arguments.length;o--;)e[o]=arguments[o];return e.reduce(function(r,t){return r.concat(typeof t=="string"?t:Array.isArray(t)?g.apply(void 0,t):typeof t=="object"&&t?Object.keys(t).map(function(a){return t[a]?a:""}):"")},[]).join(" ")};import{html as d,LitElement as F}from"lit";import{property as b}from"lit/decorators.js";import{ifDefined as z}from"lit/directives/if-defined.js";import{css as w}from"lit";var f=w`
|
|
2
2
|
*,
|
|
3
3
|
:before,
|
|
4
4
|
:after {
|
|
@@ -271,7 +271,7 @@ var _=Object.defineProperty;var Y=Object.getOwnPropertyDescriptor;var i=(e,t,o,r
|
|
|
271
271
|
svg {
|
|
272
272
|
pointer-events: none;
|
|
273
273
|
}
|
|
274
|
-
`,
|
|
274
|
+
`,I=w`*, :before, :after {
|
|
275
275
|
--w-rotate: 0;
|
|
276
276
|
--w-rotate-x: 0;
|
|
277
277
|
--w-rotate-y: 0;
|
|
@@ -2437,7 +2437,7 @@ var _=Object.defineProperty;var Y=Object.getOwnPropertyDescriptor;var i=(e,t,o,r
|
|
|
2437
2437
|
display: none
|
|
2438
2438
|
}
|
|
2439
2439
|
}
|
|
2440
|
-
`;import{css as
|
|
2440
|
+
`;import{css as Y}from"lit";var x=Y`*,:before,:after{--w-rotate:0;--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-scale-x:1;--w-scale-y:1;--w-scale-z:1;--w-skew-x:0;--w-skew-y:0;--w-translate-x:0;--w-translate-y:0;--w-translate-z:0}.focus\\:\\[--w-outline-offset\\:-2px\\]:focus{--w-outline-offset:-2px}.bg-transparent{background-color:#0000}.rounded-4{border-radius:4px}.block{display:block}.flex{display:flex}.focusable:focus{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:focus-visible{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:not(:focus-visible){outline:none}.items-center{align-items:center}.bottom-0{bottom:0}.left-0{left:0}.right-0{right:0}.top-0{top:0}.justify-center{justify-content:center}.absolute{position:absolute}.relative{position:relative}.static{position:static}.s-text{color:var(--w-s-color-text)}.w-40{width:4rem}.w-max{width:max-content}.pb-0{padding-bottom:0}.pl-12{padding-left:1.2rem}.pr-12{padding-right:1.2rem}.cursor-default{cursor:default}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smoothing:grayscale}.font-bold{font-weight:700}.text-xs{font-size:var(--w-font-size-xs);line-height:var(--w-line-height-xs)}`;import{html as j,LitElement as S}from"lit";import{property as u,state as $}from"lit/decorators.js";import{classMap as P}from"lit/directives/class-map.js";import{css as M}from"lit";var k=M`
|
|
2441
2441
|
:host {
|
|
2442
2442
|
display: inline-block;
|
|
2443
2443
|
}
|
|
@@ -2462,17 +2462,17 @@ var _=Object.defineProperty;var Y=Object.getOwnPropertyDescriptor;var i=(e,t,o,r
|
|
|
2462
2462
|
--w-icon-size: 32px;
|
|
2463
2463
|
}
|
|
2464
2464
|
|
|
2465
|
-
`;var v=new Map,
|
|
2466
|
-
<button aria-label="${
|
|
2467
|
-
<w-icon name="Search" size="small" locale="${
|
|
2465
|
+
`;var v=new Map,T='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"></svg>';function X(e,o={}){var t;let r=(t=o.responseParser)!=null?t:(a=>a.text());return v.has(e)||v.set(e,fetch(e).then(r)),v.get(e)}var n=class extends S{constructor(){super(...arguments);this.name="";this.size="medium";this.locale="en";this.svg=null}async fetchIcon(r){let t=`https://assets.finn.no/pkg/eikons/v1/${this.locale}/${r}.svg`;try{let a=await X(t);return new DOMParser().parseFromString(a,"text/html").body.querySelector("svg")}catch(a){return null}}firstUpdated(){this.loadIcon()}updated(r){(r.has("name")||r.has("locale"))&&this.loadIcon()}async loadIcon(){if(!this.name){this.svg=null;return}let r=await this.fetchIcon(this.name);r||(r=new DOMParser().parseFromString(T,"text/html").body.firstElementChild),this.svg=r}render(){let r={"w-icon":!0,"w-icon--s":this.size==="small","w-icon--m":this.size==="medium","w-icon--l":this.size==="large"},t=typeof this.size=="string"&&this.size.endsWith("px")?`--w-icon-size: ${this.size};`:"";return j`<div class="${P(r)}" style="${t}" part="w-${this.name.toLowerCase()}">${this.svg}</div>`}};n.styles=[k],i([u({type:String,reflect:!0})],n.prototype,"name",2),i([u({type:String,reflect:!0})],n.prototype,"size",2),i([u({type:String,reflect:!0})],n.prototype,"locale",2),i([$()],n.prototype,"svg",2);customElements.get("w-icon")||customElements.define("w-icon",n);var Z=["en","nb","fi","da","sv"],h="en",c=e=>Z.find(o=>e===o||e.toLowerCase().includes(o))||h;function m(){if(typeof window=="undefined"){let e=process.env.NMP_LANGUAGE||Intl.DateTimeFormat().resolvedOptions().locale;return c(e)}try{let e=y(document);if(e)return c(e);let o=C();if(o)return c(o);let r=y(B());return r?c(r):h}catch(e){return console.warn("could not detect locale, falling back to source locale",e),h}}function B(){var e,o;try{return(o=(e=window.parent)==null?void 0:e.document)!=null?o:null}catch(r){return null}}function y(e){var o,r;try{return(r=(o=e==null?void 0:e.documentElement)==null?void 0:o.lang)!=null?r:""}catch(t){return""}}function C(){var e,o,r;try{return(r=(o=(e=window.frameElement)==null?void 0:e.getAttribute)==null?void 0:o.call(e,"lang"))!=null?r:""}catch(t){return""}}var _="absolute top-0 bottom-0 flex justify-center items-center focusable rounded-4 focus:[--w-outline-offset:-2px] bg-transparent ",O={wrapper:_+"right-0",wrapperWithLabel:"w-max pr-12",wrapperWithIcon:"w-40",label:"antialiased block relative cursor-default pb-0 font-bold text-xs s-text"},R={wrapper:_+"left-0",wrapperWithLabel:"w-max pl-12",wrapperWithIcon:"w-40",label:"antialiased block relative cursor-default pb-0 font-bold text-xs s-text"},s=class extends F{constructor(){super(...arguments);this.clear=!1;this.search=!1}get _classBase(){return this.slot==="suffix"?O:R}get _classes(){return g([this._classBase.wrapper,this.label?this._classBase.wrapperWithLabel:this._classBase.wrapperWithIcon])}get _searchButton(){return d`
|
|
2466
|
+
<button aria-label="${z(this.ariaLabel)}" class="${this._classes}" type="submit">
|
|
2467
|
+
<w-icon name="Search" size="small" locale="${m()}" class="flex"></w-icon>
|
|
2468
2468
|
</button>
|
|
2469
|
-
`}get _clearButton(){return
|
|
2470
|
-
<button aria-label="${
|
|
2471
|
-
<w-icon name="Close" size="small" locale="${
|
|
2469
|
+
`}get _clearButton(){return d`
|
|
2470
|
+
<button aria-label="${z(this.ariaLabel)}" class="${this._classes}" type="reset">
|
|
2471
|
+
<w-icon name="Close" size="small" locale="${m()}" class="flex"></w-icon>
|
|
2472
2472
|
</button>
|
|
2473
|
-
`}get _text(){return
|
|
2473
|
+
`}get _text(){return d`
|
|
2474
2474
|
<div class="${this._classes}">
|
|
2475
2475
|
<span class="${this._classBase.label}">${this.label}</span>
|
|
2476
2476
|
</div>
|
|
2477
|
-
`}get _markup(){if(this.label)return this._text;if(this.search)return this._searchButton;if(this.clear)return this._clearButton}render(){return
|
|
2477
|
+
`}get _markup(){if(this.label)return this._text;if(this.search)return this._searchButton;if(this.clear)return this._clearButton}render(){return d`${this._markup}`}};s.styles=[f,x],i([b({attribute:"aria-label"})],s.prototype,"ariaLabel",2),i([b({type:Boolean})],s.prototype,"clear",2),i([b({type:Boolean})],s.prototype,"search",2),i([b()],s.prototype,"label",2);customElements.get("w-affix")||customElements.define("w-affix",s);export{s as WarpAffix};
|
|
2478
2478
|
//# sourceMappingURL=affix.js.map
|