@politiet/sheriff-web-components 2.0.0-rc.1 → 2.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/frameworks/preact.d.ts +54 -17
- package/dist/frameworks/preact.d.ts.map +1 -1
- package/dist/frameworks/react.d.ts +20 -20
- package/dist/frameworks/react.d.ts.map +1 -1
- package/dist/react-wrappers/SDSAlertWrapper.d.ts +2 -1
- package/dist/react-wrappers/SDSAlertWrapper.d.ts.map +1 -1
- package/dist/react-wrappers/SDSAlertWrapper.js +1 -1
- package/dist/react-wrappers/SDSAlertWrapper.js.map +1 -1
- package/dist/react-wrappers/SDSButtonWrapper.d.ts +4 -3
- package/dist/react-wrappers/SDSButtonWrapper.d.ts.map +1 -1
- package/dist/react-wrappers/SDSButtonWrapper.js +1 -1
- package/dist/react-wrappers/SDSButtonWrapper.js.map +1 -1
- package/dist/react-wrappers/SDSCheckboxGroupWrapper.d.ts +2 -1
- package/dist/react-wrappers/SDSCheckboxGroupWrapper.d.ts.map +1 -1
- package/dist/react-wrappers/SDSCheckboxGroupWrapper.js +1 -1
- package/dist/react-wrappers/SDSCheckboxGroupWrapper.js.map +1 -1
- package/dist/react-wrappers/SDSCheckboxWrapper.d.ts +4 -3
- package/dist/react-wrappers/SDSCheckboxWrapper.d.ts.map +1 -1
- package/dist/react-wrappers/SDSCheckboxWrapper.js +1 -1
- package/dist/react-wrappers/SDSCheckboxWrapper.js.map +1 -1
- package/dist/react-wrappers/SDSChipWrapper.d.ts +3 -2
- package/dist/react-wrappers/SDSChipWrapper.d.ts.map +1 -1
- package/dist/react-wrappers/SDSChipWrapper.js +1 -1
- package/dist/react-wrappers/SDSChipWrapper.js.map +1 -1
- package/dist/react-wrappers/SDSNotificationWrapper.d.ts +2 -1
- package/dist/react-wrappers/SDSNotificationWrapper.d.ts.map +1 -1
- package/dist/react-wrappers/SDSNotificationWrapper.js +1 -1
- package/dist/react-wrappers/SDSNotificationWrapper.js.map +1 -1
- package/dist/react-wrappers/SDSRadioGroupWrapper.d.ts +2 -1
- package/dist/react-wrappers/SDSRadioGroupWrapper.d.ts.map +1 -1
- package/dist/react-wrappers/SDSRadioGroupWrapper.js +1 -1
- package/dist/react-wrappers/SDSRadioGroupWrapper.js.map +1 -1
- package/dist/react-wrappers/SDSRadioWrapper.d.ts +4 -3
- package/dist/react-wrappers/SDSRadioWrapper.d.ts.map +1 -1
- package/dist/react-wrappers/SDSRadioWrapper.js +1 -1
- package/dist/react-wrappers/SDSRadioWrapper.js.map +1 -1
- package/dist/react-wrappers/SDSSwitchWrapper.d.ts +4 -3
- package/dist/react-wrappers/SDSSwitchWrapper.d.ts.map +1 -1
- package/dist/react-wrappers/SDSSwitchWrapper.js +1 -1
- package/dist/react-wrappers/SDSSwitchWrapper.js.map +1 -1
- package/dist/react-wrappers/SDSTextAreaWrapper.d.ts +6 -5
- package/dist/react-wrappers/SDSTextAreaWrapper.d.ts.map +1 -1
- package/dist/react-wrappers/SDSTextAreaWrapper.js +1 -1
- package/dist/react-wrappers/SDSTextAreaWrapper.js.map +1 -1
- package/dist/react-wrappers/SDSTextFieldWrapper.d.ts +6 -6
- package/dist/react-wrappers/SDSTextFieldWrapper.d.ts.map +1 -1
- package/dist/react-wrappers/SDSTextFieldWrapper.js +1 -1
- package/dist/react-wrappers/SDSTextFieldWrapper.js.map +1 -1
- package/dist/sds-alert/sds-alert.d.ts +4 -2
- package/dist/sds-alert/sds-alert.d.ts.map +1 -1
- package/dist/sds-alert/sds-alert.js.map +1 -1
- package/dist/sds-button/sds-button.d.ts +0 -3
- package/dist/sds-button/sds-button.d.ts.map +1 -1
- package/dist/sds-button/sds-button.js.map +1 -1
- package/dist/sds-button/sds-button.styles.d.ts.map +1 -1
- package/dist/sds-button/sds-button.styles.js +4 -0
- package/dist/sds-button/sds-button.styles.js.map +1 -1
- package/dist/sds-card/sds-card.d.ts +2 -2
- package/dist/sds-card/sds-card.d.ts.map +1 -1
- package/dist/sds-card/sds-card.js +5 -8
- package/dist/sds-card/sds-card.js.map +1 -1
- package/dist/sds-card/sds-card.styles.js +2 -2
- package/dist/sds-card/sds-card.styles.js.map +1 -1
- package/dist/sds-checkbox/sds-checkbox.d.ts +0 -11
- package/dist/sds-checkbox/sds-checkbox.d.ts.map +1 -1
- package/dist/sds-checkbox/sds-checkbox.js +1 -7
- package/dist/sds-checkbox/sds-checkbox.js.map +1 -1
- package/dist/sds-checkbox-group/sds-checkbox-group.d.ts +0 -3
- package/dist/sds-checkbox-group/sds-checkbox-group.d.ts.map +1 -1
- package/dist/sds-checkbox-group/sds-checkbox-group.js.map +1 -1
- package/dist/sds-chip/sds-chip.d.ts +0 -5
- package/dist/sds-chip/sds-chip.d.ts.map +1 -1
- package/dist/sds-chip/sds-chip.js.map +1 -1
- package/dist/sds-heading/sds-heading.d.ts +3 -3
- package/dist/sds-heading/sds-heading.d.ts.map +1 -1
- package/dist/sds-heading/sds-heading.js +7 -7
- package/dist/sds-heading/sds-heading.js.map +1 -1
- package/dist/sds-heading/sds-heading.styles.d.ts.map +1 -1
- package/dist/sds-heading/sds-heading.styles.js +5 -1
- package/dist/sds-heading/sds-heading.styles.js.map +1 -1
- package/dist/sds-icon/sds-icon.styles.d.ts.map +1 -1
- package/dist/sds-icon/sds-icon.styles.js +6 -0
- package/dist/sds-icon/sds-icon.styles.js.map +1 -1
- package/dist/sds-notification/sds-notification.d.ts +4 -2
- package/dist/sds-notification/sds-notification.d.ts.map +1 -1
- package/dist/sds-notification/sds-notification.js.map +1 -1
- package/dist/sds-radio/sds-radio.d.ts +0 -7
- package/dist/sds-radio/sds-radio.d.ts.map +1 -1
- package/dist/sds-radio/sds-radio.js +5 -16
- package/dist/sds-radio/sds-radio.js.map +1 -1
- package/dist/sds-radio-group/sds-radio-group.d.ts +0 -3
- package/dist/sds-radio-group/sds-radio-group.d.ts.map +1 -1
- package/dist/sds-radio-group/sds-radio-group.js.map +1 -1
- package/dist/sds-switch/sds-switch.d.ts +0 -12
- package/dist/sds-switch/sds-switch.d.ts.map +1 -1
- package/dist/sds-switch/sds-switch.js.map +1 -1
- package/dist/sds-text/sds-text.styles.d.ts.map +1 -1
- package/dist/sds-text/sds-text.styles.js +5 -1
- package/dist/sds-text/sds-text.styles.js.map +1 -1
- package/dist/sds-textarea/sds-textarea.d.ts +0 -5
- package/dist/sds-textarea/sds-textarea.d.ts.map +1 -1
- package/dist/sds-textarea/sds-textarea.js.map +1 -1
- package/dist/sds-textfield/sds-textfield.styles.d.ts.map +1 -1
- package/dist/sds-textfield/sds-textfield.styles.js +3 -1
- package/dist/sds-textfield/sds-textfield.styles.js.map +1 -1
- package/dist/sheriff-web-components.js +43 -42
- package/dist/types.d.ts +3 -0
- package/dist/types.d.ts.map +1 -1
- package/dist/types.js.map +1 -1
- package/package.json +143 -143
- package/dist/playwright-util/screenshot.d.ts +0 -3
- package/dist/playwright-util/screenshot.d.ts.map +0 -1
- package/dist/playwright-util/screenshot.js +0 -25
- package/dist/playwright-util/screenshot.js.map +0 -1
- package/dist/react-wrappers/SDSDetailWrapper.d.ts +0 -3
- package/dist/react-wrappers/SDSDetailWrapper.d.ts.map +0 -1
- package/dist/react-wrappers/SDSDetailWrapper.js +0 -10
- package/dist/react-wrappers/SDSDetailWrapper.js.map +0 -1
- package/dist/react-wrappers/SDSLabelWrapper.d.ts +0 -3
- package/dist/react-wrappers/SDSLabelWrapper.d.ts.map +0 -1
- package/dist/react-wrappers/SDSLabelWrapper.js +0 -10
- package/dist/react-wrappers/SDSLabelWrapper.js.map +0 -1
- package/dist/react-wrappers/SDSLinkWrapper.d.ts +0 -3
- package/dist/react-wrappers/SDSLinkWrapper.d.ts.map +0 -1
- package/dist/react-wrappers/SDSLinkWrapper.js +0 -10
- package/dist/react-wrappers/SDSLinkWrapper.js.map +0 -1
- package/dist/react-wrappers/SDSNavCardWrapper.d.ts +0 -3
- package/dist/react-wrappers/SDSNavCardWrapper.d.ts.map +0 -1
- package/dist/react-wrappers/SDSNavCardWrapper.js +0 -10
- package/dist/react-wrappers/SDSNavCardWrapper.js.map +0 -1
- package/dist/react-wrappers/SDSParagraphWrapper.d.ts +0 -3
- package/dist/react-wrappers/SDSParagraphWrapper.d.ts.map +0 -1
- package/dist/react-wrappers/SDSParagraphWrapper.js +0 -10
- package/dist/react-wrappers/SDSParagraphWrapper.js.map +0 -1
- package/dist/sds-detail/sds-detail.d.ts +0 -17
- package/dist/sds-detail/sds-detail.d.ts.map +0 -1
- package/dist/sds-detail/sds-detail.js +0 -37
- package/dist/sds-detail/sds-detail.js.map +0 -1
- package/dist/sds-detail/sds-detail.styles.d.ts +0 -2
- package/dist/sds-detail/sds-detail.styles.d.ts.map +0 -1
- package/dist/sds-detail/sds-detail.styles.js +0 -25
- package/dist/sds-detail/sds-detail.styles.js.map +0 -1
- package/dist/sds-icon/sds-icon.allowed-colors.d.ts +0 -3
- package/dist/sds-icon/sds-icon.allowed-colors.d.ts.map +0 -1
- package/dist/sds-icon/sds-icon.allowed-colors.js +0 -17
- package/dist/sds-icon/sds-icon.allowed-colors.js.map +0 -1
- package/dist/sds-icon/sds-icon.allowed-names.d.ts +0 -3
- package/dist/sds-icon/sds-icon.allowed-names.d.ts.map +0 -1
- package/dist/sds-icon/sds-icon.allowed-names.js +0 -2
- package/dist/sds-icon/sds-icon.allowed-names.js.map +0 -1
- package/dist/sds-icon/sds-icon.color-types.d.ts +0 -2
- package/dist/sds-icon/sds-icon.color-types.d.ts.map +0 -1
- package/dist/sds-icon/sds-icon.color-types.js +0 -2
- package/dist/sds-icon/sds-icon.color-types.js.map +0 -1
- package/dist/sds-icon/sds-icon.icon-types.d.ts +0 -2
- package/dist/sds-icon/sds-icon.icon-types.d.ts.map +0 -1
- package/dist/sds-icon/sds-icon.icon-types.js +0 -2
- package/dist/sds-icon/sds-icon.icon-types.js.map +0 -1
- package/dist/sds-label/sds-label.d.ts +0 -19
- package/dist/sds-label/sds-label.d.ts.map +0 -1
- package/dist/sds-label/sds-label.js +0 -42
- package/dist/sds-label/sds-label.js.map +0 -1
- package/dist/sds-label/sds-label.styles.d.ts +0 -2
- package/dist/sds-label/sds-label.styles.d.ts.map +0 -1
- package/dist/sds-label/sds-label.styles.js +0 -31
- package/dist/sds-label/sds-label.styles.js.map +0 -1
- package/dist/sds-link/sds-link.d.ts +0 -22
- package/dist/sds-link/sds-link.d.ts.map +0 -1
- package/dist/sds-link/sds-link.js +0 -46
- package/dist/sds-link/sds-link.js.map +0 -1
- package/dist/sds-link/sds-link.styles.d.ts +0 -2
- package/dist/sds-link/sds-link.styles.d.ts.map +0 -1
- package/dist/sds-link/sds-link.styles.js +0 -74
- package/dist/sds-link/sds-link.styles.js.map +0 -1
- package/dist/sds-nav-card/sds-nav-card.d.ts +0 -31
- package/dist/sds-nav-card/sds-nav-card.d.ts.map +0 -1
- package/dist/sds-nav-card/sds-nav-card.js +0 -101
- package/dist/sds-nav-card/sds-nav-card.js.map +0 -1
- package/dist/sds-nav-card/sds-nav-card.styles.d.ts +0 -2
- package/dist/sds-nav-card/sds-nav-card.styles.d.ts.map +0 -1
- package/dist/sds-nav-card/sds-nav-card.styles.js +0 -150
- package/dist/sds-nav-card/sds-nav-card.styles.js.map +0 -1
- package/dist/sds-paragraph/sds-paragraph.d.ts +0 -17
- package/dist/sds-paragraph/sds-paragraph.d.ts.map +0 -1
- package/dist/sds-paragraph/sds-paragraph.js +0 -38
- package/dist/sds-paragraph/sds-paragraph.js.map +0 -1
- package/dist/sds-paragraph/sds-paragraph.styles.d.ts +0 -2
- package/dist/sds-paragraph/sds-paragraph.styles.d.ts.map +0 -1
- package/dist/sds-paragraph/sds-paragraph.styles.js +0 -37
- package/dist/sds-paragraph/sds-paragraph.styles.js.map +0 -1
- package/dist/sds-textarea/sds-textarea.spec.d.ts +0 -2
- package/dist/sds-textarea/sds-textarea.spec.d.ts.map +0 -1
- package/dist/sds-textarea/sds-textarea.spec.js +0 -178
- package/dist/sds-textarea/sds-textarea.spec.js.map +0 -1
- package/dist/utils/hmr-helper.d.ts +0 -2
- package/dist/utils/hmr-helper.d.ts.map +0 -1
- package/dist/utils/hmr-helper.js +0 -17
- package/dist/utils/hmr-helper.js.map +0 -1
- package/dist/utils/renderErrorMessage.d.ts +0 -3
- package/dist/utils/renderErrorMessage.d.ts.map +0 -1
- package/dist/utils/renderErrorMessage.js +0 -9
- package/dist/utils/renderErrorMessage.js.map +0 -1
- package/dist/utils/safe-custom-element.d.ts +0 -2
- package/dist/utils/safe-custom-element.d.ts.map +0 -1
- package/dist/utils/safe-custom-element.js +0 -9
- package/dist/utils/safe-custom-element.js.map +0 -1
- package/dist/utils/types.d.ts +0 -2
- package/dist/utils/types.d.ts.map +0 -1
- package/dist/utils/types.js +0 -2
- package/dist/utils/types.js.map +0 -1
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
7
|
-
import { LitElement, html } from 'lit';
|
|
8
|
-
import { property } from 'lit/decorators.js';
|
|
9
|
-
import { ifDefined } from 'lit/directives/if-defined.js';
|
|
10
|
-
import { classMap } from 'lit/directives/class-map.js';
|
|
11
|
-
import { guardedCustomElement } from '../utils/guarded-custom-element';
|
|
12
|
-
import { styles } from './sds-link.styles';
|
|
13
|
-
let SDSLink = class SDSLink extends LitElement {
|
|
14
|
-
constructor() {
|
|
15
|
-
super(...arguments);
|
|
16
|
-
this.size = 'm';
|
|
17
|
-
}
|
|
18
|
-
render() {
|
|
19
|
-
const styleClasses = {
|
|
20
|
-
'sds-link': true,
|
|
21
|
-
'sds-link--l': this.size === 'l',
|
|
22
|
-
'sds-link--m': this.size === 'm',
|
|
23
|
-
'sds-link--s': this.size === 's',
|
|
24
|
-
};
|
|
25
|
-
const classes = classMap(styleClasses);
|
|
26
|
-
return html `<a href="${ifDefined(this.href)}" target="${ifDefined(this.target)}" class=${classes}
|
|
27
|
-
><slot></slot
|
|
28
|
-
></a>`;
|
|
29
|
-
}
|
|
30
|
-
};
|
|
31
|
-
// Styling
|
|
32
|
-
SDSLink.styles = [styles];
|
|
33
|
-
__decorate([
|
|
34
|
-
property({ type: String })
|
|
35
|
-
], SDSLink.prototype, "href", void 0);
|
|
36
|
-
__decorate([
|
|
37
|
-
property({ type: String })
|
|
38
|
-
], SDSLink.prototype, "size", void 0);
|
|
39
|
-
__decorate([
|
|
40
|
-
property({ type: String })
|
|
41
|
-
], SDSLink.prototype, "target", void 0);
|
|
42
|
-
SDSLink = __decorate([
|
|
43
|
-
guardedCustomElement('sds-link')
|
|
44
|
-
], SDSLink);
|
|
45
|
-
export { SDSLink };
|
|
46
|
-
//# sourceMappingURL=sds-link.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"sds-link.js","sourceRoot":"","sources":["../../src/sds-link/sds-link.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAYpC,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQ,UAAU;IAAhC;;QAMsB,SAAI,GAAS,GAAG,CAAC;IAiB9C,CAAC;IAdS,MAAM;QACd,MAAM,YAAY,GAAG;YACpB,UAAU,EAAE,IAAI;YAChB,aAAa,EAAE,IAAI,CAAC,IAAI,KAAK,GAAG;YAChC,aAAa,EAAE,IAAI,CAAC,IAAI,KAAK,GAAG;YAChC,aAAa,EAAE,IAAI,CAAC,IAAI,KAAK,GAAG;SAChC,CAAC;QAEF,MAAM,OAAO,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;QAEvC,OAAO,IAAI,CAAA,YAAY,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,WAAW,OAAO;;QAE1F,CAAC;IACR,CAAC;;AArBD,UAAU;AACM,cAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAGN;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qCAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qCAAkB;AACjB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uCAAiB;AAPhC,OAAO;IADnB,oBAAoB,CAAC,UAAU,CAAC;GACpB,OAAO,CAuBnB","sourcesContent":["import { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { guardedCustomElement } from '../utils/guarded-custom-element';\nimport { styles } from './sds-link.styles';\n\ntype Size = 'l' | 'm' | 's';\ntype Target = '_blank' | '_self' | '_parent' | '_top';\n\nexport interface SDSLinkProps {\n\thref?: string;\n\tsize?: Size;\n\ttarget?: Target;\n}\n\n@guardedCustomElement('sds-link')\nexport class SDSLink extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t// Reactive Props\n\t@property({ type: String }) href?: string;\n\t@property({ type: String }) size: Size = 'm';\n\t@property({ type: String }) target?: Target;\n\n\toverride render() {\n\t\tconst styleClasses = {\n\t\t\t'sds-link': true,\n\t\t\t'sds-link--l': this.size === 'l',\n\t\t\t'sds-link--m': this.size === 'm',\n\t\t\t'sds-link--s': this.size === 's',\n\t\t};\n\n\t\tconst classes = classMap(styleClasses);\n\n\t\treturn html`<a href=\"${ifDefined(this.href)}\" target=\"${ifDefined(this.target)}\" class=${classes}\n\t\t\t><slot></slot\n\t\t></a>`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-link': SDSLink;\n\t}\n}\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"sds-link.styles.d.ts","sourceRoot":"","sources":["../../src/sds-link/sds-link.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAuElB,CAAC"}
|
|
@@ -1,74 +0,0 @@
|
|
|
1
|
-
import { css } from 'lit';
|
|
2
|
-
export const styles = css `
|
|
3
|
-
:host {
|
|
4
|
-
display: inline;
|
|
5
|
-
}
|
|
6
|
-
|
|
7
|
-
:host([display-type='block']) {
|
|
8
|
-
display: block;
|
|
9
|
-
max-width: var(--sds-typography-max-line-width);
|
|
10
|
-
|
|
11
|
-
.sds-link {
|
|
12
|
-
display: block;
|
|
13
|
-
max-width: var(--sds-typography-max-line-width);
|
|
14
|
-
}
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
:host([display-type='inline-block']) {
|
|
18
|
-
display: inline-block;
|
|
19
|
-
|
|
20
|
-
.sds-link {
|
|
21
|
-
display: inline-block;
|
|
22
|
-
max-width: var(--sds-typography-max-line-width);
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
:host([display-type='inline']) {
|
|
27
|
-
display: inline;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
.sds-link {
|
|
31
|
-
color: var(--sds-color-semantic-text-default);
|
|
32
|
-
display: inline;
|
|
33
|
-
font-family: var(--sds-typography-font-family);
|
|
34
|
-
font-weight: 400;
|
|
35
|
-
line-height: 1.333;
|
|
36
|
-
margin: 0;
|
|
37
|
-
padding: 0;
|
|
38
|
-
|
|
39
|
-
&:link,
|
|
40
|
-
&:visited {
|
|
41
|
-
color: var(--sds-color-semantic-text-action-default);
|
|
42
|
-
text-decoration: underline;
|
|
43
|
-
text-decoration-thickness: 1px;
|
|
44
|
-
text-underline-offset: 2px;
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
&:active {
|
|
48
|
-
color: var(--sds-color-semantic-text-action-active);
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
&:hover {
|
|
52
|
-
color: var(--sds-color-semantic-text-action-hover);
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
&:focus {
|
|
56
|
-
border-radius: 4px;
|
|
57
|
-
outline: 2px solid var(--sds-color-semantic-border-focus);
|
|
58
|
-
outline-offset: 2px;
|
|
59
|
-
}
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
.sds-link--l {
|
|
63
|
-
font-size: 1.125rem;
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
.sds-link--m {
|
|
67
|
-
font-size: 1rem;
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
.sds-link--s {
|
|
71
|
-
font-size: 0.875rem;
|
|
72
|
-
}
|
|
73
|
-
`;
|
|
74
|
-
//# sourceMappingURL=sds-link.styles.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"sds-link.styles.js","sourceRoot":"","sources":["../../src/sds-link/sds-link.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuExB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`\n\t:host {\n\t\tdisplay: inline;\n\t}\n\n\t:host([display-type='block']) {\n\t\tdisplay: block;\n\t\tmax-width: var(--sds-typography-max-line-width);\n\n\t\t.sds-link {\n\t\t\tdisplay: block;\n\t\t\tmax-width: var(--sds-typography-max-line-width);\n\t\t}\n\t}\n\n\t:host([display-type='inline-block']) {\n\t\tdisplay: inline-block;\n\n\t\t.sds-link {\n\t\t\tdisplay: inline-block;\n\t\t\tmax-width: var(--sds-typography-max-line-width);\n\t\t}\n\t}\n\n\t:host([display-type='inline']) {\n\t\tdisplay: inline;\n\t}\n\n\t.sds-link {\n\t\tcolor: var(--sds-color-semantic-text-default);\n\t\tdisplay: inline;\n\t\tfont-family: var(--sds-typography-font-family);\n\t\tfont-weight: 400;\n\t\tline-height: 1.333;\n\t\tmargin: 0;\n\t\tpadding: 0;\n\n\t\t&:link,\n\t\t&:visited {\n\t\t\tcolor: var(--sds-color-semantic-text-action-default);\n\t\t\ttext-decoration: underline;\n\t\t\ttext-decoration-thickness: 1px;\n\t\t\ttext-underline-offset: 2px;\n\t\t}\n\n\t\t&:active {\n\t\t\tcolor: var(--sds-color-semantic-text-action-active);\n\t\t}\n\n\t\t&:hover {\n\t\t\tcolor: var(--sds-color-semantic-text-action-hover);\n\t\t}\n\n\t\t&:focus {\n\t\t\tborder-radius: 4px;\n\t\t\toutline: 2px solid var(--sds-color-semantic-border-focus);\n\t\t\toutline-offset: 2px;\n\t\t}\n\t}\n\n\t.sds-link--l {\n\t\tfont-size: 1.125rem;\n\t}\n\n\t.sds-link--m {\n\t\tfont-size: 1rem;\n\t}\n\n\t.sds-link--s {\n\t\tfont-size: 0.875rem;\n\t}\n`;\n"]}
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
import { LitElement } from 'lit';
|
|
2
|
-
type Size = 'large' | 'medium' | 'small';
|
|
3
|
-
type HeadingLevel = 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
|
|
4
|
-
export interface SDSNavCardProps {
|
|
5
|
-
size?: Size;
|
|
6
|
-
heading: string;
|
|
7
|
-
level?: HeadingLevel;
|
|
8
|
-
link: string;
|
|
9
|
-
}
|
|
10
|
-
export declare class SDSNavCard extends LitElement {
|
|
11
|
-
static styles: import("lit").CSSResult[];
|
|
12
|
-
size: Size;
|
|
13
|
-
heading: string;
|
|
14
|
-
level: HeadingLevel;
|
|
15
|
-
link: string;
|
|
16
|
-
private hasIcon;
|
|
17
|
-
private iconSlot;
|
|
18
|
-
firstUpdated(): void;
|
|
19
|
-
private _handleSlotChange;
|
|
20
|
-
private _filterToMeaningfulNodes;
|
|
21
|
-
private _checkSlotContent;
|
|
22
|
-
private _renderHeading;
|
|
23
|
-
render(): import("lit-html").TemplateResult<1>;
|
|
24
|
-
}
|
|
25
|
-
declare global {
|
|
26
|
-
interface HTMLElementTagNameMap {
|
|
27
|
-
'sds-nav-card': SDSNavCard;
|
|
28
|
-
}
|
|
29
|
-
}
|
|
30
|
-
export {};
|
|
31
|
-
//# sourceMappingURL=sds-nav-card.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"sds-nav-card.d.ts","sourceRoot":"","sources":["../../src/sds-nav-card/sds-nav-card.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAMvC,KAAK,IAAI,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AACzC,KAAK,YAAY,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAErD,MAAM,WAAW,eAAe;IAC/B,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,IAAI,EAAE,MAAM,CAAC;CACb;AAED,qBACa,UAAW,SAAQ,UAAU;IAEzC,OAAgB,MAAM,4BAAY;IAGS,IAAI,EAAE,IAAI,CAAW;IACrB,OAAO,EAAG,MAAM,CAAC;IACjB,KAAK,EAAE,YAAY,CAAQ;IAC3B,IAAI,EAAG,MAAM,CAAC;IAGhD,OAAO,CAAC,OAAO,CAAkB;IAC3B,OAAO,CAAC,QAAQ,CAAmB;IAEzC,YAAY;IAIrB,OAAO,CAAC,iBAAiB;IAIzB,OAAO,CAAC,wBAAwB;IAUhC,OAAO,CAAC,iBAAiB;IAMzB,OAAO,CAAC,cAAc;IAmBb,MAAM;CAmBf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,cAAc,EAAE,UAAU,CAAC;KAC3B;CACD"}
|
|
@@ -1,101 +0,0 @@
|
|
|
1
|
-
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
7
|
-
import { LitElement, html } from 'lit';
|
|
8
|
-
import { property, query, state } from 'lit/decorators.js';
|
|
9
|
-
import { classMap } from 'lit/directives/class-map.js';
|
|
10
|
-
import { guardedCustomElement } from '../utils/guarded-custom-element';
|
|
11
|
-
import { styles } from './sds-nav-card.styles';
|
|
12
|
-
let SDSNavCard = class SDSNavCard extends LitElement {
|
|
13
|
-
constructor() {
|
|
14
|
-
super(...arguments);
|
|
15
|
-
// Reactive Props
|
|
16
|
-
this.size = 'large';
|
|
17
|
-
this.level = 'h2';
|
|
18
|
-
// Managing the icon slot
|
|
19
|
-
this.hasIcon = false;
|
|
20
|
-
}
|
|
21
|
-
firstUpdated() {
|
|
22
|
-
this._checkSlotContent();
|
|
23
|
-
}
|
|
24
|
-
_handleSlotChange() {
|
|
25
|
-
this._checkSlotContent();
|
|
26
|
-
}
|
|
27
|
-
_filterToMeaningfulNodes(nodes) {
|
|
28
|
-
return nodes.filter((node) => {
|
|
29
|
-
if (node.nodeType === Node.TEXT_NODE) {
|
|
30
|
-
const textContent = node.textContent;
|
|
31
|
-
return textContent !== null && textContent.trim().length > 0;
|
|
32
|
-
}
|
|
33
|
-
return true;
|
|
34
|
-
});
|
|
35
|
-
}
|
|
36
|
-
_checkSlotContent() {
|
|
37
|
-
const assignedNodes = this.iconSlot.assignedNodes({ flatten: true });
|
|
38
|
-
const meaningfulNodes = this._filterToMeaningfulNodes(assignedNodes);
|
|
39
|
-
this.hasIcon = meaningfulNodes.length !== 0;
|
|
40
|
-
}
|
|
41
|
-
_renderHeading() {
|
|
42
|
-
const headingClass = 'sds-nav-card__heading';
|
|
43
|
-
switch (this.level) {
|
|
44
|
-
case 'h2':
|
|
45
|
-
return html `<h2 class="${headingClass}">${this.heading}</h2>`;
|
|
46
|
-
case 'h3':
|
|
47
|
-
return html `<h3 class="${headingClass}">${this.heading}</h3>`;
|
|
48
|
-
case 'h4':
|
|
49
|
-
return html `<h4 class="${headingClass}">${this.heading}</h4>`;
|
|
50
|
-
case 'h5':
|
|
51
|
-
return html `<h5 class="${headingClass}">${this.heading}</h5>`;
|
|
52
|
-
case 'h6':
|
|
53
|
-
return html `<h6 class="${headingClass}">${this.heading}</h6>`;
|
|
54
|
-
default:
|
|
55
|
-
return html `<h2 class="${headingClass}">${this.heading}</h2>`;
|
|
56
|
-
}
|
|
57
|
-
}
|
|
58
|
-
render() {
|
|
59
|
-
const navCardClasses = {
|
|
60
|
-
'sds-nav-card': true,
|
|
61
|
-
'sds-nav-card--hasIcon': this.hasIcon,
|
|
62
|
-
'sds-nav-card--small': this.size === 'small',
|
|
63
|
-
'sds-nav-card--medium': this.size === 'medium',
|
|
64
|
-
'sds-nav-card--large': this.size === 'large',
|
|
65
|
-
};
|
|
66
|
-
return html `
|
|
67
|
-
<a class="${classMap(navCardClasses)}" href="${this.link}">
|
|
68
|
-
<slot name="before" @slotchange=${this._handleSlotChange}></slot>
|
|
69
|
-
<div class="sds-nav-card__content">
|
|
70
|
-
${this._renderHeading()}
|
|
71
|
-
<slot></slot>
|
|
72
|
-
</div>
|
|
73
|
-
</a>
|
|
74
|
-
`;
|
|
75
|
-
}
|
|
76
|
-
};
|
|
77
|
-
// Styling
|
|
78
|
-
SDSNavCard.styles = [styles];
|
|
79
|
-
__decorate([
|
|
80
|
-
property({ type: String, reflect: true })
|
|
81
|
-
], SDSNavCard.prototype, "size", void 0);
|
|
82
|
-
__decorate([
|
|
83
|
-
property({ type: String, reflect: true })
|
|
84
|
-
], SDSNavCard.prototype, "heading", void 0);
|
|
85
|
-
__decorate([
|
|
86
|
-
property({ type: String, reflect: true })
|
|
87
|
-
], SDSNavCard.prototype, "level", void 0);
|
|
88
|
-
__decorate([
|
|
89
|
-
property({ type: String, reflect: true })
|
|
90
|
-
], SDSNavCard.prototype, "link", void 0);
|
|
91
|
-
__decorate([
|
|
92
|
-
state()
|
|
93
|
-
], SDSNavCard.prototype, "hasIcon", void 0);
|
|
94
|
-
__decorate([
|
|
95
|
-
query('slot')
|
|
96
|
-
], SDSNavCard.prototype, "iconSlot", void 0);
|
|
97
|
-
SDSNavCard = __decorate([
|
|
98
|
-
guardedCustomElement('sds-nav-card')
|
|
99
|
-
], SDSNavCard);
|
|
100
|
-
export { SDSNavCard };
|
|
101
|
-
//# sourceMappingURL=sds-nav-card.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"sds-nav-card.js","sourceRoot":"","sources":["../../src/sds-nav-card/sds-nav-card.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { guardedCustomElement } from '../utils/guarded-custom-element';\nimport { styles } from './sds-nav-card.styles';\n\ntype Size = 'large' | 'medium' | 'small';\ntype HeadingLevel = 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n\nexport interface SDSNavCardProps {\n\tsize?: Size;\n\theading: string;\n\tlevel?: HeadingLevel;\n\tlink: string;\n}\n\n@guardedCustomElement('sds-nav-card')\nexport class SDSNavCard extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t// Reactive Props\n\t@property({ type: String, reflect: true }) size: Size = 'large';\n\t@property({ type: String, reflect: true }) heading!: string;\n\t@property({ type: String, reflect: true }) level: HeadingLevel = 'h2';\n\t@property({ type: String, reflect: true }) link!: string;\n\n\t// Managing the icon slot\n\t@state() private hasIcon: boolean = false;\n\t@query('slot') private iconSlot!: HTMLSlotElement;\n\n\toverride firstUpdated() {\n\t\tthis._checkSlotContent();\n\t}\n\n\tprivate _handleSlotChange() {\n\t\tthis._checkSlotContent();\n\t}\n\n\tprivate _filterToMeaningfulNodes(nodes: Node[]) {\n\t\treturn nodes.filter((node) => {\n\t\t\tif (node.nodeType === Node.TEXT_NODE) {\n\t\t\t\tconst textContent = (node as Text).textContent;\n\t\t\t\treturn textContent !== null && textContent.trim().length > 0;\n\t\t\t}\n\t\t\treturn true;\n\t\t});\n\t}\n\n\tprivate _checkSlotContent() {\n\t\tconst assignedNodes = this.iconSlot.assignedNodes({ flatten: true });\n\t\tconst meaningfulNodes = this._filterToMeaningfulNodes(assignedNodes);\n\t\tthis.hasIcon = meaningfulNodes.length !== 0;\n\t}\n\n\tprivate _renderHeading() {\n\t\tconst headingClass = 'sds-nav-card__heading';\n\n\t\tswitch (this.level) {\n\t\t\tcase 'h2':\n\t\t\t\treturn html`<h2 class=\"${headingClass}\">${this.heading}</h2>`;\n\t\t\tcase 'h3':\n\t\t\t\treturn html`<h3 class=\"${headingClass}\">${this.heading}</h3>`;\n\t\t\tcase 'h4':\n\t\t\t\treturn html`<h4 class=\"${headingClass}\">${this.heading}</h4>`;\n\t\t\tcase 'h5':\n\t\t\t\treturn html`<h5 class=\"${headingClass}\">${this.heading}</h5>`;\n\t\t\tcase 'h6':\n\t\t\t\treturn html`<h6 class=\"${headingClass}\">${this.heading}</h6>`;\n\t\t\tdefault:\n\t\t\t\treturn html`<h2 class=\"${headingClass}\">${this.heading}</h2>`;\n\t\t}\n\t}\n\n\toverride render() {\n\t\tconst navCardClasses = {\n\t\t\t'sds-nav-card': true,\n\t\t\t'sds-nav-card--hasIcon': this.hasIcon,\n\t\t\t'sds-nav-card--small': this.size === 'small',\n\t\t\t'sds-nav-card--medium': this.size === 'medium',\n\t\t\t'sds-nav-card--large': this.size === 'large',\n\t\t};\n\n\t\treturn html`\n\t\t\t<a class=\"${classMap(navCardClasses)}\" href=\"${this.link}\">\n\t\t\t\t<slot name=\"before\" @slotchange=${this._handleSlotChange}></slot>\n\t\t\t\t<div class=\"sds-nav-card__content\">\n\t\t\t\t\t${this._renderHeading()}\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</div>\n\t\t\t</a>\n\t\t`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-nav-card': SDSNavCard;\n\t}\n}\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"sds-nav-card.styles.d.ts","sourceRoot":"","sources":["../../src/sds-nav-card/sds-nav-card.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAmJlB,CAAC"}
|
|
@@ -1,150 +0,0 @@
|
|
|
1
|
-
import { css } from 'lit';
|
|
2
|
-
export const styles = css `
|
|
3
|
-
:host {
|
|
4
|
-
display: block;
|
|
5
|
-
box-sizing: border-box;
|
|
6
|
-
}
|
|
7
|
-
|
|
8
|
-
.sds-nav-card {
|
|
9
|
-
color: var(--sds-color-semantic-text-default);
|
|
10
|
-
background-color: var(
|
|
11
|
-
--sds-color-global-lightblue-100
|
|
12
|
-
); // TODO: Global variable used, should be replaced by a more spesific one
|
|
13
|
-
|
|
14
|
-
font-size: var(--sds-typography-base-font-size);
|
|
15
|
-
line-height: var(--sds-typography-base-line-height);
|
|
16
|
-
font-weight: var(--sds-typography-base-font-weight);
|
|
17
|
-
font-family: var(--sds-typography-font-family);
|
|
18
|
-
|
|
19
|
-
display: flex;
|
|
20
|
-
min-height: 10.25rem;
|
|
21
|
-
height: 100%;
|
|
22
|
-
width: 100%;
|
|
23
|
-
max-width: 50rem;
|
|
24
|
-
|
|
25
|
-
box-sizing: border-box;
|
|
26
|
-
padding: var(--sds-spacing-7) var(--sds-spacing-9) var(--sds-spacing-8);
|
|
27
|
-
gap: var(--sds-spacing-5);
|
|
28
|
-
text-align: left;
|
|
29
|
-
|
|
30
|
-
cursor: pointer;
|
|
31
|
-
|
|
32
|
-
& p {
|
|
33
|
-
padding: 0;
|
|
34
|
-
margin: 0;
|
|
35
|
-
hyphens: auto;
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
&:link {
|
|
39
|
-
text-decoration: none;
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
&:hover {
|
|
43
|
-
background-color: var(
|
|
44
|
-
--sds-color-global-lightblue-300
|
|
45
|
-
); // TODO: Global variable used, should be replaced by a more spesific one
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
&:active,
|
|
49
|
-
&:focus:active {
|
|
50
|
-
background-color: var(--sds-color-semantic-surface-action-selected);
|
|
51
|
-
color: var(--sds-color-semantic-text-on-action);
|
|
52
|
-
|
|
53
|
-
::slotted(*) {
|
|
54
|
-
stroke: var(--sds-color-semantic-icon-on-action);
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
&:focus {
|
|
59
|
-
background: var(--sds-color-global-lightblue-100);
|
|
60
|
-
outline: 2px solid var(--sds-color-semantic-surface-action-default);
|
|
61
|
-
outline-offset: 1px;
|
|
62
|
-
}
|
|
63
|
-
|
|
64
|
-
&:active {
|
|
65
|
-
outline: 0;
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
&:disabled {
|
|
69
|
-
background-color: var(--sds-color-semantic-surface-disabled);
|
|
70
|
-
pointer-events: none;
|
|
71
|
-
}
|
|
72
|
-
}
|
|
73
|
-
|
|
74
|
-
.sds-nav-card--hasIcon {
|
|
75
|
-
padding: var(--sds-spacing-7) var(--sds-spacing-7) var(--sds-spacing-8);
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
.sds-nav-card__content {
|
|
79
|
-
display: flex;
|
|
80
|
-
flex-direction: column;
|
|
81
|
-
width: 100%;
|
|
82
|
-
gap: var(--sds-spacing-3);
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
.sds-nav-card__text {
|
|
86
|
-
display: -webkit-box;
|
|
87
|
-
-webkit-line-clamp: 3;
|
|
88
|
-
-webkit-box-orient: vertical;
|
|
89
|
-
overflow: hidden;
|
|
90
|
-
}
|
|
91
|
-
|
|
92
|
-
::slotted(*) {
|
|
93
|
-
height: 4.5rem;
|
|
94
|
-
min-width: 4.5rem;
|
|
95
|
-
width: 4.5rem;
|
|
96
|
-
align-self: center;
|
|
97
|
-
stroke: var(
|
|
98
|
-
--sds-color-global-black
|
|
99
|
-
); // TODO: Global variable used, should be replaced by a more spesific one
|
|
100
|
-
}
|
|
101
|
-
|
|
102
|
-
.sds-nav-card__heading {
|
|
103
|
-
font-weight: 700;
|
|
104
|
-
font-size: 1.5rem;
|
|
105
|
-
margin: 0;
|
|
106
|
-
}
|
|
107
|
-
|
|
108
|
-
.sds-nav-card--medium {
|
|
109
|
-
min-height: 7rem;
|
|
110
|
-
|
|
111
|
-
.sds-nav-card__text {
|
|
112
|
-
display: -webkit-box;
|
|
113
|
-
display: flex;
|
|
114
|
-
|
|
115
|
-
-webkit-line-clamp: 1;
|
|
116
|
-
-webkit-box-orient: vertical;
|
|
117
|
-
|
|
118
|
-
overflow: hidden;
|
|
119
|
-
text-overflow: ellipsis;
|
|
120
|
-
}
|
|
121
|
-
|
|
122
|
-
::slotted(*) {
|
|
123
|
-
height: 3rem;
|
|
124
|
-
min-width: 3rem;
|
|
125
|
-
width: 3rem;
|
|
126
|
-
}
|
|
127
|
-
}
|
|
128
|
-
|
|
129
|
-
.sds-nav-card--small {
|
|
130
|
-
min-height: 4.5rem;
|
|
131
|
-
padding: var(--sds-spacing-5) var(--sds-spacing-8) var(--sds-spacing-6);
|
|
132
|
-
|
|
133
|
-
.sds-nav-card--hasIcon {
|
|
134
|
-
padding: var(--sds-spacing-5) var(--sds-spacing-7)
|
|
135
|
-
var(--sds-spacing-6);
|
|
136
|
-
}
|
|
137
|
-
|
|
138
|
-
.sds-nav-card__content {
|
|
139
|
-
gap: 0;
|
|
140
|
-
align-self: center;
|
|
141
|
-
}
|
|
142
|
-
|
|
143
|
-
::slotted(*) {
|
|
144
|
-
height: 2.5rem;
|
|
145
|
-
min-width: 2.5rem;
|
|
146
|
-
width: 2.5rem;
|
|
147
|
-
}
|
|
148
|
-
}
|
|
149
|
-
`;
|
|
150
|
-
//# sourceMappingURL=sds-nav-card.styles.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"sds-nav-card.styles.js","sourceRoot":"","sources":["../../src/sds-nav-card/sds-nav-card.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmJxB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`\n\t:host {\n\t\tdisplay: block;\n\t\tbox-sizing: border-box;\n\t}\n\n\t.sds-nav-card {\n\t\tcolor: var(--sds-color-semantic-text-default);\n\t\tbackground-color: var(\n\t\t\t--sds-color-global-lightblue-100\n\t\t); // TODO: Global variable used, should be replaced by a more spesific one\n\n\t\tfont-size: var(--sds-typography-base-font-size);\n\t\tline-height: var(--sds-typography-base-line-height);\n\t\tfont-weight: var(--sds-typography-base-font-weight);\n\t\tfont-family: var(--sds-typography-font-family);\n\n\t\tdisplay: flex;\n\t\tmin-height: 10.25rem;\n\t\theight: 100%;\n\t\twidth: 100%;\n\t\tmax-width: 50rem;\n\n\t\tbox-sizing: border-box;\n\t\tpadding: var(--sds-spacing-7) var(--sds-spacing-9) var(--sds-spacing-8);\n\t\tgap: var(--sds-spacing-5);\n\t\ttext-align: left;\n\n\t\tcursor: pointer;\n\n\t\t& p {\n\t\t\tpadding: 0;\n\t\t\tmargin: 0;\n\t\t\thyphens: auto;\n\t\t}\n\n\t\t&:link {\n\t\t\ttext-decoration: none;\n\t\t}\n\n\t\t&:hover {\n\t\t\tbackground-color: var(\n\t\t\t\t--sds-color-global-lightblue-300\n\t\t\t); // TODO: Global variable used, should be replaced by a more spesific one\n\t\t}\n\n\t\t&:active,\n\t\t&:focus:active {\n\t\t\tbackground-color: var(--sds-color-semantic-surface-action-selected);\n\t\t\tcolor: var(--sds-color-semantic-text-on-action);\n\n\t\t\t::slotted(*) {\n\t\t\t\tstroke: var(--sds-color-semantic-icon-on-action);\n\t\t\t}\n\t\t}\n\n\t\t&:focus {\n\t\t\tbackground: var(--sds-color-global-lightblue-100);\n\t\t\toutline: 2px solid var(--sds-color-semantic-surface-action-default);\n\t\t\toutline-offset: 1px;\n\t\t}\n\n\t\t&:active {\n\t\t\toutline: 0;\n\t\t}\n\n\t\t&:disabled {\n\t\t\tbackground-color: var(--sds-color-semantic-surface-disabled);\n\t\t\tpointer-events: none;\n\t\t}\n\t}\n\n\t.sds-nav-card--hasIcon {\n\t\tpadding: var(--sds-spacing-7) var(--sds-spacing-7) var(--sds-spacing-8);\n\t}\n\n\t.sds-nav-card__content {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\twidth: 100%;\n\t\tgap: var(--sds-spacing-3);\n\t}\n\n\t.sds-nav-card__text {\n\t\tdisplay: -webkit-box;\n\t\t-webkit-line-clamp: 3;\n\t\t-webkit-box-orient: vertical;\n\t\toverflow: hidden;\n\t}\n\n\t::slotted(*) {\n\t\theight: 4.5rem;\n\t\tmin-width: 4.5rem;\n\t\twidth: 4.5rem;\n\t\talign-self: center;\n\t\tstroke: var(\n\t\t\t--sds-color-global-black\n\t\t); // TODO: Global variable used, should be replaced by a more spesific one\n\t}\n\n\t.sds-nav-card__heading {\n\t\tfont-weight: 700;\n\t\tfont-size: 1.5rem;\n\t\tmargin: 0;\n\t}\n\n\t.sds-nav-card--medium {\n\t\tmin-height: 7rem;\n\n\t\t.sds-nav-card__text {\n\t\t\tdisplay: -webkit-box;\n\t\t\tdisplay: flex;\n\n\t\t\t-webkit-line-clamp: 1;\n\t\t\t-webkit-box-orient: vertical;\n\n\t\t\toverflow: hidden;\n\t\t\ttext-overflow: ellipsis;\n\t\t}\n\n\t\t::slotted(*) {\n\t\t\theight: 3rem;\n\t\t\tmin-width: 3rem;\n\t\t\twidth: 3rem;\n\t\t}\n\t}\n\n\t.sds-nav-card--small {\n\t\tmin-height: 4.5rem;\n\t\tpadding: var(--sds-spacing-5) var(--sds-spacing-8) var(--sds-spacing-6);\n\n\t\t.sds-nav-card--hasIcon {\n\t\t\tpadding: var(--sds-spacing-5) var(--sds-spacing-7)\n\t\t\t\tvar(--sds-spacing-6);\n\t\t}\n\n\t\t.sds-nav-card__content {\n\t\t\tgap: 0;\n\t\t\talign-self: center;\n\t\t}\n\n\t\t::slotted(*) {\n\t\t\theight: 2.5rem;\n\t\t\tmin-width: 2.5rem;\n\t\t\twidth: 2.5rem;\n\t\t}\n\t}\n`;\n"]}
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import { LitElement } from 'lit';
|
|
2
|
-
type Size = 'xl' | 'l' | 'm';
|
|
3
|
-
export interface SDSParagraphProps {
|
|
4
|
-
size?: Size;
|
|
5
|
-
}
|
|
6
|
-
export declare class SDSParagraph extends LitElement {
|
|
7
|
-
static styles: import("lit").CSSResult[];
|
|
8
|
-
size: Size;
|
|
9
|
-
render(): import("lit-html").TemplateResult<1>;
|
|
10
|
-
}
|
|
11
|
-
declare global {
|
|
12
|
-
interface HTMLElementTagNameMap {
|
|
13
|
-
'sds-paragraph': SDSParagraph;
|
|
14
|
-
}
|
|
15
|
-
}
|
|
16
|
-
export {};
|
|
17
|
-
//# sourceMappingURL=sds-paragraph.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"sds-paragraph.d.ts","sourceRoot":"","sources":["../../src/sds-paragraph/sds-paragraph.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAMvC,KAAK,IAAI,GAAG,IAAI,GAAG,GAAG,GAAG,GAAG,CAAC;AAE7B,MAAM,WAAW,iBAAiB;IACjC,IAAI,CAAC,EAAE,IAAI,CAAC;CACZ;AAED,qBACa,YAAa,SAAQ,UAAU;IAE3C,OAAgB,MAAM,4BAAY;IAGN,IAAI,EAAE,IAAI,CAAQ;IAErC,MAAM;CAYf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,eAAe,EAAE,YAAY,CAAC;KAC9B;CACD"}
|
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
|
|
2
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
};
|
|
7
|
-
import { LitElement, html } from 'lit';
|
|
8
|
-
import { property } from 'lit/decorators.js';
|
|
9
|
-
import { classMap } from 'lit/directives/class-map.js';
|
|
10
|
-
import { guardedCustomElement } from '../utils/guarded-custom-element';
|
|
11
|
-
import { styles } from './sds-paragraph.styles';
|
|
12
|
-
let SDSParagraph = class SDSParagraph extends LitElement {
|
|
13
|
-
constructor() {
|
|
14
|
-
super(...arguments);
|
|
15
|
-
// Reactive Props
|
|
16
|
-
this.size = 'xl';
|
|
17
|
-
}
|
|
18
|
-
render() {
|
|
19
|
-
const styleClasses = {
|
|
20
|
-
'sds-paragraph': true,
|
|
21
|
-
'sds-paragraph--xl': this.size === 'xl',
|
|
22
|
-
'sds-paragraph--l': this.size === 'l',
|
|
23
|
-
'sds-paragraph--m': this.size === 'm',
|
|
24
|
-
};
|
|
25
|
-
const classes = classMap(styleClasses);
|
|
26
|
-
return html `<p class=${classes}><slot></slot></p>`;
|
|
27
|
-
}
|
|
28
|
-
};
|
|
29
|
-
// Styling
|
|
30
|
-
SDSParagraph.styles = [styles];
|
|
31
|
-
__decorate([
|
|
32
|
-
property({ type: String })
|
|
33
|
-
], SDSParagraph.prototype, "size", void 0);
|
|
34
|
-
SDSParagraph = __decorate([
|
|
35
|
-
guardedCustomElement('sds-paragraph')
|
|
36
|
-
], SDSParagraph);
|
|
37
|
-
export { SDSParagraph };
|
|
38
|
-
//# sourceMappingURL=sds-paragraph.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"sds-paragraph.js","sourceRoot":"","sources":["../../src/sds-paragraph/sds-paragraph.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AACvE,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AASzC,IAAM,YAAY,GAAlB,MAAM,YAAa,SAAQ,UAAU;IAArC;;QAIN,iBAAiB;QACW,SAAI,GAAS,IAAI,CAAC;IAc/C,CAAC;IAZS,MAAM;QACd,MAAM,YAAY,GAAG;YACpB,eAAe,EAAE,IAAI;YACrB,mBAAmB,EAAE,IAAI,CAAC,IAAI,KAAK,IAAI;YACvC,kBAAkB,EAAE,IAAI,CAAC,IAAI,KAAK,GAAG;YACrC,kBAAkB,EAAE,IAAI,CAAC,IAAI,KAAK,GAAG;SACrC,CAAC;QAEF,MAAM,OAAO,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;QAEvC,OAAO,IAAI,CAAA,YAAY,OAAO,oBAAoB,CAAC;IACpD,CAAC;;AAjBD,UAAU;AACM,mBAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAGN;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAmB;AALlC,YAAY;IADxB,oBAAoB,CAAC,eAAe,CAAC;GACzB,YAAY,CAmBxB","sourcesContent":["import { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { guardedCustomElement } from '../utils/guarded-custom-element';\nimport { styles } from './sds-paragraph.styles';\n\ntype Size = 'xl' | 'l' | 'm';\n\nexport interface SDSParagraphProps {\n\tsize?: Size;\n}\n\n@guardedCustomElement('sds-paragraph')\nexport class SDSParagraph extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t// Reactive Props\n\t@property({ type: String }) size: Size = 'xl';\n\n\toverride render() {\n\t\tconst styleClasses = {\n\t\t\t'sds-paragraph': true,\n\t\t\t'sds-paragraph--xl': this.size === 'xl',\n\t\t\t'sds-paragraph--l': this.size === 'l',\n\t\t\t'sds-paragraph--m': this.size === 'm',\n\t\t};\n\n\t\tconst classes = classMap(styleClasses);\n\n\t\treturn html`<p class=${classes}><slot></slot></p>`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-paragraph': SDSParagraph;\n\t}\n}\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"sds-paragraph.styles.d.ts","sourceRoot":"","sources":["../../src/sds-paragraph/sds-paragraph.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAkClB,CAAC"}
|
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
import { css } from 'lit';
|
|
2
|
-
export const styles = css `
|
|
3
|
-
:host {
|
|
4
|
-
display: block;
|
|
5
|
-
}
|
|
6
|
-
|
|
7
|
-
.sds-paragraph {
|
|
8
|
-
font-family: var(--sds-typography-font-family);
|
|
9
|
-
font-weight: 400;
|
|
10
|
-
color: var(--sds-color-semantic-text-default);
|
|
11
|
-
margin: 0;
|
|
12
|
-
max-width: var(--sds-typography-max-line-width);
|
|
13
|
-
padding: 0;
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
.sds-paragraph--xl {
|
|
17
|
-
font-size: 1.25rem;
|
|
18
|
-
line-height: 1.4;
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
.sds-paragraph--l {
|
|
22
|
-
font-size: 1.125rem;
|
|
23
|
-
line-height: 1.333;
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
.sds-paragraph--m {
|
|
27
|
-
font-size: 1rem;
|
|
28
|
-
line-height: 1.5;
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
@media (max-width: 640px) {
|
|
32
|
-
.sds-paragraph--m {
|
|
33
|
-
line-height: 1.375;
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
`;
|
|
37
|
-
//# sourceMappingURL=sds-paragraph.styles.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"sds-paragraph.styles.js","sourceRoot":"","sources":["../../src/sds-paragraph/sds-paragraph.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkCxB,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`\n\t:host {\n\t\tdisplay: block;\n\t}\n\n\t.sds-paragraph {\n\t\tfont-family: var(--sds-typography-font-family);\n\t\tfont-weight: 400;\n\t\tcolor: var(--sds-color-semantic-text-default);\n\t\tmargin: 0;\n\t\tmax-width: var(--sds-typography-max-line-width);\n\t\tpadding: 0;\n\t}\n\n\t.sds-paragraph--xl {\n\t\tfont-size: 1.25rem;\n\t\tline-height: 1.4;\n\t}\n\n\t.sds-paragraph--l {\n\t\tfont-size: 1.125rem;\n\t\tline-height: 1.333;\n\t}\n\n\t.sds-paragraph--m {\n\t\tfont-size: 1rem;\n\t\tline-height: 1.5;\n\t}\n\n\t@media (max-width: 640px) {\n\t\t.sds-paragraph--m {\n\t\t\tline-height: 1.375;\n\t\t}\n\t}\n`;\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"sds-textarea.spec.d.ts","sourceRoot":"","sources":["../../src/sds-textarea/sds-textarea.spec.ts"],"names":[],"mappings":""}
|