@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.
Files changed (210) hide show
  1. package/dist/frameworks/preact.d.ts +54 -17
  2. package/dist/frameworks/preact.d.ts.map +1 -1
  3. package/dist/frameworks/react.d.ts +20 -20
  4. package/dist/frameworks/react.d.ts.map +1 -1
  5. package/dist/react-wrappers/SDSAlertWrapper.d.ts +2 -1
  6. package/dist/react-wrappers/SDSAlertWrapper.d.ts.map +1 -1
  7. package/dist/react-wrappers/SDSAlertWrapper.js +1 -1
  8. package/dist/react-wrappers/SDSAlertWrapper.js.map +1 -1
  9. package/dist/react-wrappers/SDSButtonWrapper.d.ts +4 -3
  10. package/dist/react-wrappers/SDSButtonWrapper.d.ts.map +1 -1
  11. package/dist/react-wrappers/SDSButtonWrapper.js +1 -1
  12. package/dist/react-wrappers/SDSButtonWrapper.js.map +1 -1
  13. package/dist/react-wrappers/SDSCheckboxGroupWrapper.d.ts +2 -1
  14. package/dist/react-wrappers/SDSCheckboxGroupWrapper.d.ts.map +1 -1
  15. package/dist/react-wrappers/SDSCheckboxGroupWrapper.js +1 -1
  16. package/dist/react-wrappers/SDSCheckboxGroupWrapper.js.map +1 -1
  17. package/dist/react-wrappers/SDSCheckboxWrapper.d.ts +4 -3
  18. package/dist/react-wrappers/SDSCheckboxWrapper.d.ts.map +1 -1
  19. package/dist/react-wrappers/SDSCheckboxWrapper.js +1 -1
  20. package/dist/react-wrappers/SDSCheckboxWrapper.js.map +1 -1
  21. package/dist/react-wrappers/SDSChipWrapper.d.ts +3 -2
  22. package/dist/react-wrappers/SDSChipWrapper.d.ts.map +1 -1
  23. package/dist/react-wrappers/SDSChipWrapper.js +1 -1
  24. package/dist/react-wrappers/SDSChipWrapper.js.map +1 -1
  25. package/dist/react-wrappers/SDSNotificationWrapper.d.ts +2 -1
  26. package/dist/react-wrappers/SDSNotificationWrapper.d.ts.map +1 -1
  27. package/dist/react-wrappers/SDSNotificationWrapper.js +1 -1
  28. package/dist/react-wrappers/SDSNotificationWrapper.js.map +1 -1
  29. package/dist/react-wrappers/SDSRadioGroupWrapper.d.ts +2 -1
  30. package/dist/react-wrappers/SDSRadioGroupWrapper.d.ts.map +1 -1
  31. package/dist/react-wrappers/SDSRadioGroupWrapper.js +1 -1
  32. package/dist/react-wrappers/SDSRadioGroupWrapper.js.map +1 -1
  33. package/dist/react-wrappers/SDSRadioWrapper.d.ts +4 -3
  34. package/dist/react-wrappers/SDSRadioWrapper.d.ts.map +1 -1
  35. package/dist/react-wrappers/SDSRadioWrapper.js +1 -1
  36. package/dist/react-wrappers/SDSRadioWrapper.js.map +1 -1
  37. package/dist/react-wrappers/SDSSwitchWrapper.d.ts +4 -3
  38. package/dist/react-wrappers/SDSSwitchWrapper.d.ts.map +1 -1
  39. package/dist/react-wrappers/SDSSwitchWrapper.js +1 -1
  40. package/dist/react-wrappers/SDSSwitchWrapper.js.map +1 -1
  41. package/dist/react-wrappers/SDSTextAreaWrapper.d.ts +6 -5
  42. package/dist/react-wrappers/SDSTextAreaWrapper.d.ts.map +1 -1
  43. package/dist/react-wrappers/SDSTextAreaWrapper.js +1 -1
  44. package/dist/react-wrappers/SDSTextAreaWrapper.js.map +1 -1
  45. package/dist/react-wrappers/SDSTextFieldWrapper.d.ts +6 -6
  46. package/dist/react-wrappers/SDSTextFieldWrapper.d.ts.map +1 -1
  47. package/dist/react-wrappers/SDSTextFieldWrapper.js +1 -1
  48. package/dist/react-wrappers/SDSTextFieldWrapper.js.map +1 -1
  49. package/dist/sds-alert/sds-alert.d.ts +4 -2
  50. package/dist/sds-alert/sds-alert.d.ts.map +1 -1
  51. package/dist/sds-alert/sds-alert.js.map +1 -1
  52. package/dist/sds-button/sds-button.d.ts +0 -3
  53. package/dist/sds-button/sds-button.d.ts.map +1 -1
  54. package/dist/sds-button/sds-button.js.map +1 -1
  55. package/dist/sds-button/sds-button.styles.d.ts.map +1 -1
  56. package/dist/sds-button/sds-button.styles.js +4 -0
  57. package/dist/sds-button/sds-button.styles.js.map +1 -1
  58. package/dist/sds-card/sds-card.d.ts +2 -2
  59. package/dist/sds-card/sds-card.d.ts.map +1 -1
  60. package/dist/sds-card/sds-card.js +5 -8
  61. package/dist/sds-card/sds-card.js.map +1 -1
  62. package/dist/sds-card/sds-card.styles.js +2 -2
  63. package/dist/sds-card/sds-card.styles.js.map +1 -1
  64. package/dist/sds-checkbox/sds-checkbox.d.ts +0 -11
  65. package/dist/sds-checkbox/sds-checkbox.d.ts.map +1 -1
  66. package/dist/sds-checkbox/sds-checkbox.js +1 -7
  67. package/dist/sds-checkbox/sds-checkbox.js.map +1 -1
  68. package/dist/sds-checkbox-group/sds-checkbox-group.d.ts +0 -3
  69. package/dist/sds-checkbox-group/sds-checkbox-group.d.ts.map +1 -1
  70. package/dist/sds-checkbox-group/sds-checkbox-group.js.map +1 -1
  71. package/dist/sds-chip/sds-chip.d.ts +0 -5
  72. package/dist/sds-chip/sds-chip.d.ts.map +1 -1
  73. package/dist/sds-chip/sds-chip.js.map +1 -1
  74. package/dist/sds-heading/sds-heading.d.ts +3 -3
  75. package/dist/sds-heading/sds-heading.d.ts.map +1 -1
  76. package/dist/sds-heading/sds-heading.js +7 -7
  77. package/dist/sds-heading/sds-heading.js.map +1 -1
  78. package/dist/sds-heading/sds-heading.styles.d.ts.map +1 -1
  79. package/dist/sds-heading/sds-heading.styles.js +5 -1
  80. package/dist/sds-heading/sds-heading.styles.js.map +1 -1
  81. package/dist/sds-icon/sds-icon.styles.d.ts.map +1 -1
  82. package/dist/sds-icon/sds-icon.styles.js +6 -0
  83. package/dist/sds-icon/sds-icon.styles.js.map +1 -1
  84. package/dist/sds-notification/sds-notification.d.ts +4 -2
  85. package/dist/sds-notification/sds-notification.d.ts.map +1 -1
  86. package/dist/sds-notification/sds-notification.js.map +1 -1
  87. package/dist/sds-radio/sds-radio.d.ts +0 -7
  88. package/dist/sds-radio/sds-radio.d.ts.map +1 -1
  89. package/dist/sds-radio/sds-radio.js +5 -16
  90. package/dist/sds-radio/sds-radio.js.map +1 -1
  91. package/dist/sds-radio-group/sds-radio-group.d.ts +0 -3
  92. package/dist/sds-radio-group/sds-radio-group.d.ts.map +1 -1
  93. package/dist/sds-radio-group/sds-radio-group.js.map +1 -1
  94. package/dist/sds-switch/sds-switch.d.ts +0 -12
  95. package/dist/sds-switch/sds-switch.d.ts.map +1 -1
  96. package/dist/sds-switch/sds-switch.js.map +1 -1
  97. package/dist/sds-text/sds-text.styles.d.ts.map +1 -1
  98. package/dist/sds-text/sds-text.styles.js +5 -1
  99. package/dist/sds-text/sds-text.styles.js.map +1 -1
  100. package/dist/sds-textarea/sds-textarea.d.ts +0 -5
  101. package/dist/sds-textarea/sds-textarea.d.ts.map +1 -1
  102. package/dist/sds-textarea/sds-textarea.js.map +1 -1
  103. package/dist/sds-textfield/sds-textfield.styles.d.ts.map +1 -1
  104. package/dist/sds-textfield/sds-textfield.styles.js +3 -1
  105. package/dist/sds-textfield/sds-textfield.styles.js.map +1 -1
  106. package/dist/sheriff-web-components.js +43 -42
  107. package/dist/types.d.ts +3 -0
  108. package/dist/types.d.ts.map +1 -1
  109. package/dist/types.js.map +1 -1
  110. package/package.json +143 -143
  111. package/dist/playwright-util/screenshot.d.ts +0 -3
  112. package/dist/playwright-util/screenshot.d.ts.map +0 -1
  113. package/dist/playwright-util/screenshot.js +0 -25
  114. package/dist/playwright-util/screenshot.js.map +0 -1
  115. package/dist/react-wrappers/SDSDetailWrapper.d.ts +0 -3
  116. package/dist/react-wrappers/SDSDetailWrapper.d.ts.map +0 -1
  117. package/dist/react-wrappers/SDSDetailWrapper.js +0 -10
  118. package/dist/react-wrappers/SDSDetailWrapper.js.map +0 -1
  119. package/dist/react-wrappers/SDSLabelWrapper.d.ts +0 -3
  120. package/dist/react-wrappers/SDSLabelWrapper.d.ts.map +0 -1
  121. package/dist/react-wrappers/SDSLabelWrapper.js +0 -10
  122. package/dist/react-wrappers/SDSLabelWrapper.js.map +0 -1
  123. package/dist/react-wrappers/SDSLinkWrapper.d.ts +0 -3
  124. package/dist/react-wrappers/SDSLinkWrapper.d.ts.map +0 -1
  125. package/dist/react-wrappers/SDSLinkWrapper.js +0 -10
  126. package/dist/react-wrappers/SDSLinkWrapper.js.map +0 -1
  127. package/dist/react-wrappers/SDSNavCardWrapper.d.ts +0 -3
  128. package/dist/react-wrappers/SDSNavCardWrapper.d.ts.map +0 -1
  129. package/dist/react-wrappers/SDSNavCardWrapper.js +0 -10
  130. package/dist/react-wrappers/SDSNavCardWrapper.js.map +0 -1
  131. package/dist/react-wrappers/SDSParagraphWrapper.d.ts +0 -3
  132. package/dist/react-wrappers/SDSParagraphWrapper.d.ts.map +0 -1
  133. package/dist/react-wrappers/SDSParagraphWrapper.js +0 -10
  134. package/dist/react-wrappers/SDSParagraphWrapper.js.map +0 -1
  135. package/dist/sds-detail/sds-detail.d.ts +0 -17
  136. package/dist/sds-detail/sds-detail.d.ts.map +0 -1
  137. package/dist/sds-detail/sds-detail.js +0 -37
  138. package/dist/sds-detail/sds-detail.js.map +0 -1
  139. package/dist/sds-detail/sds-detail.styles.d.ts +0 -2
  140. package/dist/sds-detail/sds-detail.styles.d.ts.map +0 -1
  141. package/dist/sds-detail/sds-detail.styles.js +0 -25
  142. package/dist/sds-detail/sds-detail.styles.js.map +0 -1
  143. package/dist/sds-icon/sds-icon.allowed-colors.d.ts +0 -3
  144. package/dist/sds-icon/sds-icon.allowed-colors.d.ts.map +0 -1
  145. package/dist/sds-icon/sds-icon.allowed-colors.js +0 -17
  146. package/dist/sds-icon/sds-icon.allowed-colors.js.map +0 -1
  147. package/dist/sds-icon/sds-icon.allowed-names.d.ts +0 -3
  148. package/dist/sds-icon/sds-icon.allowed-names.d.ts.map +0 -1
  149. package/dist/sds-icon/sds-icon.allowed-names.js +0 -2
  150. package/dist/sds-icon/sds-icon.allowed-names.js.map +0 -1
  151. package/dist/sds-icon/sds-icon.color-types.d.ts +0 -2
  152. package/dist/sds-icon/sds-icon.color-types.d.ts.map +0 -1
  153. package/dist/sds-icon/sds-icon.color-types.js +0 -2
  154. package/dist/sds-icon/sds-icon.color-types.js.map +0 -1
  155. package/dist/sds-icon/sds-icon.icon-types.d.ts +0 -2
  156. package/dist/sds-icon/sds-icon.icon-types.d.ts.map +0 -1
  157. package/dist/sds-icon/sds-icon.icon-types.js +0 -2
  158. package/dist/sds-icon/sds-icon.icon-types.js.map +0 -1
  159. package/dist/sds-label/sds-label.d.ts +0 -19
  160. package/dist/sds-label/sds-label.d.ts.map +0 -1
  161. package/dist/sds-label/sds-label.js +0 -42
  162. package/dist/sds-label/sds-label.js.map +0 -1
  163. package/dist/sds-label/sds-label.styles.d.ts +0 -2
  164. package/dist/sds-label/sds-label.styles.d.ts.map +0 -1
  165. package/dist/sds-label/sds-label.styles.js +0 -31
  166. package/dist/sds-label/sds-label.styles.js.map +0 -1
  167. package/dist/sds-link/sds-link.d.ts +0 -22
  168. package/dist/sds-link/sds-link.d.ts.map +0 -1
  169. package/dist/sds-link/sds-link.js +0 -46
  170. package/dist/sds-link/sds-link.js.map +0 -1
  171. package/dist/sds-link/sds-link.styles.d.ts +0 -2
  172. package/dist/sds-link/sds-link.styles.d.ts.map +0 -1
  173. package/dist/sds-link/sds-link.styles.js +0 -74
  174. package/dist/sds-link/sds-link.styles.js.map +0 -1
  175. package/dist/sds-nav-card/sds-nav-card.d.ts +0 -31
  176. package/dist/sds-nav-card/sds-nav-card.d.ts.map +0 -1
  177. package/dist/sds-nav-card/sds-nav-card.js +0 -101
  178. package/dist/sds-nav-card/sds-nav-card.js.map +0 -1
  179. package/dist/sds-nav-card/sds-nav-card.styles.d.ts +0 -2
  180. package/dist/sds-nav-card/sds-nav-card.styles.d.ts.map +0 -1
  181. package/dist/sds-nav-card/sds-nav-card.styles.js +0 -150
  182. package/dist/sds-nav-card/sds-nav-card.styles.js.map +0 -1
  183. package/dist/sds-paragraph/sds-paragraph.d.ts +0 -17
  184. package/dist/sds-paragraph/sds-paragraph.d.ts.map +0 -1
  185. package/dist/sds-paragraph/sds-paragraph.js +0 -38
  186. package/dist/sds-paragraph/sds-paragraph.js.map +0 -1
  187. package/dist/sds-paragraph/sds-paragraph.styles.d.ts +0 -2
  188. package/dist/sds-paragraph/sds-paragraph.styles.d.ts.map +0 -1
  189. package/dist/sds-paragraph/sds-paragraph.styles.js +0 -37
  190. package/dist/sds-paragraph/sds-paragraph.styles.js.map +0 -1
  191. package/dist/sds-textarea/sds-textarea.spec.d.ts +0 -2
  192. package/dist/sds-textarea/sds-textarea.spec.d.ts.map +0 -1
  193. package/dist/sds-textarea/sds-textarea.spec.js +0 -178
  194. package/dist/sds-textarea/sds-textarea.spec.js.map +0 -1
  195. package/dist/utils/hmr-helper.d.ts +0 -2
  196. package/dist/utils/hmr-helper.d.ts.map +0 -1
  197. package/dist/utils/hmr-helper.js +0 -17
  198. package/dist/utils/hmr-helper.js.map +0 -1
  199. package/dist/utils/renderErrorMessage.d.ts +0 -3
  200. package/dist/utils/renderErrorMessage.d.ts.map +0 -1
  201. package/dist/utils/renderErrorMessage.js +0 -9
  202. package/dist/utils/renderErrorMessage.js.map +0 -1
  203. package/dist/utils/safe-custom-element.d.ts +0 -2
  204. package/dist/utils/safe-custom-element.d.ts.map +0 -1
  205. package/dist/utils/safe-custom-element.js +0 -9
  206. package/dist/utils/safe-custom-element.js.map +0 -1
  207. package/dist/utils/types.d.ts +0 -2
  208. package/dist/utils/types.d.ts.map +0 -1
  209. package/dist/utils/types.js +0 -2
  210. 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,2 +0,0 @@
1
- export declare const styles: import("lit").CSSResult;
2
- //# sourceMappingURL=sds-link.styles.d.ts.map
@@ -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,2 +0,0 @@
1
- export declare const styles: import("lit").CSSResult;
2
- //# sourceMappingURL=sds-nav-card.styles.d.ts.map
@@ -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,2 +0,0 @@
1
- export declare const styles: import("lit").CSSResult;
2
- //# sourceMappingURL=sds-paragraph.styles.d.ts.map
@@ -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,2 +0,0 @@
1
- export {};
2
- //# sourceMappingURL=sds-textarea.spec.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"sds-textarea.spec.d.ts","sourceRoot":"","sources":["../../src/sds-textarea/sds-textarea.spec.ts"],"names":[],"mappings":""}