@politiet/sheriff-web-components 2.7.1 → 2.8.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/custom-elements.json +80 -8
- package/dist/mixins/sds-dialog-target-mixin.d.ts.map +1 -1
- package/dist/mixins/sds-dialog-target-mixin.js +4 -2
- package/dist/mixins/sds-dialog-target-mixin.js.map +1 -1
- package/dist/mixins/sds-form-control-mixin.d.ts +1 -0
- package/dist/mixins/sds-form-control-mixin.d.ts.map +1 -1
- package/dist/mixins/sds-form-control-mixin.js +7 -0
- package/dist/mixins/sds-form-control-mixin.js.map +1 -1
- package/dist/mixins/sds-popover-target-mixin.d.ts +1 -1
- package/dist/mixins/sds-popover-target-mixin.d.ts.map +1 -1
- package/dist/mixins/sds-popover-target-mixin.js.map +1 -1
- package/dist/sds-button/sds-button.component.d.ts +3 -1
- package/dist/sds-button/sds-button.component.d.ts.map +1 -1
- package/dist/sds-button/sds-button.component.js +5 -1
- package/dist/sds-button/sds-button.component.js.map +1 -1
- package/dist/sds-button/sds-button.styles.d.ts.map +1 -1
- package/dist/sds-button/sds-button.styles.js +87 -3
- package/dist/sds-button/sds-button.styles.js.map +1 -1
- package/dist/sds-card/sds-card.styles.d.ts.map +1 -1
- package/dist/sds-card/sds-card.styles.js +9 -3
- package/dist/sds-card/sds-card.styles.js.map +1 -1
- package/dist/sds-checkbox/sds-checkbox.styles.d.ts.map +1 -1
- package/dist/sds-checkbox/sds-checkbox.styles.js +4 -2
- package/dist/sds-checkbox/sds-checkbox.styles.js.map +1 -1
- package/dist/sds-details/sds-details.styles.js +6 -6
- package/dist/sds-details/sds-details.styles.js.map +1 -1
- package/dist/sds-dialog/sds-dialog.styles.d.ts.map +1 -1
- package/dist/sds-dialog/sds-dialog.styles.js +8 -2
- package/dist/sds-dialog/sds-dialog.styles.js.map +1 -1
- package/dist/sds-popover/assets/popover-styles.d.ts.map +1 -1
- package/dist/sds-popover/assets/popover-styles.js +1 -1
- package/dist/sds-popover/assets/popover-styles.js.map +1 -1
- package/dist/sds-radio/sds-radio.styles.d.ts.map +1 -1
- package/dist/sds-radio/sds-radio.styles.js +10 -3
- package/dist/sds-radio/sds-radio.styles.js.map +1 -1
- package/dist/sds-select/sds-select.component.d.ts +1 -1
- package/dist/sds-select/sds-select.component.d.ts.map +1 -1
- package/dist/sds-select/sds-select.component.js +2 -1
- package/dist/sds-select/sds-select.component.js.map +1 -1
- package/dist/sds-select/sds-select.styles.d.ts.map +1 -1
- package/dist/sds-select/sds-select.styles.js +3 -2
- package/dist/sds-select/sds-select.styles.js.map +1 -1
- package/dist/sds-stepper-step/sds-stepper-step.styles.d.ts.map +1 -1
- package/dist/sds-stepper-step/sds-stepper-step.styles.js +4 -3
- package/dist/sds-stepper-step/sds-stepper-step.styles.js.map +1 -1
- package/dist/sds-switch/sds-switch.styles.js +6 -6
- package/dist/sds-switch/sds-switch.styles.js.map +1 -1
- package/dist/sds-text/sds-text.styles.d.ts.map +1 -1
- package/dist/sds-text/sds-text.styles.js +2 -1
- package/dist/sds-text/sds-text.styles.js.map +1 -1
- package/dist/sds-textarea/sds-textarea.d.ts +1 -1
- package/dist/sds-textarea/sds-textarea.d.ts.map +1 -1
- package/dist/sds-textarea/sds-textarea.js +6 -1
- package/dist/sds-textarea/sds-textarea.js.map +1 -1
- package/dist/sds-textarea/sds-textarea.styles.d.ts.map +1 -1
- package/dist/sds-textarea/sds-textarea.styles.js +11 -3
- package/dist/sds-textarea/sds-textarea.styles.js.map +1 -1
- package/dist/sds-textfield/sds-textfield.d.ts +5 -1
- package/dist/sds-textfield/sds-textfield.d.ts.map +1 -1
- package/dist/sds-textfield/sds-textfield.js +27 -10
- package/dist/sds-textfield/sds-textfield.js.map +1 -1
- package/dist/sds-textfield/sds-textfield.styles.d.ts.map +1 -1
- package/dist/sds-textfield/sds-textfield.styles.js +4 -3
- package/dist/sds-textfield/sds-textfield.styles.js.map +1 -1
- package/dist/shared/assets/positioning.js +1 -1
- package/dist/sheriff-web-components.js +294 -175
- package/package.json +2 -2
- package/web-types.json +102 -10
- package/dist/playwright-util/custom-matchers.d.ts +0 -7
- package/dist/playwright-util/custom-matchers.d.ts.map +0 -1
- package/dist/playwright-util/custom-matchers.js +0 -21
- package/dist/playwright-util/custom-matchers.js.map +0 -1
- package/dist/playwright-util/form.d.ts +0 -3
- package/dist/playwright-util/form.d.ts.map +0 -1
- package/dist/playwright-util/form.js +0 -44
- package/dist/playwright-util/form.js.map +0 -1
- package/dist/sds-button/sds-button.spec.d.ts +0 -2
- package/dist/sds-button/sds-button.spec.d.ts.map +0 -1
- package/dist/sds-button/sds-button.spec.js +0 -182
- package/dist/sds-button/sds-button.spec.js.map +0 -1
- package/dist/sds-checkbox/sds-checkbox.spec.d.ts +0 -2
- package/dist/sds-checkbox/sds-checkbox.spec.d.ts.map +0 -1
- package/dist/sds-checkbox/sds-checkbox.spec.js +0 -74
- package/dist/sds-checkbox/sds-checkbox.spec.js.map +0 -1
- package/dist/sds-dialog/sds-dialog.spec.d.ts +0 -2
- package/dist/sds-dialog/sds-dialog.spec.d.ts.map +0 -1
- package/dist/sds-dialog/sds-dialog.spec.js +0 -64
- package/dist/sds-dialog/sds-dialog.spec.js.map +0 -1
- package/dist/sds-radio/sds-radio.spec.d.ts +0 -2
- package/dist/sds-radio/sds-radio.spec.d.ts.map +0 -1
- package/dist/sds-radio/sds-radio.spec.js +0 -71
- package/dist/sds-radio/sds-radio.spec.js.map +0 -1
- package/dist/sds-textfield/sds-textfield.spec.d.ts +0 -2
- package/dist/sds-textfield/sds-textfield.spec.d.ts.map +0 -1
- package/dist/sds-textfield/sds-textfield.spec.js +0 -137
- package/dist/sds-textfield/sds-textfield.spec.js.map +0 -1
- package/dist/sds-tooltip/sds-tooltip.spec.d.ts +0 -2
- package/dist/sds-tooltip/sds-tooltip.spec.d.ts.map +0 -1
- package/dist/sds-tooltip/sds-tooltip.spec.js +0 -35
- package/dist/sds-tooltip/sds-tooltip.spec.js.map +0 -1
package/custom-elements.json
CHANGED
|
@@ -387,6 +387,16 @@
|
|
|
387
387
|
"attribute": "icon",
|
|
388
388
|
"reflects": true
|
|
389
389
|
},
|
|
390
|
+
{
|
|
391
|
+
"kind": "field",
|
|
392
|
+
"name": "inverted",
|
|
393
|
+
"type": {
|
|
394
|
+
"text": "boolean"
|
|
395
|
+
},
|
|
396
|
+
"default": "false",
|
|
397
|
+
"attribute": "inverted",
|
|
398
|
+
"reflects": true
|
|
399
|
+
},
|
|
390
400
|
{
|
|
391
401
|
"kind": "field",
|
|
392
402
|
"name": "loading",
|
|
@@ -514,6 +524,14 @@
|
|
|
514
524
|
"default": "false",
|
|
515
525
|
"fieldName": "icon"
|
|
516
526
|
},
|
|
527
|
+
{
|
|
528
|
+
"name": "inverted",
|
|
529
|
+
"type": {
|
|
530
|
+
"text": "boolean"
|
|
531
|
+
},
|
|
532
|
+
"default": "false",
|
|
533
|
+
"fieldName": "inverted"
|
|
534
|
+
},
|
|
517
535
|
{
|
|
518
536
|
"name": "loading",
|
|
519
537
|
"type": {
|
|
@@ -664,6 +682,18 @@
|
|
|
664
682
|
"module": "src/sds-button/sds-button.component.ts"
|
|
665
683
|
}
|
|
666
684
|
},
|
|
685
|
+
{
|
|
686
|
+
"name": "inverted",
|
|
687
|
+
"type": {
|
|
688
|
+
"text": "boolean"
|
|
689
|
+
},
|
|
690
|
+
"default": "false",
|
|
691
|
+
"fieldName": "inverted",
|
|
692
|
+
"inheritedFrom": {
|
|
693
|
+
"name": "SDSButtonComponent",
|
|
694
|
+
"module": "src/sds-button/sds-button.component.ts"
|
|
695
|
+
}
|
|
696
|
+
},
|
|
667
697
|
{
|
|
668
698
|
"name": "loading",
|
|
669
699
|
"type": {
|
|
@@ -849,6 +879,20 @@
|
|
|
849
879
|
"module": "src/sds-button/sds-button.component.ts"
|
|
850
880
|
}
|
|
851
881
|
},
|
|
882
|
+
{
|
|
883
|
+
"kind": "field",
|
|
884
|
+
"name": "inverted",
|
|
885
|
+
"type": {
|
|
886
|
+
"text": "boolean"
|
|
887
|
+
},
|
|
888
|
+
"default": "false",
|
|
889
|
+
"attribute": "inverted",
|
|
890
|
+
"reflects": true,
|
|
891
|
+
"inheritedFrom": {
|
|
892
|
+
"name": "SDSButtonComponent",
|
|
893
|
+
"module": "src/sds-button/sds-button.component.ts"
|
|
894
|
+
}
|
|
895
|
+
},
|
|
852
896
|
{
|
|
853
897
|
"kind": "field",
|
|
854
898
|
"name": "loading",
|
|
@@ -4434,8 +4478,7 @@
|
|
|
4434
4478
|
},
|
|
4435
4479
|
{
|
|
4436
4480
|
"kind": "method",
|
|
4437
|
-
"name": "updateValidity"
|
|
4438
|
-
"privacy": "private"
|
|
4481
|
+
"name": "updateValidity"
|
|
4439
4482
|
},
|
|
4440
4483
|
{
|
|
4441
4484
|
"kind": "method",
|
|
@@ -4866,7 +4909,6 @@
|
|
|
4866
4909
|
{
|
|
4867
4910
|
"kind": "method",
|
|
4868
4911
|
"name": "updateValidity",
|
|
4869
|
-
"privacy": "private",
|
|
4870
4912
|
"inheritedFrom": {
|
|
4871
4913
|
"name": "SDSSelectComponent",
|
|
4872
4914
|
"module": "src/sds-select/sds-select.component.ts"
|
|
@@ -5828,8 +5870,7 @@
|
|
|
5828
5870
|
},
|
|
5829
5871
|
{
|
|
5830
5872
|
"kind": "method",
|
|
5831
|
-
"name": "updateValidity"
|
|
5832
|
-
"privacy": "private"
|
|
5873
|
+
"name": "updateValidity"
|
|
5833
5874
|
},
|
|
5834
5875
|
{
|
|
5835
5876
|
"kind": "method",
|
|
@@ -6210,6 +6251,24 @@
|
|
|
6210
6251
|
"attribute": "maxlength",
|
|
6211
6252
|
"reflects": true
|
|
6212
6253
|
},
|
|
6254
|
+
{
|
|
6255
|
+
"kind": "field",
|
|
6256
|
+
"name": "min",
|
|
6257
|
+
"type": {
|
|
6258
|
+
"text": "SDSTextFieldProps['min'] | undefined"
|
|
6259
|
+
},
|
|
6260
|
+
"attribute": "min",
|
|
6261
|
+
"reflects": true
|
|
6262
|
+
},
|
|
6263
|
+
{
|
|
6264
|
+
"kind": "field",
|
|
6265
|
+
"name": "max",
|
|
6266
|
+
"type": {
|
|
6267
|
+
"text": "SDSTextFieldProps['max'] | undefined"
|
|
6268
|
+
},
|
|
6269
|
+
"attribute": "max",
|
|
6270
|
+
"reflects": true
|
|
6271
|
+
},
|
|
6213
6272
|
{
|
|
6214
6273
|
"kind": "field",
|
|
6215
6274
|
"name": "size",
|
|
@@ -6253,8 +6312,7 @@
|
|
|
6253
6312
|
},
|
|
6254
6313
|
{
|
|
6255
6314
|
"kind": "method",
|
|
6256
|
-
"name": "updateValidity"
|
|
6257
|
-
"privacy": "private"
|
|
6315
|
+
"name": "updateValidity"
|
|
6258
6316
|
},
|
|
6259
6317
|
{
|
|
6260
6318
|
"kind": "field",
|
|
@@ -6459,6 +6517,20 @@
|
|
|
6459
6517
|
},
|
|
6460
6518
|
"fieldName": "maxlength"
|
|
6461
6519
|
},
|
|
6520
|
+
{
|
|
6521
|
+
"name": "min",
|
|
6522
|
+
"type": {
|
|
6523
|
+
"text": "SDSTextFieldProps['min'] | undefined"
|
|
6524
|
+
},
|
|
6525
|
+
"fieldName": "min"
|
|
6526
|
+
},
|
|
6527
|
+
{
|
|
6528
|
+
"name": "max",
|
|
6529
|
+
"type": {
|
|
6530
|
+
"text": "SDSTextFieldProps['max'] | undefined"
|
|
6531
|
+
},
|
|
6532
|
+
"fieldName": "max"
|
|
6533
|
+
},
|
|
6462
6534
|
{
|
|
6463
6535
|
"name": "size",
|
|
6464
6536
|
"type": {
|
|
@@ -6646,7 +6718,7 @@
|
|
|
6646
6718
|
"type": {
|
|
6647
6719
|
"text": "string"
|
|
6648
6720
|
},
|
|
6649
|
-
"default": "':host{--_ds-floating:top;--_ds-floating-arrow-size:0;--_ds-floating-arrow-visibility:inherit;animation:ds-fade-in .15s ease-in-out forwards;inset:0 auto auto 0;margin:0;overflow:visible;position:absolute}:host:before{background:inherit;border:inherit;border-left-color:transparent;border-top-color:transparent;box-sizing:border-box;content:\"\";height:var(--_ds-floating-arrow-size);left:var(--_ds-floating-arrow-x,50%);position:absolute;rotate:45deg;top:var(--_ds-floating-arrow-y,100%);translate:-50% -50%;visibility:var(--_ds-floating-arrow-visibility);width:var(--_ds-floating-arrow-size)}:host[data-overscroll=contain]{--_ds-floating-overscroll:contain;overflow:auto;overscroll-behavior:contain}:host{--_ds-floating:var(--dsc-popover-placement);--_ds-floating-arrow-size:var(--dsc-popover-arrow-size);--dsc-popover-background:var(--ds-color-surface-default);--dsc-popover-border-width:var(--ds-border-width-default);--dsc-popover-border-style:solid;--dsc-popover-border-color:var(--ds-color-border-default);--dsc-popover-color:var(--ds-color-text-default);--dsc-popover-arrow-size:var(--ds-size-3);--dsc-popover-border-radius:var(--ds-border-radius-md);--dsc-popover-max-width:300px;--dsc-popover-padding:var(--ds-size-3) var(--ds-size-4);--dsc-popover-box-shadow:var(--ds-shadow-md);--dsc-popover-placement:top;background:var(--dsc-popover-background);border-color:var(--dsc-popover-border-color);border-radius:var(--dsc-popover-border-radius);border-style:var(--dsc-popover-border-style);border-width:var(--dsc-popover-border-width);box-shadow:var(--dsc-popover-box-shadow);box-sizing:border-box;color:var(--dsc-popover-color);max-width:var(--dsc-popover-max-width);padding:var(--dsc-popover-padding);&[data-floating|=top]:before{rotate:45deg;top:100%}&[data-floating|=right]:before{left:0;rotate:135deg}&[data-floating|=bottom]:before{rotate:-135deg;top:0}&[data-floating|=left]:before{left:100%;rotate:-45deg}}:host[data-variant=default]{--dsc-popover-background:var(--ds-color-surface-default)}:host[data-variant=tinted]{--dsc-popover-background:var(--ds-color-surface-tinted)}[data-popover=inline]{all:unset;cursor:pointer;font-size:inherit
|
|
6721
|
+
"default": "':host{--_ds-floating:top;--_ds-floating-arrow-size:0;--_ds-floating-arrow-visibility:inherit;animation:ds-fade-in .15s ease-in-out forwards;inset:0 auto auto 0;margin:0;overflow:visible;position:absolute}:host:before{background:inherit;border:inherit;border-left-color:transparent;border-top-color:transparent;box-sizing:border-box;content:\"\";height:var(--_ds-floating-arrow-size);left:var(--_ds-floating-arrow-x,50%);position:absolute;rotate:45deg;top:var(--_ds-floating-arrow-y,100%);translate:-50% -50%;visibility:var(--_ds-floating-arrow-visibility);width:var(--_ds-floating-arrow-size)}:host[data-overscroll=contain]{--_ds-floating-overscroll:contain;overflow:auto;overscroll-behavior:contain}:host{--_ds-floating:var(--dsc-popover-placement);--_ds-floating-arrow-size:var(--dsc-popover-arrow-size);--dsc-popover-background:var(--ds-color-surface-default);--dsc-popover-border-width:var(--ds-border-width-default);--dsc-popover-border-style:solid;--dsc-popover-border-color:var(--ds-color-border-default);--dsc-popover-color:var(--ds-color-text-default);--dsc-popover-arrow-size:var(--ds-size-3);--dsc-popover-border-radius:var(--ds-border-radius-md);--dsc-popover-max-width:300px;--dsc-popover-padding:var(--ds-size-3) var(--ds-size-4);--dsc-popover-box-shadow:var(--ds-shadow-md);--dsc-popover-placement:top;background:var(--dsc-popover-background);border-color:var(--dsc-popover-border-color);border-radius:var(--dsc-popover-border-radius);border-style:var(--dsc-popover-border-style);border-width:var(--dsc-popover-border-width);box-shadow:var(--dsc-popover-box-shadow);box-sizing:border-box;color:var(--dsc-popover-color);max-width:var(--dsc-popover-max-width);padding:var(--dsc-popover-padding);&[data-floating|=top]:before{rotate:45deg;top:100%}&[data-floating|=right]:before{left:0;rotate:135deg}&[data-floating|=bottom]:before{rotate:-135deg;top:0}&[data-floating|=left]:before{left:100%;rotate:-45deg}}:host[data-variant=default]{--dsc-popover-background:var(--ds-color-surface-default)}:host[data-variant=tinted]{--dsc-popover-background:var(--ds-color-surface-tinted)}[data-popover=inline]{all:unset;cursor:pointer;font-size:inherit;text-decoration:underline dotted;text-underline-offset:.27em}[data-popover=inline]:not([hidden]){display:inline}[data-popover=inline]:focus-visible{box-shadow:var(--_ds--focus,var(--dsc-focus-boxShadow));outline:var(--_ds--focus,var(--dsc-focus-outline));outline-offset:var(--_ds--focus,var(--ds-border-width-focus))}[data-popover=inline]:focus-visible *{--_ds--focus: }'"
|
|
6650
6722
|
}
|
|
6651
6723
|
],
|
|
6652
6724
|
"exports": [
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-dialog-target-mixin.d.ts","sourceRoot":"","sources":["../../src/mixins/sds-dialog-target-mixin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAkB,MAAM,KAAK,CAAC;AAEjD,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAIxC,KAAK,aAAa,GAAG,OAAO,GAAG,eAAe,GAAG,YAAY,CAAC;
|
|
1
|
+
{"version":3,"file":"sds-dialog-target-mixin.d.ts","sourceRoot":"","sources":["../../src/mixins/sds-dialog-target-mixin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAkB,MAAM,KAAK,CAAC;AAEjD,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAIxC,KAAK,aAAa,GAAG,OAAO,GAAG,eAAe,GAAG,YAAY,CAAC;AAM9D,MAAM,WAAW,6BAA6B;IAC7C,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,gBAAgB,CAAC,EAAE,aAAa,CAAC;IAC1C,QAAQ,CAAC,mBAAmB,CAAC,EAAE,MAAM,CAAC;IACtC,gBAAgB,IAAI,IAAI,CAAC;CACzB;AAED,wBAAgB,oBAAoB,CAAC,CAAC,SAAS,aAAa,CAAC,UAAU,CAAC,EAAE,UAAU,EAAE,CAAC,GAAG,aAAa,CAAC,6BAA6B,CAAC,GAAG,CAAC,CAkHzI"}
|
|
@@ -5,7 +5,9 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
5
5
|
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
6
|
};
|
|
7
7
|
import { property } from 'lit/decorators.js';
|
|
8
|
-
|
|
8
|
+
function isSDSDialog(node) {
|
|
9
|
+
return node != null && 'showModal' in node && 'requestClose' in node && 'close' in node && 'open' in node;
|
|
10
|
+
}
|
|
9
11
|
export function SDSDialogTargetMixin(superClass) {
|
|
10
12
|
class SDSDialogTarget extends superClass {
|
|
11
13
|
get effectiveCommand() {
|
|
@@ -62,7 +64,7 @@ export function SDSDialogTargetMixin(superClass) {
|
|
|
62
64
|
}
|
|
63
65
|
const root = this.getRootNode();
|
|
64
66
|
const targetDialog = root.getElementById?.(commandFor) ?? document.getElementById(commandFor);
|
|
65
|
-
if (!
|
|
67
|
+
if (!isSDSDialog(targetDialog)) {
|
|
66
68
|
this._clearAriaFields(internalButton);
|
|
67
69
|
return;
|
|
68
70
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-dialog-target-mixin.js","sourceRoot":"","sources":["../../src/mixins/sds-dialog-target-mixin.ts"],"names":[],"mappings":";;;;;;AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"sds-dialog-target-mixin.js","sourceRoot":"","sources":["../../src/mixins/sds-dialog-target-mixin.ts"],"names":[],"mappings":";;;;;;AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAO7C,SAAS,WAAW,CAAC,IAAoB;IACxC,OAAO,IAAI,IAAI,IAAI,IAAI,WAAW,IAAI,IAAI,IAAI,cAAc,IAAI,IAAI,IAAI,OAAO,IAAI,IAAI,IAAI,MAAM,IAAI,IAAI,CAAC;AAC3G,CAAC;AAUD,MAAM,UAAU,oBAAoB,CAAsC,UAAa;IACtF,MAAM,eAAgB,SAAQ,UAAU;QASvC,IAAI,gBAAgB;YACnB,OAAO,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,WAAW,CAAC;QACzC,CAAC;QAED,IAAI,mBAAmB;YACtB,OAAO,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,cAAc,CAAC;QAC/C,CAAC;QAEQ,OAAO,CAAC,OAAuB;YACvC,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;YAEvB,IAAI,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC,IAAI,OAAO,CAAC,GAAG,CAAC,YAAY,CAAC,IAAI,OAAO,CAAC,GAAG,CAAC,aAAa,CAAC,IAAI,OAAO,CAAC,GAAG,CAAC,gBAAgB,CAAC,EAAE,CAAC;gBACxH,IAAI,CAAC,oBAAoB,EAAE,CAAC;YAC7B,CAAC;QACF,CAAC;QAEQ,oBAAoB;YAC5B,KAAK,CAAC,oBAAoB,EAAE,CAAC;YAC7B,IAAI,CAAC,sBAAsB,EAAE,CAAC;QAC/B,CAAC;QAEO,sBAAsB;YAC7B,IAAI,IAAI,CAAC,mBAAmB,EAAE,CAAC;gBAC9B,IAAI,CAAC,mBAAmB,CAAC,UAAU,EAAE,CAAC;gBACtC,IAAI,CAAC,mBAAmB,GAAG,SAAS,CAAC;YACtC,CAAC;YACD,IAAI,CAAC,cAAc,GAAG,SAAS,CAAC;QACjC,CAAC;QAEO,cAAc,CAAC,MAAyB,EAAE,MAAiB;YAClE,+DAA+D;YAC/D,IAAI,CAAC,mBAAmB,GAAG,IAAI,gBAAgB,CAAC,CAAC,SAAS,EAAE,EAAE;gBAC7D,KAAK,MAAM,QAAQ,IAAI,SAAS,EAAE,CAAC;oBAClC,IAAI,QAAQ,CAAC,aAAa,KAAK,MAAM,EAAE,CAAC;wBACvC,MAAM,MAAM,GAAG,MAAM,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;wBAC3C,MAAM,CAAC,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC;oBACtD,CAAC;gBACF,CAAC;YACF,CAAC,CAAC,CAAC;YACH,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC,MAAM,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,eAAe,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;QAC3F,CAAC;QAEO,gBAAgB,CAAC,MAAyB;YACjD,MAAM,CAAC,eAAe,CAAC,eAAe,CAAC,CAAC;YACxC,MAAM,CAAC,eAAe,CAAC,eAAe,CAAC,CAAC;YACxC,MAAM,CAAC,eAAe,CAAC,eAAe,CAAC,CAAC;QACzC,CAAC;QAEO,oBAAoB;YAC3B,IAAI,CAAC,sBAAsB,EAAE,CAAC;YAE9B,MAAM,cAAc,GAAG,IAAI,CAAC,UAAU,EAAE,aAAa,CAAoB,UAAU,CAAC,CAAC;YACrF,IAAI,CAAC,cAAc,EAAE,CAAC;gBACrB,OAAO;YACR,CAAC;YAED,MAAM,OAAO,GAAG,IAAI,CAAC,gBAAgB,CAAC;YACtC,MAAM,UAAU,GAAG,IAAI,CAAC,mBAAmB,CAAC;YAE5C,IAAI,CAAC,UAAU,IAAI,CAAC,OAAO,EAAE,CAAC;gBAC7B,IAAI,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;gBACtC,OAAO;YACR,CAAC;YAED,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,EAA2B,CAAC;YACzD,MAAM,YAAY,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC,UAAU,CAAC,IAAI,QAAQ,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC;YAE9F,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,EAAE,CAAC;gBAChC,IAAI,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;gBACtC,OAAO;YACR,CAAC;YAED,IAAI,CAAC,cAAc,GAAG,YAAY,CAAC;YAEnC,IAAI,OAAO,KAAK,YAAY,EAAE,CAAC;gBAC9B,cAAc,CAAC,YAAY,CAAC,eAAe,EAAE,QAAQ,CAAC,CAAC;gBACvD,cAAc,CAAC,YAAY,CAAC,eAAe,EAAE,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CAAC;gBACxE,cAAc,CAAC,YAAY,CAAC,eAAe,EAAE,UAAU,CAAC,CAAC;gBACzD,IAAI,CAAC,cAAc,CAAC,cAAc,EAAE,YAAY,CAAC,CAAC;YACnD,CAAC;iBAAM,CAAC;gBACP,IAAI,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;YACvC,CAAC;QACF,CAAC;QAED,gBAAgB;YACf,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;gBAC1B,OAAO;YACR,CAAC;YAED,QAAQ,IAAI,CAAC,gBAAgB,EAAE,CAAC;gBAC/B,KAAK,YAAY;oBAChB,IAAI,CAAC,cAAc,CAAC,SAAS,EAAE,CAAC;oBAChC,MAAM;gBACP,KAAK,OAAO;oBACX,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,CAAC;oBAC5B,MAAM;gBACP,KAAK,eAAe;oBACnB,IAAI,CAAC,cAAc,CAAC,YAAY,EAAE,CAAC;oBACnC,MAAM;YACR,CAAC;QACF,CAAC;KACD;IA7GiE;QAAhE,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;oDAAyB;IACrB;QAAnE,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;uDAAqB;IACjC;QAAtD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,cAAc,EAAE,CAAC;wDAA6B;IACzB;QAAzD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,iBAAiB,EAAE,CAAC;2DAAyB;IA4GnF,OAAO,eAAe,CAAC;AACxB,CAAC","sourcesContent":["import { LitElement, PropertyValues } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { Constructable } from './types';\n\nimport type { SDSDialog } from '../sds-dialog/sds-dialog';\n\ntype DialogCommand = 'close' | 'request-close' | 'show-modal';\n\nfunction isSDSDialog(node: Element | null): node is SDSDialog {\n\treturn node != null && 'showModal' in node && 'requestClose' in node && 'close' in node && 'open' in node;\n}\n\nexport interface SDSDialogTargetMixinInterface {\n\tcommand?: DialogCommand;\n\tcommandFor?: string;\n\treadonly effectiveCommand?: DialogCommand;\n\treadonly effectiveCommandFor?: string;\n\trunDialogCommand(): void;\n}\n\nexport function SDSDialogTargetMixin<T extends Constructable<LitElement>>(superClass: T): Constructable<SDSDialogTargetMixinInterface> & T {\n\tclass SDSDialogTarget extends superClass {\n\t\t@property({ type: String, attribute: 'command', reflect: true }) command?: DialogCommand;\n\t\t@property({ type: String, attribute: 'commandfor', reflect: true }) commandFor?: string;\n\t\t@property({ type: String, attribute: 'data-command' }) dataCommand?: DialogCommand;\n\t\t@property({ type: String, attribute: 'data-commandfor' }) dataCommandFor?: string;\n\n\t\tprivate _dialogElement?: SDSDialog;\n\t\tprivate _dialogOpenObserver?: MutationObserver;\n\n\t\tget effectiveCommand(): DialogCommand | undefined {\n\t\t\treturn this.command ?? this.dataCommand;\n\t\t}\n\n\t\tget effectiveCommandFor(): string | undefined {\n\t\t\treturn this.commandFor ?? this.dataCommandFor;\n\t\t}\n\n\t\toverride updated(changed: PropertyValues) {\n\t\t\tsuper.updated(changed);\n\n\t\t\tif (changed.has('command') || changed.has('commandFor') || changed.has('dataCommand') || changed.has('dataCommandFor')) {\n\t\t\t\tthis._updateCommandTarget();\n\t\t\t}\n\t\t}\n\n\t\toverride disconnectedCallback() {\n\t\t\tsuper.disconnectedCallback();\n\t\t\tthis._cleanupDialogObserver();\n\t\t}\n\n\t\tprivate _cleanupDialogObserver() {\n\t\t\tif (this._dialogOpenObserver) {\n\t\t\t\tthis._dialogOpenObserver.disconnect();\n\t\t\t\tthis._dialogOpenObserver = undefined;\n\t\t\t}\n\t\t\tthis._dialogElement = undefined;\n\t\t}\n\n\t\tprivate _observeDialog(button: HTMLButtonElement, dialog: SDSDialog) {\n\t\t\t// Observe the 'open' attribute to detect when the dialog opens\n\t\t\tthis._dialogOpenObserver = new MutationObserver((mutations) => {\n\t\t\t\tfor (const mutation of mutations) {\n\t\t\t\t\tif (mutation.attributeName === 'open') {\n\t\t\t\t\t\tconst isOpen = dialog.hasAttribute('open');\n\t\t\t\t\t\tbutton.setAttribute('aria-expanded', String(isOpen));\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t});\n\t\t\tthis._dialogOpenObserver.observe(dialog, { attributes: true, attributeFilter: ['open'] });\n\t\t}\n\n\t\tprivate _clearAriaFields(button: HTMLButtonElement) {\n\t\t\tbutton.removeAttribute('aria-haspopup');\n\t\t\tbutton.removeAttribute('aria-expanded');\n\t\t\tbutton.removeAttribute('aria-controls');\n\t\t}\n\n\t\tprivate _updateCommandTarget() {\n\t\t\tthis._cleanupDialogObserver();\n\n\t\t\tconst internalButton = this.shadowRoot?.querySelector<HTMLButtonElement>('#control');\n\t\t\tif (!internalButton) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst command = this.effectiveCommand;\n\t\t\tconst commandFor = this.effectiveCommandFor;\n\n\t\t\tif (!commandFor || !command) {\n\t\t\t\tthis._clearAriaFields(internalButton);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst root = this.getRootNode() as Document | ShadowRoot;\n\t\t\tconst targetDialog = root.getElementById?.(commandFor) ?? document.getElementById(commandFor);\n\n\t\t\tif (!isSDSDialog(targetDialog)) {\n\t\t\t\tthis._clearAriaFields(internalButton);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tthis._dialogElement = targetDialog;\n\n\t\t\tif (command === 'show-modal') {\n\t\t\t\tinternalButton.setAttribute('aria-haspopup', 'dialog');\n\t\t\t\tinternalButton.setAttribute('aria-expanded', String(targetDialog.open));\n\t\t\t\tinternalButton.setAttribute('aria-controls', commandFor);\n\t\t\t\tthis._observeDialog(internalButton, targetDialog);\n\t\t\t} else {\n\t\t\t\tthis._clearAriaFields(internalButton);\n\t\t\t}\n\t\t}\n\n\t\trunDialogCommand(): void {\n\t\t\tif (!this._dialogElement) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tswitch (this.effectiveCommand) {\n\t\t\t\tcase 'show-modal':\n\t\t\t\t\tthis._dialogElement.showModal();\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'close':\n\t\t\t\t\tthis._dialogElement.close();\n\t\t\t\t\tbreak;\n\t\t\t\tcase 'request-close':\n\t\t\t\t\tthis._dialogElement.requestClose();\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\t}\n\n\treturn SDSDialogTarget;\n}\n"]}
|
|
@@ -14,6 +14,7 @@ export interface SDSFormControlMixinInterface extends SDSFormControlProps {
|
|
|
14
14
|
readonly internals: ElementInternals;
|
|
15
15
|
readonly form: HTMLFormElement | null;
|
|
16
16
|
formDisabledCallback(disabled: boolean): void;
|
|
17
|
+
updateValidity(): void;
|
|
17
18
|
}
|
|
18
19
|
export declare function SDSFormControlMixin<T extends Constructable<LitElement>>(superClass: T): Constructable<SDSFormControlMixinInterface> & T;
|
|
19
20
|
//# sourceMappingURL=sds-form-control-mixin.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-form-control-mixin.d.ts","sourceRoot":"","sources":["../../src/mixins/sds-form-control-mixin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,
|
|
1
|
+
{"version":3,"file":"sds-form-control-mixin.d.ts","sourceRoot":"","sources":["../../src/mixins/sds-form-control-mixin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAkB,MAAM,KAAK,CAAC;AAEjD,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAExC,MAAM,WAAW,mBAAmB;IACnC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,wBAAwB;IACxC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,4BAA6B,SAAQ,mBAAmB;IACxE,QAAQ,CAAC,SAAS,EAAE,gBAAgB,CAAC;IACrC,QAAQ,CAAC,IAAI,EAAE,eAAe,GAAG,IAAI,CAAC;IACtC,oBAAoB,CAAC,QAAQ,EAAE,OAAO,GAAG,IAAI,CAAC;IAC9C,cAAc,IAAI,IAAI,CAAC;CACvB;AAED,wBAAgB,mBAAmB,CAAC,CAAC,SAAS,aAAa,CAAC,UAAU,CAAC,EAAE,UAAU,EAAE,CAAC,GAAG,aAAa,CAAC,4BAA4B,CAAC,GAAG,CAAC,CAwCvI"}
|
|
@@ -20,6 +20,13 @@ export function SDSFormControlMixin(superClass) {
|
|
|
20
20
|
formDisabledCallback(disabled) {
|
|
21
21
|
this.disabled = disabled;
|
|
22
22
|
}
|
|
23
|
+
// Make sure to call updateValidity on first update
|
|
24
|
+
// to register validity as soon as possible
|
|
25
|
+
firstUpdated(changedProperties) {
|
|
26
|
+
super.firstUpdated(changedProperties);
|
|
27
|
+
this.updateValidity();
|
|
28
|
+
}
|
|
29
|
+
updateValidity() { }
|
|
23
30
|
}
|
|
24
31
|
SDSFormControl.formAssociated = true;
|
|
25
32
|
SDSFormControl.shadowRootOptions = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-form-control-mixin.js","sourceRoot":"","sources":["../../src/mixins/sds-form-control-mixin.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,
|
|
1
|
+
{"version":3,"file":"sds-form-control-mixin.js","sourceRoot":"","sources":["../../src/mixins/sds-form-control-mixin.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAkB,MAAM,KAAK,CAAC;AACjD,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAsB7C,MAAM,UAAU,mBAAmB,CAAsC,UAAa;IACrF,MAAM,cAAe,SAAQ,UAAU;QAetC,YAAY,GAAG,IAAW;YACzB,KAAK,CAAC,GAAG,IAAI,CAAC,CAAC;YAJ4B,aAAQ,GAAY,KAAK,CAAC;YACH,aAAQ,GAAY,KAAK,CAAC;YAI5F,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QACzC,CAAC;QAED,IAAI,IAAI;YACP,OAAO,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;QAC5B,CAAC;QAED,oBAAoB,CAAC,QAAiB;YACrC,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;QAC1B,CAAC;QAED,mDAAmD;QACnD,2CAA2C;QAClC,YAAY,CAAC,iBAAiC;YACtD,KAAK,CAAC,YAAY,CAAC,iBAAiB,CAAC,CAAC;YACtC,IAAI,CAAC,cAAc,EAAE,CAAC;QACvB,CAAC;QAED,cAAc,KAAU,CAAC;;IAlClB,6BAAc,GAAG,IAAI,AAAP,CAAQ;IACtB,gCAAiB,GAAmB;QAC1C,GAAG,UAAU,CAAC,iBAAiB;QAC/B,cAAc,EAAE,IAAI;KACpB,AAHuB,CAGtB;IAMyC;QAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;gDAAe;IACb;QAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;oDAA2B;IACH;QAAlE,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;oDAA2B;IAyB9F,OAAO,cAAc,CAAC;AACvB,CAAC","sourcesContent":["import { LitElement, PropertyValues } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { Constructable } from './types';\n\nexport interface SDSFormControlProps {\n\tname?: string;\n\tdisabled?: boolean;\n\treadOnly?: boolean;\n}\n\nexport interface SDSFormControlAttributes {\n\tname?: string;\n\tdisabled?: boolean;\n\treadonly?: boolean;\n}\n\nexport interface SDSFormControlMixinInterface extends SDSFormControlProps {\n\treadonly internals: ElementInternals;\n\treadonly form: HTMLFormElement | null;\n\tformDisabledCallback(disabled: boolean): void;\n\tupdateValidity(): void;\n}\n\nexport function SDSFormControlMixin<T extends Constructable<LitElement>>(superClass: T): Constructable<SDSFormControlMixinInterface> & T {\n\tclass SDSFormControl extends superClass {\n\t\tstatic formAssociated = true;\n\t\tstatic shadowRootOptions: ShadowRootInit = {\n\t\t\t...LitElement.shadowRootOptions,\n\t\t\tdelegatesFocus: true,\n\t\t};\n\n\t\treadonly internals: ElementInternals;\n\n\t\t// Props\n\t\t// TODO: Add size: Extract<SDS_SIZES, 'lg' | 'md' | 'sm'> once legacy size aliases are removed from sds-chip and sds-switch\n\t\t@property({ type: String, reflect: true }) name?: string;\n\t\t@property({ type: Boolean, reflect: true }) disabled: boolean = false;\n\t\t@property({ type: Boolean, attribute: 'readonly', reflect: true }) readOnly: boolean = false;\n\n\t\tconstructor(...args: any[]) {\n\t\t\tsuper(...args);\n\t\t\tthis.internals = this.attachInternals();\n\t\t}\n\n\t\tget form(): HTMLFormElement | null {\n\t\t\treturn this.internals.form;\n\t\t}\n\n\t\tformDisabledCallback(disabled: boolean): void {\n\t\t\tthis.disabled = disabled;\n\t\t}\n\n\t\t// Make sure to call updateValidity on first update\n\t\t// to register validity as soon as possible\n\t\toverride firstUpdated(changedProperties: PropertyValues): void {\n\t\t\tsuper.firstUpdated(changedProperties);\n\t\t\tthis.updateValidity();\n\t\t}\n\n\t\tupdateValidity(): void {}\n\t}\n\n\treturn SDSFormControl;\n}\n"]}
|
|
@@ -2,7 +2,7 @@ import { LitElement } from 'lit';
|
|
|
2
2
|
import { Constructable } from './types';
|
|
3
3
|
export interface SDSPopoverTargetMixinInterface {
|
|
4
4
|
popoverTarget?: string;
|
|
5
|
-
popoverTargetAction?:
|
|
5
|
+
popoverTargetAction?: 'hide' | 'show' | 'toggle';
|
|
6
6
|
}
|
|
7
7
|
export declare function SDSPopoverTargetMixin<T extends Constructable<LitElement>>(superClass: T): Constructable<SDSPopoverTargetMixinInterface> & T;
|
|
8
8
|
//# sourceMappingURL=sds-popover-target-mixin.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-popover-target-mixin.d.ts","sourceRoot":"","sources":["../../src/mixins/sds-popover-target-mixin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAkB,MAAM,KAAK,CAAC;AAEjD,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAExC,MAAM,WAAW,8BAA8B;IAC9C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,mBAAmB,CAAC,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"sds-popover-target-mixin.d.ts","sourceRoot":"","sources":["../../src/mixins/sds-popover-target-mixin.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAkB,MAAM,KAAK,CAAC;AAEjD,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAExC,MAAM,WAAW,8BAA8B;IAC9C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,mBAAmB,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAC;CACjD;AAED,wBAAgB,qBAAqB,CAAC,CAAC,SAAS,aAAa,CAAC,UAAU,CAAC,EAAE,UAAU,EAAE,CAAC,GAAG,aAAa,CAAC,8BAA8B,CAAC,GAAG,CAAC,CA8E3I"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-popover-target-mixin.js","sourceRoot":"","sources":["../../src/mixins/sds-popover-target-mixin.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"sds-popover-target-mixin.js","sourceRoot":"","sources":["../../src/mixins/sds-popover-target-mixin.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, PropertyValues } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { Constructable } from './types';\n\nexport interface SDSPopoverTargetMixinInterface {\n\tpopoverTarget?: string;\n\tpopoverTargetAction?: 'hide' | 'show' | 'toggle';\n}\n\nexport function SDSPopoverTargetMixin<T extends Constructable<LitElement>>(superClass: T): Constructable<SDSPopoverTargetMixinInterface> & T {\n\tclass SDSPopoverTarget extends superClass {\n\t\t@property({ type: String, attribute: 'popovertarget' }) popoverTarget?: SDSPopoverTargetMixinInterface['popoverTarget'];\n\t\t@property({ type: String, attribute: 'popovertargetaction' }) popoverTargetAction?: SDSPopoverTargetMixinInterface['popoverTargetAction'];\n\n\t\tprivate _popoverElement?: Element;\n\t\tprivate _popoverToggleHandler?: EventListener;\n\n\t\toverride updated(changed: PropertyValues) {\n\t\t\tsuper.updated(changed);\n\n\t\t\tif (changed.has('popoverTarget') || changed.has('popoverTargetAction')) {\n\t\t\t\tthis._updatePopoverTarget();\n\t\t\t}\n\t\t}\n\n\t\toverride disconnectedCallback() {\n\t\t\tsuper.disconnectedCallback();\n\t\t\tthis._cleanupPopoverListener();\n\t\t}\n\n\t\tprivate _cleanupPopoverListener() {\n\t\t\tif (this._popoverToggleHandler && this._popoverElement) {\n\t\t\t\tthis._popoverElement.removeEventListener('toggle', this._popoverToggleHandler);\n\t\t\t\tthis._popoverToggleHandler = undefined;\n\t\t\t\tthis._popoverElement = undefined;\n\t\t\t}\n\t\t}\n\n\t\tprivate _updatePopoverTarget() {\n\t\t\tconst button = this.shadowRoot?.querySelector<HTMLButtonElement>('#control');\n\t\t\tif (!button) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tthis._cleanupPopoverListener();\n\n\t\t\tif (this.popoverTarget) {\n\t\t\t\tconst root = this.getRootNode() as Document | ShadowRoot;\n\t\t\t\tconst targetElement = root.getElementById?.(this.popoverTarget) ?? document.getElementById(this.popoverTarget);\n\n\t\t\t\tif (targetElement) {\n\t\t\t\t\tbutton.popoverTargetElement = targetElement;\n\t\t\t\t\tthis._popoverElement = targetElement;\n\n\t\t\t\t\tconst targetRole = targetElement.getAttribute('role');\n\n\t\t\t\t\tif (targetRole === 'tooltip') {\n\t\t\t\t\t\tbutton.setAttribute('aria-describedby', this.popoverTarget);\n\t\t\t\t\t} else {\n\t\t\t\t\t\t// Auto-toggle aria-expanded when the popover opens/closes\n\t\t\t\t\t\tthis._popoverToggleHandler = (e: Event) => {\n\t\t\t\t\t\t\tconst expanded = (e as ToggleEvent).newState === 'open';\n\t\t\t\t\t\t\tbutton.setAttribute('aria-expanded', String(expanded));\n\t\t\t\t\t\t};\n\t\t\t\t\t\ttargetElement.addEventListener('toggle', this._popoverToggleHandler);\n\n\t\t\t\t\t\tbutton.setAttribute('aria-haspopup', targetRole || 'dialog');\n\t\t\t\t\t\tbutton.setAttribute('aria-expanded', 'false');\n\t\t\t\t\t\tbutton.setAttribute('aria-controls', this.popoverTarget);\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tif (this.popoverTargetAction) {\n\t\t\t\t\tbutton.popoverTargetAction = this.popoverTargetAction;\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tbutton.popoverTargetElement = null;\n\t\t\t\tbutton.popoverTargetAction = '';\n\t\t\t\tbutton.removeAttribute('aria-haspopup');\n\t\t\t\tbutton.removeAttribute('aria-expanded');\n\t\t\t\tbutton.removeAttribute('aria-controls');\n\t\t\t\tbutton.removeAttribute('aria-describedby');\n\t\t\t}\n\t\t}\n\t}\n\n\treturn SDSPopoverTarget;\n}\n"]}
|
|
@@ -11,10 +11,11 @@ export interface SDSButtonProps {
|
|
|
11
11
|
form?: string;
|
|
12
12
|
href?: string;
|
|
13
13
|
icon?: boolean;
|
|
14
|
+
inverted?: boolean;
|
|
14
15
|
loading?: boolean;
|
|
15
16
|
name?: string;
|
|
16
17
|
popoverTarget?: string;
|
|
17
|
-
popoverTargetAction?:
|
|
18
|
+
popoverTargetAction?: 'hide' | 'show' | 'toggle';
|
|
18
19
|
size?: ButtonSize;
|
|
19
20
|
target?: TargetTypes;
|
|
20
21
|
type?: ButtonType;
|
|
@@ -29,6 +30,7 @@ export declare class SDSButtonComponent extends SDSButtonComponent_base {
|
|
|
29
30
|
static shadowRootOptions: ShadowRootInit;
|
|
30
31
|
disabled: boolean;
|
|
31
32
|
icon: boolean;
|
|
33
|
+
inverted: boolean;
|
|
32
34
|
loading: boolean;
|
|
33
35
|
form?: string;
|
|
34
36
|
href?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-button.component.d.ts","sourceRoot":"","sources":["../../src/sds-button/sds-button.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,cAAc,EAAiB,MAAM,KAAK,CAAC;AAIhE,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAInD,KAAK,UAAU,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;AAChD,KAAK,aAAa,GAAG,YAAY,GAAG,UAAU,CAAC;AAC/C,KAAK,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,OAAO,CAAC,SAAS,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC,CAAC;AACxF,KAAK,WAAW,GAAG,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAC;AAE3D,MAAM,WAAW,cAAc;IAC9B,OAAO,CAAC,EAAE,OAAO,GAAG,eAAe,GAAG,YAAY,CAAC;IACnD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,mBAAmB,CAAC,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"sds-button.component.d.ts","sourceRoot":"","sources":["../../src/sds-button/sds-button.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,cAAc,EAAiB,MAAM,KAAK,CAAC;AAIhE,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAInD,KAAK,UAAU,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;AAChD,KAAK,aAAa,GAAG,YAAY,GAAG,UAAU,CAAC;AAC/C,KAAK,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,GAAG,OAAO,CAAC,SAAS,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC,CAAC;AACxF,KAAK,WAAW,GAAG,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAC;AAE3D,MAAM,WAAW,cAAc;IAC9B,OAAO,CAAC,EAAE,OAAO,GAAG,eAAe,GAAG,YAAY,CAAC;IACnD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,mBAAmB,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAC;IACjD,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,aAAa,CAAC;CACxB;;AAED,qBAAa,kBAAmB,SAAQ,uBAA6G;IACpJ,OAAgB,MAAM,4BAAY;IAElC,MAAM,CAAC,cAAc,UAAQ;IAC7B,SAAgB,SAAS,EAAE,gBAAgB,CAAC;IAE5C,OAAgB,iBAAiB,EAAE,cAAc,CAG/C;IAE0C,QAAQ,EAAE,OAAO,CAAS;IAC1B,IAAI,EAAE,OAAO,CAAS;IACtB,QAAQ,EAAE,OAAO,CAAS;IAC1B,OAAO,EAAE,OAAO,CAAS;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,UAAU,CAAQ;IACxB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,IAAI,EAAE,UAAU,CAAY;IAC5B,KAAK,EAAE,MAAM,CAAM;IACnB,OAAO,EAAE,aAAa,CAAa;IACnC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAa;IAE9D,OAAO,EAAG,iBAAiB,CAAC;;IAOtC,OAAO,CAAC,OAAO,EAAE,cAAc;IASxC,OAAO,CAAC,QAAQ,CAAC,YAAY,CA8D3B;IAEO,MAAM;CAgCf"}
|
|
@@ -15,6 +15,7 @@ export class SDSButtonComponent extends SDSDialogTargetMixin(SDSPopoverTargetMix
|
|
|
15
15
|
super();
|
|
16
16
|
this.disabled = false;
|
|
17
17
|
this.icon = false;
|
|
18
|
+
this.inverted = false;
|
|
18
19
|
this.loading = false;
|
|
19
20
|
this.size = 'lg';
|
|
20
21
|
this.type = 'button';
|
|
@@ -112,7 +113,7 @@ export class SDSButtonComponent extends SDSDialogTargetMixin(SDSPopoverTargetMix
|
|
|
112
113
|
@click="${this._handleClick}"
|
|
113
114
|
aria-label="${ifDefined(this.label)}"
|
|
114
115
|
>
|
|
115
|
-
${this.loading ? html `<sds-loader slot="before" ?contrast="${this.variant !== 'primary'}"></sds-loader>` : nothing} ${this.loading ? nothing : html `<slot name="before"></slot>`}
|
|
116
|
+
${this.loading ? html `<sds-loader slot="before" ?contrast="${this.inverted || this.variant !== 'primary'}"></sds-loader>` : nothing} ${this.loading ? nothing : html `<slot name="before"></slot>`}
|
|
116
117
|
<slot></slot>
|
|
117
118
|
${this.loading ? nothing : html `<slot name="after"></slot>`}
|
|
118
119
|
</button>
|
|
@@ -131,6 +132,9 @@ __decorate([
|
|
|
131
132
|
__decorate([
|
|
132
133
|
property({ type: Boolean, reflect: true })
|
|
133
134
|
], SDSButtonComponent.prototype, "icon", void 0);
|
|
135
|
+
__decorate([
|
|
136
|
+
property({ type: Boolean, reflect: true })
|
|
137
|
+
], SDSButtonComponent.prototype, "inverted", void 0);
|
|
134
138
|
__decorate([
|
|
135
139
|
property({ type: Boolean, reflect: true })
|
|
136
140
|
], SDSButtonComponent.prototype, "loading", void 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-button.component.js","sourceRoot":"","sources":["../../src/sds-button/sds-button.component.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, PropertyValues, html, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { SDS_SIZES, SDS_VARIANTS } from '../types';\nimport { styles } from './sds-button.styles';\nimport { SDSEventDispatcherMixin, SDSDelegateInteractionMixin, SDSDialogTargetMixin, SDSPopoverTargetMixin } from '../mixins';\n\ntype ButtonType = 'button' | 'submit' | 'reset';\ntype ButtonVariant = SDS_VARIANTS | 'critical';\ntype ButtonSize = 'large' | 'medium' | 'small' | Extract<SDS_SIZES, 'lg' | 'md' | 'sm'>;\ntype TargetTypes = '_self' | '_blank' | '_parent' | '_top';\n\nexport interface SDSButtonProps {\n\tcommand?: 'close' | 'request-close' | 'show-modal';\n\tcommandFor?: string;\n\tdisabled?: boolean;\n\tform?: string;\n\thref?: string;\n\ticon?: boolean;\n\tloading?: boolean;\n\tname?: string;\n\tpopoverTarget?: string;\n\tpopoverTargetAction?: string;\n\tsize?: ButtonSize;\n\ttarget?: TargetTypes;\n\ttype?: ButtonType;\n\tvalue?: string;\n\tvariant?: ButtonVariant;\n}\n\nexport class SDSButtonComponent extends SDSDialogTargetMixin(SDSPopoverTargetMixin(SDSDelegateInteractionMixin(SDSEventDispatcherMixin(LitElement)))) {\n\tstatic override styles = [styles];\n\n\tstatic formAssociated = true;\n\tpublic readonly internals: ElementInternals;\n\n\tstatic override shadowRootOptions: ShadowRootInit = {\n\t\t...LitElement.shadowRootOptions,\n\t\tdelegatesFocus: true,\n\t};\n\n\t@property({ type: Boolean, reflect: true }) disabled: boolean = false;\n\t@property({ type: Boolean, reflect: true }) icon: boolean = false;\n\t@property({ type: Boolean, reflect: true }) loading: boolean = false;\n\t@property({ type: String, reflect: true }) form?: string;\n\t@property({ type: String, reflect: true }) href?: string;\n\t@property({ type: String, reflect: true }) name?: string;\n\t@property({ type: String, reflect: true }) size: ButtonSize = 'lg';\n\t@property({ type: String, reflect: true }) target?: TargetTypes;\n\t@property({ type: String, reflect: true }) type: ButtonType = 'button';\n\t@property({ type: String, reflect: true }) value: string = '';\n\t@property({ type: String, reflect: true }) variant: ButtonVariant = 'primary';\n\t@property({ type: String, reflect: true }) label: string | undefined = undefined;\n\n\t@query('#control') control!: HTMLButtonElement;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.internals = this.attachInternals();\n\t}\n\n\toverride updated(changed: PropertyValues) {\n\t\tsuper.updated(changed);\n\n\t\t// Cast critical variant to danger palette to prevent breaking changes\n\t\tif (changed.has('variant') && this.variant === 'critical') {\n\t\t\tthis.setAttribute('data-palette', 'danger');\n\t\t}\n\t}\n\n\tprivate readonly _handleClick = (event: MouseEvent) => {\n\t\t// For popover triggers, let the browser handle the toggle natively.\n\t\t// Stop propagation and re-dispatch a composed click for listeners on the host.\n\t\tif (this.popoverTarget) {\n\t\t\tevent.stopImmediatePropagation();\n\t\t\tif (!this.disabled) {\n\t\t\t\tthis.dispatchSheriffEvent('click');\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\t// For dialog commands, emulate the native commandfor/command behavior on the host.\n\t\t// Stop propagation and re-dispatch a composed click for listeners on the host.\n\t\tif (this.effectiveCommandFor && this.effectiveCommand) {\n\t\t\tevent.preventDefault();\n\t\t\tevent.stopImmediatePropagation();\n\t\t\tif (!this.disabled) {\n\t\t\t\tthis.runDialogCommand();\n\t\t\t\tthis.dispatchSheriffEvent('click');\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\tevent.preventDefault();\n\t\tevent.stopImmediatePropagation();\n\n\t\tif (!this.disabled) {\n\t\t\tswitch (this.type) {\n\t\t\t\tcase 'submit': {\n\t\t\t\t\tconst shouldSubmit = this.dispatchSheriffEvent('submit');\n\n\t\t\t\t\tif (shouldSubmit) {\n\t\t\t\t\t\tif (this.form) {\n\t\t\t\t\t\t\tconst root = this.getRootNode() as Document | ShadowRoot;\n\t\t\t\t\t\t\tconst formElement: HTMLFormElement | null = root.querySelector(`form#${this.form}`);\n\t\t\t\t\t\t\tformElement?.requestSubmit();\n\t\t\t\t\t\t} else if (this.internals.form) {\n\t\t\t\t\t\t\tthis.internals.form.requestSubmit();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\n\t\t\t\tcase 'reset': {\n\t\t\t\t\tconst shouldReset = this.dispatchSheriffEvent('reset');\n\n\t\t\t\t\tif (shouldReset) {\n\t\t\t\t\t\tif (this.form) {\n\t\t\t\t\t\t\tconst root = this.getRootNode() as Document | ShadowRoot;\n\t\t\t\t\t\t\tconst formElement: HTMLFormElement | null = root.querySelector(`form#${this.form}`);\n\t\t\t\t\t\t\tformElement?.reset();\n\t\t\t\t\t\t} else if (this.internals.form) {\n\t\t\t\t\t\t\tthis.internals.form.reset();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\n\t\t\t\tdefault:\n\t\t\t\t\tthis.dispatchSheriffEvent('click');\n\t\t\t}\n\t\t}\n\t};\n\n\toverride render() {\n\t\tconst buttonClasses = {\n\t\t\t'sds-button': true,\n\t\t\t'sds-button--as-link': !!this.href,\n\t\t};\n\n\t\tif (this.href) {\n\t\t\treturn html` <a id=\"link\" class=\"${classMap(buttonClasses)}\" href=\"${this.href}\" target=\"${ifDefined(this.target)}\">\n\t\t\t\t<slot name=\"before\"></slot>\n\t\t\t\t<slot></slot>\n\t\t\t\t<slot name=\"after\"></slot>\n\t\t\t</a>`;\n\t\t}\n\n\t\treturn html`\n\t\t\t<button\n\t\t\t\tid=\"control\"\n\t\t\t\tform=\"${ifDefined(this.form)}\"\n\t\t\t\tclass=\"${classMap(buttonClasses)}\"\n\t\t\t\ttype=\"${this.type}\"\n\t\t\t\tname=\"${ifDefined(this.name)}\"\n\t\t\t\tvalue=\"${ifDefined(this.value)}\"\n\t\t\t\t?disabled=\"${this.disabled}\"\n\t\t\t\t@click=\"${this._handleClick}\"\n\t\t\t\taria-label=\"${ifDefined(this.label)}\"\n\t\t\t>\n\t\t\t\t${this.loading ? html`<sds-loader slot=\"before\" ?contrast=\"${this.variant !== 'primary'}\"></sds-loader>` : nothing} ${this.loading ? nothing : html`<slot name=\"before\"></slot>`}\n\t\t\t\t<slot></slot>\n\t\t\t\t${this.loading ? nothing : html`<slot name=\"after\"></slot>`}\n\t\t\t</button>\n\t\t`;\n\t}\n}\n"]}
|
|
1
|
+
{"version":3,"file":"sds-button.component.js","sourceRoot":"","sources":["../../src/sds-button/sds-button.component.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, PropertyValues, html, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { SDS_SIZES, SDS_VARIANTS } from '../types';\nimport { styles } from './sds-button.styles';\nimport { SDSEventDispatcherMixin, SDSDelegateInteractionMixin, SDSDialogTargetMixin, SDSPopoverTargetMixin } from '../mixins';\n\ntype ButtonType = 'button' | 'submit' | 'reset';\ntype ButtonVariant = SDS_VARIANTS | 'critical';\ntype ButtonSize = 'large' | 'medium' | 'small' | Extract<SDS_SIZES, 'lg' | 'md' | 'sm'>;\ntype TargetTypes = '_self' | '_blank' | '_parent' | '_top';\n\nexport interface SDSButtonProps {\n\tcommand?: 'close' | 'request-close' | 'show-modal';\n\tcommandFor?: string;\n\tdisabled?: boolean;\n\tform?: string;\n\thref?: string;\n\ticon?: boolean;\n\tinverted?: boolean;\n\tloading?: boolean;\n\tname?: string;\n\tpopoverTarget?: string;\n\tpopoverTargetAction?: 'hide' | 'show' | 'toggle';\n\tsize?: ButtonSize;\n\ttarget?: TargetTypes;\n\ttype?: ButtonType;\n\tvalue?: string;\n\tvariant?: ButtonVariant;\n}\n\nexport class SDSButtonComponent extends SDSDialogTargetMixin(SDSPopoverTargetMixin(SDSDelegateInteractionMixin(SDSEventDispatcherMixin(LitElement)))) {\n\tstatic override styles = [styles];\n\n\tstatic formAssociated = true;\n\tpublic readonly internals: ElementInternals;\n\n\tstatic override shadowRootOptions: ShadowRootInit = {\n\t\t...LitElement.shadowRootOptions,\n\t\tdelegatesFocus: true,\n\t};\n\n\t@property({ type: Boolean, reflect: true }) disabled: boolean = false;\n\t@property({ type: Boolean, reflect: true }) icon: boolean = false;\n\t@property({ type: Boolean, reflect: true }) inverted: boolean = false;\n\t@property({ type: Boolean, reflect: true }) loading: boolean = false;\n\t@property({ type: String, reflect: true }) form?: string;\n\t@property({ type: String, reflect: true }) href?: string;\n\t@property({ type: String, reflect: true }) name?: string;\n\t@property({ type: String, reflect: true }) size: ButtonSize = 'lg';\n\t@property({ type: String, reflect: true }) target?: TargetTypes;\n\t@property({ type: String, reflect: true }) type: ButtonType = 'button';\n\t@property({ type: String, reflect: true }) value: string = '';\n\t@property({ type: String, reflect: true }) variant: ButtonVariant = 'primary';\n\t@property({ type: String, reflect: true }) label: string | undefined = undefined;\n\n\t@query('#control') control!: HTMLButtonElement;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.internals = this.attachInternals();\n\t}\n\n\toverride updated(changed: PropertyValues) {\n\t\tsuper.updated(changed);\n\n\t\t// Cast critical variant to danger palette to prevent breaking changes\n\t\tif (changed.has('variant') && this.variant === 'critical') {\n\t\t\tthis.setAttribute('data-palette', 'danger');\n\t\t}\n\t}\n\n\tprivate readonly _handleClick = (event: MouseEvent) => {\n\t\t// For popover triggers, let the browser handle the toggle natively.\n\t\t// Stop propagation and re-dispatch a composed click for listeners on the host.\n\t\tif (this.popoverTarget) {\n\t\t\tevent.stopImmediatePropagation();\n\t\t\tif (!this.disabled) {\n\t\t\t\tthis.dispatchSheriffEvent('click');\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\t// For dialog commands, emulate the native commandfor/command behavior on the host.\n\t\t// Stop propagation and re-dispatch a composed click for listeners on the host.\n\t\tif (this.effectiveCommandFor && this.effectiveCommand) {\n\t\t\tevent.preventDefault();\n\t\t\tevent.stopImmediatePropagation();\n\t\t\tif (!this.disabled) {\n\t\t\t\tthis.runDialogCommand();\n\t\t\t\tthis.dispatchSheriffEvent('click');\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\n\t\tevent.preventDefault();\n\t\tevent.stopImmediatePropagation();\n\n\t\tif (!this.disabled) {\n\t\t\tswitch (this.type) {\n\t\t\t\tcase 'submit': {\n\t\t\t\t\tconst shouldSubmit = this.dispatchSheriffEvent('submit');\n\n\t\t\t\t\tif (shouldSubmit) {\n\t\t\t\t\t\tif (this.form) {\n\t\t\t\t\t\t\tconst root = this.getRootNode() as Document | ShadowRoot;\n\t\t\t\t\t\t\tconst formElement: HTMLFormElement | null = root.querySelector(`form#${this.form}`);\n\t\t\t\t\t\t\tformElement?.requestSubmit();\n\t\t\t\t\t\t} else if (this.internals.form) {\n\t\t\t\t\t\t\tthis.internals.form.requestSubmit();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\n\t\t\t\tcase 'reset': {\n\t\t\t\t\tconst shouldReset = this.dispatchSheriffEvent('reset');\n\n\t\t\t\t\tif (shouldReset) {\n\t\t\t\t\t\tif (this.form) {\n\t\t\t\t\t\t\tconst root = this.getRootNode() as Document | ShadowRoot;\n\t\t\t\t\t\t\tconst formElement: HTMLFormElement | null = root.querySelector(`form#${this.form}`);\n\t\t\t\t\t\t\tformElement?.reset();\n\t\t\t\t\t\t} else if (this.internals.form) {\n\t\t\t\t\t\t\tthis.internals.form.reset();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\n\t\t\t\tdefault:\n\t\t\t\t\tthis.dispatchSheriffEvent('click');\n\t\t\t}\n\t\t}\n\t};\n\n\toverride render() {\n\t\tconst buttonClasses = {\n\t\t\t'sds-button': true,\n\t\t\t'sds-button--as-link': !!this.href,\n\t\t};\n\n\t\tif (this.href) {\n\t\t\treturn html` <a id=\"link\" class=\"${classMap(buttonClasses)}\" href=\"${this.href}\" target=\"${ifDefined(this.target)}\">\n\t\t\t\t<slot name=\"before\"></slot>\n\t\t\t\t<slot></slot>\n\t\t\t\t<slot name=\"after\"></slot>\n\t\t\t</a>`;\n\t\t}\n\n\t\treturn html`\n\t\t\t<button\n\t\t\t\tid=\"control\"\n\t\t\t\tform=\"${ifDefined(this.form)}\"\n\t\t\t\tclass=\"${classMap(buttonClasses)}\"\n\t\t\t\ttype=\"${this.type}\"\n\t\t\t\tname=\"${ifDefined(this.name)}\"\n\t\t\t\tvalue=\"${ifDefined(this.value)}\"\n\t\t\t\t?disabled=\"${this.disabled}\"\n\t\t\t\t@click=\"${this._handleClick}\"\n\t\t\t\taria-label=\"${ifDefined(this.label)}\"\n\t\t\t>\n\t\t\t\t${this.loading ? html`<sds-loader slot=\"before\" ?contrast=\"${this.inverted || this.variant !== 'primary'}\"></sds-loader>` : nothing} ${this.loading ? nothing : html`<slot name=\"before\"></slot>`}\n\t\t\t\t<slot></slot>\n\t\t\t\t${this.loading ? nothing : html`<slot name=\"after\"></slot>`}\n\t\t\t</button>\n\t\t`;\n\t}\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sds-button.styles.d.ts","sourceRoot":"","sources":["../../src/sds-button/sds-button.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,
|
|
1
|
+
{"version":3,"file":"sds-button.styles.d.ts","sourceRoot":"","sources":["../../src/sds-button/sds-button.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAgQlB,CAAC"}
|
|
@@ -8,6 +8,7 @@ export const styles = css `
|
|
|
8
8
|
--_sds-button-focus-color: var(--sds-button-focus-color, var(--sds-color-states-focus-outer));
|
|
9
9
|
--_sds-button-focus-inner-color: var(--sds-button-focus-inner-color, var(--sds-color-states-focus-inner));
|
|
10
10
|
--_sds-button-focus-spacing: var(--sds-button-focus-spacing, var(--sds-color-states-focus-spacing));
|
|
11
|
+
--_sds-button-focus-outline-size: var(--sds-button-focus-outline-size, var(--sds-color-states-focus-outline-size));
|
|
11
12
|
--_sds-button-font-family: var(--sds-button-font, var(--sds-typography-font-family-roboto));
|
|
12
13
|
--_sds-button-font-size: var(--sds-button-font-size, var(--sds-components-font-size-content-lg));
|
|
13
14
|
--_sds-button-font-weight: var(--sds-button-font-weight, var(--sds-typography-body-md-strong-desktop-font-weight));
|
|
@@ -56,9 +57,9 @@ export const styles = css `
|
|
|
56
57
|
}
|
|
57
58
|
|
|
58
59
|
&:focus-visible {
|
|
59
|
-
box-shadow: 0 0 0 var(--
|
|
60
|
-
outline:
|
|
61
|
-
outline-offset:
|
|
60
|
+
box-shadow: 0 0 0 var(--_sds-button-focus-spacing) var(--_sds-button-focus-inner-color);
|
|
61
|
+
outline: var(--_sds-button-focus-outline-size) solid var(--_sds-button-focus-color);
|
|
62
|
+
outline-offset: var(--_sds-button-focus-spacing);
|
|
62
63
|
}
|
|
63
64
|
|
|
64
65
|
&:active {
|
|
@@ -171,5 +172,88 @@ export const styles = css `
|
|
|
171
172
|
--_sds-button-padding-inline: var(--sds-button-padding-inline, 0);
|
|
172
173
|
min-width: var(--_sds-button-min-height);
|
|
173
174
|
}
|
|
175
|
+
|
|
176
|
+
:host([inverted]) {
|
|
177
|
+
--_sds-button-background-color: var(--sds-button-background-color, var(--sds-color-action-contrast-default, var(--sds-color-accent-action-contrast-default)));
|
|
178
|
+
--_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-action-contrast-default, var(--sds-color-accent-action-contrast-default)));
|
|
179
|
+
--_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-default, var(--sds-color-accent-action-default)));
|
|
180
|
+
|
|
181
|
+
--sds-loader-main-color: var(--sds-color-action-default, var(--sds-color-accent-action-default));
|
|
182
|
+
--sds-loader-secondary-color: var(--sds-color-border-subtle, var(--sds-color-accent-border-subtle));
|
|
183
|
+
--sds-icon-color: var(--sds-color-action-default, var(--sds-color-accent-action-default));
|
|
184
|
+
|
|
185
|
+
.sds-button:hover {
|
|
186
|
+
--_sds-button-background-color: var(--sds-button-background-color, var(--sds-color-surface-hover, var(--sds-color-accent-surface-hover)));
|
|
187
|
+
--_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-surface-hover, var(--sds-color-accent-surface-hover)));
|
|
188
|
+
}
|
|
189
|
+
|
|
190
|
+
.sds-button:active {
|
|
191
|
+
--_sds-button-background-color: var(--sds-button-background-color, var(--sds-color-surface-active, var(--sds-color-accent-surface-active)));
|
|
192
|
+
--_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-surface-active, var(--sds-color-accent-surface-active)));
|
|
193
|
+
}
|
|
194
|
+
}
|
|
195
|
+
|
|
196
|
+
:host([inverted][variant='primary']) {
|
|
197
|
+
.sds-button:disabled {
|
|
198
|
+
--_sds-button-background-color: var(--sds-button-background-color, var(--sds-color-action-contrast-default, var(--sds-color-neutral-action-contrast-default)));
|
|
199
|
+
--_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-action-contrast-default, var(--sds-color-neutral-action-contrast-default)));
|
|
200
|
+
--_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-default, var(--sds-color-neutral-action-default)));
|
|
201
|
+
}
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
:host([inverted][variant='secondary']) {
|
|
205
|
+
--_sds-button-background-color: var(--sds-button-background-color, transparent);
|
|
206
|
+
--_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-action-contrast-default, var(--sds-color-accent-action-contrast-default)));
|
|
207
|
+
--_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-contrast-default, var(--sds-color-accent-action-contrast-default)));
|
|
208
|
+
--sds-loader-main-color: var(--sds-color-accent-action-contrast-default);
|
|
209
|
+
|
|
210
|
+
.sds-button:hover {
|
|
211
|
+
--_sds-button-background-color: var(--sds-button-background-color, var(--sds-color-action-contrast-default, var(--sds-color-accent-action-contrast-default)));
|
|
212
|
+
--_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-action-contrast-default, var(--sds-color-accent-action-contrast-default)));
|
|
213
|
+
--_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-default, var(--sds-color-accent-action-default)));
|
|
214
|
+
--sds-loader-main-color: var(--sds-color-accent-action-default);
|
|
215
|
+
}
|
|
216
|
+
|
|
217
|
+
.sds-button:active {
|
|
218
|
+
--_sds-button-background-color: var(--sds-button-background-color, var(--sds-color-surface-active, var(--sds-color-accent-surface-active)));
|
|
219
|
+
--_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-surface-active, var(--sds-color-accent-surface-active)));
|
|
220
|
+
--_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-default, var(--sds-color-accent-action-default)));
|
|
221
|
+
--sds-loader-main-color: var(--sds-color-accent-action-default);
|
|
222
|
+
}
|
|
223
|
+
|
|
224
|
+
.sds-button:disabled {
|
|
225
|
+
--_sds-button-background-color: var(--sds-button-background-color, transparent);
|
|
226
|
+
--_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-action-contrast-default, var(--sds-color-neutral-action-contrast-default)));
|
|
227
|
+
--_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-contrast-default, var(--sds-color-neutral-action-contrast-default)));
|
|
228
|
+
}
|
|
229
|
+
}
|
|
230
|
+
|
|
231
|
+
:host([inverted][variant='tertiary']) {
|
|
232
|
+
--_sds-button-background-color: var(--sds-button-background-color, transparent);
|
|
233
|
+
--_sds-button-border-color: var(--sds-button-border-color, transparent);
|
|
234
|
+
--_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-contrast-default, var(--sds-color-accent-action-contrast-default)));
|
|
235
|
+
--sds-typography-link-text-decoration: none;
|
|
236
|
+
--sds-loader-main-color: var(--sds-color-accent-action-contrast-default);
|
|
237
|
+
|
|
238
|
+
.sds-button:hover {
|
|
239
|
+
--_sds-button-background-color: var(--sds-button-background-color, var(--sds-color-action-contrast-default, var(--sds-color-accent-action-contrast-default)));
|
|
240
|
+
--_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-action-contrast-default, var(--sds-color-accent-action-contrast-default)));
|
|
241
|
+
--_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-default, var(--sds-color-accent-action-default)));
|
|
242
|
+
--sds-loader-main-color: var(--sds-color-accent-action-default);
|
|
243
|
+
}
|
|
244
|
+
|
|
245
|
+
.sds-button:active {
|
|
246
|
+
--_sds-button-background-color: var(--sds-button-background-color, var(--sds-color-surface-active, var(--sds-color-accent-surface-active)));
|
|
247
|
+
--_sds-button-border-color: var(--sds-button-border-color, var(--sds-color-surface-active, var(--sds-color-accent-surface-active)));
|
|
248
|
+
--_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-default, var(--sds-color-accent-action-default)));
|
|
249
|
+
--sds-loader-main-color: var(--sds-color-accent-action-default);
|
|
250
|
+
}
|
|
251
|
+
|
|
252
|
+
.sds-button:disabled {
|
|
253
|
+
--_sds-button-background-color: var(--sds-button-background-color, transparent);
|
|
254
|
+
--_sds-button-border-color: var(--sds-button-border-color, transparent);
|
|
255
|
+
--_sds-button-text-color: var(--sds-button-text-color, var(--sds-color-action-contrast-default, var(--sds-color-neutral-action-contrast-default)));
|
|
256
|
+
}
|
|
257
|
+
}
|
|
174
258
|
`;
|
|
175
259
|
//# sourceMappingURL=sds-button.styles.js.map
|