@politiet/sheriff-web-components 0.6.0 → 0.6.2

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 (77) hide show
  1. package/dist/index.d.ts +18 -18
  2. package/dist/index.d.ts.map +1 -1
  3. package/dist/index.js +18 -18
  4. package/dist/index.js.map +1 -1
  5. package/dist/sds-button/sds-button.d.ts +17 -0
  6. package/dist/sds-button/sds-button.d.ts.map +1 -1
  7. package/dist/sds-button/sds-button.js +23 -3
  8. package/dist/sds-button/sds-button.js.map +1 -1
  9. package/dist/sds-checkbox/sds-checkbox.d.ts +24 -0
  10. package/dist/sds-checkbox/sds-checkbox.d.ts.map +1 -1
  11. package/dist/sds-checkbox/sds-checkbox.js +21 -0
  12. package/dist/sds-checkbox/sds-checkbox.js.map +1 -1
  13. package/dist/sds-checkbox-group/sds-checkbox-group.d.ts +14 -0
  14. package/dist/sds-checkbox-group/sds-checkbox-group.d.ts.map +1 -1
  15. package/dist/sds-checkbox-group/sds-checkbox-group.js +23 -2
  16. package/dist/sds-checkbox-group/sds-checkbox-group.js.map +1 -1
  17. package/dist/sds-chip/sds-chip.d.ts +18 -0
  18. package/dist/sds-chip/sds-chip.d.ts.map +1 -1
  19. package/dist/sds-chip/sds-chip.js +24 -2
  20. package/dist/sds-chip/sds-chip.js.map +1 -1
  21. package/dist/sds-detail/sds-detail.d.ts +8 -0
  22. package/dist/sds-detail/sds-detail.d.ts.map +1 -1
  23. package/dist/sds-detail/sds-detail.js +21 -0
  24. package/dist/sds-detail/sds-detail.js.map +1 -1
  25. package/dist/sds-heading/sds-heading.d.ts +9 -0
  26. package/dist/sds-heading/sds-heading.d.ts.map +1 -1
  27. package/dist/sds-heading/sds-heading.js +21 -0
  28. package/dist/sds-heading/sds-heading.js.map +1 -1
  29. package/dist/sds-icon/sds-icon.d.ts +11 -0
  30. package/dist/sds-icon/sds-icon.d.ts.map +1 -1
  31. package/dist/sds-icon/sds-icon.js +21 -0
  32. package/dist/sds-icon/sds-icon.js.map +1 -1
  33. package/dist/sds-label/sds-label.d.ts +9 -0
  34. package/dist/sds-label/sds-label.d.ts.map +1 -1
  35. package/dist/sds-label/sds-label.js +22 -3
  36. package/dist/sds-label/sds-label.js.map +1 -1
  37. package/dist/sds-link/sds-link.d.ts +10 -0
  38. package/dist/sds-link/sds-link.d.ts.map +1 -1
  39. package/dist/sds-link/sds-link.js +21 -0
  40. package/dist/sds-link/sds-link.js.map +1 -1
  41. package/dist/sds-loader/sds-loader.d.ts +9 -0
  42. package/dist/sds-loader/sds-loader.d.ts.map +1 -1
  43. package/dist/sds-loader/sds-loader.js +22 -1
  44. package/dist/sds-loader/sds-loader.js.map +1 -1
  45. package/dist/sds-nav-card/sds-nav-card.d.ts +16 -11
  46. package/dist/sds-nav-card/sds-nav-card.d.ts.map +1 -1
  47. package/dist/sds-nav-card/sds-nav-card.js +21 -11
  48. package/dist/sds-nav-card/sds-nav-card.js.map +1 -1
  49. package/dist/sds-notification/sds-notification.d.ts +10 -0
  50. package/dist/sds-notification/sds-notification.d.ts.map +1 -1
  51. package/dist/sds-notification/sds-notification.js +21 -0
  52. package/dist/sds-notification/sds-notification.js.map +1 -1
  53. package/dist/sds-paragraph/sds-paragraph.d.ts +8 -0
  54. package/dist/sds-paragraph/sds-paragraph.d.ts.map +1 -1
  55. package/dist/sds-paragraph/sds-paragraph.js +21 -0
  56. package/dist/sds-paragraph/sds-paragraph.js.map +1 -1
  57. package/dist/sds-radio/sds-radio.d.ts +25 -6
  58. package/dist/sds-radio/sds-radio.d.ts.map +1 -1
  59. package/dist/sds-radio/sds-radio.js +23 -9
  60. package/dist/sds-radio/sds-radio.js.map +1 -1
  61. package/dist/sds-radio-group/sds-radio-group.d.ts +14 -0
  62. package/dist/sds-radio-group/sds-radio-group.d.ts.map +1 -1
  63. package/dist/sds-radio-group/sds-radio-group.js +23 -6
  64. package/dist/sds-radio-group/sds-radio-group.js.map +1 -1
  65. package/dist/sds-switch/sds-switch.d.ts +3 -13
  66. package/dist/sds-switch/sds-switch.d.ts.map +1 -1
  67. package/dist/sds-switch/sds-switch.js +24 -54
  68. package/dist/sds-switch/sds-switch.js.map +1 -1
  69. package/dist/sds-text/sds-text.d.ts +8 -0
  70. package/dist/sds-text/sds-text.d.ts.map +1 -1
  71. package/dist/sds-text/sds-text.js +21 -0
  72. package/dist/sds-text/sds-text.js.map +1 -1
  73. package/dist/sds-textfield/sds-textfield.d.ts +35 -3
  74. package/dist/sds-textfield/sds-textfield.d.ts.map +1 -1
  75. package/dist/sds-textfield/sds-textfield.js +21 -0
  76. package/dist/sds-textfield/sds-textfield.js.map +1 -1
  77. package/package.json +91 -1
@@ -1,5 +1,8 @@
1
1
  import { LitElement } from 'lit';
2
2
  type Size = 'l' | 'm' | 's';
3
+ interface SDSTextProps {
4
+ size?: Size;
5
+ }
3
6
  export declare class SDSText extends LitElement {
4
7
  static styles: import("lit").CSSResult[];
5
8
  size: Size;
@@ -9,6 +12,11 @@ declare global {
9
12
  interface HTMLElementTagNameMap {
10
13
  'sds-text': SDSText;
11
14
  }
15
+ namespace JSX {
16
+ interface IntrinsicElements {
17
+ 'sds-text': SDSTextProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
18
+ }
19
+ }
12
20
  }
13
21
  export {};
14
22
  //# sourceMappingURL=sds-text.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"sds-text.d.ts","sourceRoot":"","sources":["../../src/sds-text/sds-text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAKvC,KAAK,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAE5B,qBACa,OAAQ,SAAQ,UAAU;IAEtC,OAAgB,MAAM,4BAAY;IAIlC,IAAI,EAAE,IAAI,CAAO;IAER,MAAM;CAYf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,UAAU,EAAE,OAAO,CAAC;KACpB;CACD"}
1
+ {"version":3,"file":"sds-text.d.ts","sourceRoot":"","sources":["../../src/sds-text/sds-text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAKvC,KAAK,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAE5B,UAAU,YAAY;IACrB,IAAI,CAAC,EAAE,IAAI,CAAC;CACZ;AAED,qBACa,OAAQ,SAAQ,UAAU;IAEtC,OAAgB,MAAM,4BAAY;IAGN,IAAI,EAAE,IAAI,CAAO;IAEpC,MAAM;CAYf;AAED,OAAO,CAAC,MAAM,CAAC;IAEd,UAAU,qBAAqB;QAC9B,UAAU,EAAE,OAAO,CAAC;KACpB;IAGD,UAAU,GAAG,CAAC;QACb,UAAU,iBAAiB;YAC1B,UAAU,EAAE,YAAY,GAAG,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,WAAW,CAAC,CAAC;SACnG;KACD;CACD"}
@@ -34,4 +34,25 @@ SDSText = __decorate([
34
34
  customElement('sds-text')
35
35
  ], SDSText);
36
36
  export { SDSText };
37
+ /*
38
+ // Angular
39
+ declare module '@angular/core' {
40
+ interface IntrinsicElements {
41
+ 'sds-text': SDSTextProps;
42
+ }
43
+ }
44
+
45
+ // Vue
46
+ declare module 'vue' {
47
+ export interface GlobalComponents {
48
+ 'sds-text': SDSTextProps;
49
+ }
50
+ }
51
+
52
+ // Svelte
53
+ declare namespace svelteHTML {
54
+ interface HTMLAttributes<T> {
55
+ 'sds-text'?: SDSTextProps;
56
+ }
57
+ } */
37
58
  //# sourceMappingURL=sds-text.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"sds-text.js","sourceRoot":"","sources":["../../src/sds-text/sds-text.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAKpC,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQ,UAAU;IAAhC;;QAIN,iBAAiB;QAEjB,SAAI,GAAS,GAAG,CAAC;IAclB,CAAC;IAZS,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,OAAO,oBAAoB,CAAC;IACpD,CAAC;;AAlBD,UAAU;AACM,cAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAIlC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qCACV;AANL,OAAO;IADnB,aAAa,CAAC,UAAU,CAAC;GACb,OAAO,CAoBnB","sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './sds-text.styles';\n\ntype Size = 'l' | 'm' | 's';\n\n@customElement('sds-text')\nexport class SDSText extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t// Reactive Props\n\t@property({ type: String })\n\tsize: Size = 'l';\n\n\toverride render() {\n\t\tconst styleClasses = {\n\t\t\t'sds-text': true,\n\t\t\t'sds-text--l': this.size === 'l',\n\t\t\t'sds-text--m': this.size === 'm',\n\t\t\t'sds-text--s': this.size === 's',\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-text': SDSText;\n\t}\n}\n"]}
1
+ {"version":3,"file":"sds-text.js","sourceRoot":"","sources":["../../src/sds-text/sds-text.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AASpC,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQ,UAAU;IAAhC;;QAIN,iBAAiB;QACW,SAAI,GAAS,GAAG,CAAC;IAc9C,CAAC;IAZS,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,OAAO,oBAAoB,CAAC;IACpD,CAAC;;AAjBD,UAAU;AACM,cAAM,GAAG,CAAC,MAAM,CAAC,AAAX,CAAY;AAGN;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qCAAkB;AALjC,OAAO;IADnB,aAAa,CAAC,UAAU,CAAC;GACb,OAAO,CAmBnB;;AAgBD;;;;;;;;;;;;;;;;;;;;IAoBI","sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './sds-text.styles';\n\ntype Size = 'l' | 'm' | 's';\n\ninterface SDSTextProps {\n\tsize?: Size;\n}\n\n@customElement('sds-text')\nexport class SDSText extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t// Reactive Props\n\t@property({ type: String }) size: Size = 'l';\n\n\toverride render() {\n\t\tconst styleClasses = {\n\t\t\t'sds-text': true,\n\t\t\t'sds-text--l': this.size === 'l',\n\t\t\t'sds-text--m': this.size === 'm',\n\t\t\t'sds-text--s': this.size === 's',\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\t// HTML\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-text': SDSText;\n\t}\n\n\t// React\n\tnamespace JSX {\n\t\tinterface IntrinsicElements {\n\t\t\t'sds-text': SDSTextProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;\n\t\t}\n\t}\n}\n\n/*\n// Angular\ndeclare module '@angular/core' {\n\tinterface IntrinsicElements {\n\t\t'sds-text': SDSTextProps;\n\t}\n}\n\n// Vue\ndeclare module 'vue' {\n\texport interface GlobalComponents {\n\t\t'sds-text': SDSTextProps;\n\t}\n}\n\n// Svelte\ndeclare namespace svelteHTML {\n\tinterface HTMLAttributes<T> {\n\t\t'sds-text'?: SDSTextProps;\n\t}\n} */\n"]}
@@ -1,6 +1,33 @@
1
1
  import { LitElement } from 'lit';
2
2
  import '../sds-icon/sds-icon';
3
3
  type InputType = 'text' | 'email' | 'tel' | 'number' | 'password' | 'search' | 'url';
4
+ interface SDSTextFieldProps {
5
+ type?: InputType;
6
+ value?: string;
7
+ name?: string;
8
+ label?: string;
9
+ placeholder?: string;
10
+ 'help-text'?: string;
11
+ 'error-message'?: string;
12
+ disabled?: boolean;
13
+ readonly?: boolean;
14
+ autocomplete?: boolean;
15
+ onInput?: (event: CustomEvent<{
16
+ value: string;
17
+ }>) => void;
18
+ onChange?: (event: CustomEvent<{
19
+ value: string;
20
+ }>) => void;
21
+ onSelect?: (event: CustomEvent<{
22
+ selectedText: string;
23
+ }>) => void;
24
+ onFocus?: (event: CustomEvent<{
25
+ value: string;
26
+ }>) => void;
27
+ onBlur?: (event: CustomEvent<{
28
+ value: string;
29
+ }>) => void;
30
+ }
4
31
  export declare class SDSTextField extends LitElement {
5
32
  static styles: import("lit").CSSResult[];
6
33
  type: InputType;
@@ -10,9 +37,9 @@ export declare class SDSTextField extends LitElement {
10
37
  placeholder?: string;
11
38
  helpText?: string;
12
39
  errorMessage?: string;
13
- disabled?: boolean;
14
- readOnly?: boolean;
15
- autocomplete?: boolean;
40
+ disabled: boolean;
41
+ readOnly: boolean;
42
+ autocomplete: boolean;
16
43
  private hasIcon;
17
44
  private readonly handleSlotChange;
18
45
  private readonly _handleInput;
@@ -30,6 +57,11 @@ declare global {
30
57
  interface HTMLElementTagNameMap {
31
58
  'sds-textfield': SDSTextField;
32
59
  }
60
+ namespace JSX {
61
+ interface IntrinsicElements {
62
+ 'sds-textfield': SDSTextFieldProps & React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
63
+ }
64
+ }
33
65
  }
34
66
  export {};
35
67
  //# sourceMappingURL=sds-textfield.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"sds-textfield.d.ts","sourceRoot":"","sources":["../../src/sds-textfield/sds-textfield.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAiB,MAAM,KAAK,CAAC;AAMhD,OAAO,sBAAsB,CAAC;AAE9B,KAAK,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,GAAG,UAAU,GAAG,QAAQ,GAAG,KAAK,CAAC;AAErF,qBACa,YAAa,SAAQ,UAAU;IAE3C,OAAgB,MAAM,4BAAY;IAIlC,IAAI,EAAE,SAAS,CAAU;IAGzB,KAAK,CAAC,EAAE,MAAM,CAAC;IAGf,IAAI,CAAC,EAAE,MAAM,CAAC;IAGd,KAAK,CAAC,EAAE,MAAM,CAAC;IAGf,WAAW,CAAC,EAAE,MAAM,CAAC;IAGrB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAGlB,YAAY,CAAC,EAAE,MAAM,CAAC;IAGtB,QAAQ,CAAC,EAAE,OAAO,CAAS;IAG3B,QAAQ,CAAC,EAAE,OAAO,CAAS;IAG3B,YAAY,CAAC,EAAE,OAAO,CAAS;IAI/B,OAAO,CAAC,OAAO,CAAS;IAExB,OAAO,CAAC,QAAQ,CAAC,gBAAgB,CAG/B;IAGF,OAAO,CAAC,QAAQ,CAAC,YAAY,CAW3B;IAEF,OAAO,CAAC,QAAQ,CAAC,aAAa,CAW5B;IAEF,OAAO,CAAC,QAAQ,CAAC,aAAa,CAc5B;IAEF,OAAO,CAAC,QAAQ,CAAC,YAAY,CAS3B;IAEF,OAAO,CAAC,QAAQ,CAAC,WAAW,CAS1B;IAEF,MAAM,IAAI,IAAI;IAIL,KAAK,IAAI,IAAI;IAIb,IAAI,IAAI,IAAI;IAIZ,KAAK,IAAI,IAAI;IAIb,MAAM;CA+Cf;AAED,OAAO,CAAC,MAAM,CAAC;IACd,UAAU,qBAAqB;QAC9B,eAAe,EAAE,YAAY,CAAC;KAC9B;CACD"}
1
+ {"version":3,"file":"sds-textfield.d.ts","sourceRoot":"","sources":["../../src/sds-textfield/sds-textfield.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAiB,MAAM,KAAK,CAAC;AAMhD,OAAO,sBAAsB,CAAC;AAE9B,KAAK,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,GAAG,UAAU,GAAG,QAAQ,GAAG,KAAK,CAAC;AAErF,UAAU,iBAAiB;IAC1B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAC1D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAC3D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,YAAY,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAClE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAC1D,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;CACzD;AAED,qBACa,YAAa,SAAQ,UAAU;IAE3C,OAAgB,MAAM,4BAAY;IAGN,IAAI,EAAE,SAAS,CAAU;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACG,QAAQ,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,MAAM,CAAC;IACjD,QAAQ,EAAE,OAAO,CAAS;IACH,QAAQ,EAAE,OAAO,CAAS;IACjD,YAAY,EAAE,OAAO,CAAS;IAGlD,OAAO,CAAC,OAAO,CAAS;IAEjC,OAAO,CAAC,QAAQ,CAAC,gBAAgB,CAG/B;IAGF,OAAO,CAAC,QAAQ,CAAC,YAAY,CAW3B;IAEF,OAAO,CAAC,QAAQ,CAAC,aAAa,CAW5B;IAEF,OAAO,CAAC,QAAQ,CAAC,aAAa,CAc5B;IAEF,OAAO,CAAC,QAAQ,CAAC,YAAY,CAS3B;IAEF,OAAO,CAAC,QAAQ,CAAC,WAAW,CAS1B;IAEF,MAAM,IAAI,IAAI;IAIL,KAAK,IAAI,IAAI;IAIb,IAAI,IAAI,IAAI;IAIZ,KAAK,IAAI,IAAI;IAIb,MAAM;CA+Cf;AAED,OAAO,CAAC,MAAM,CAAC;IAEd,UAAU,qBAAqB;QAC9B,eAAe,EAAE,YAAY,CAAC;KAC9B;IAGD,UAAU,GAAG,CAAC;QACb,UAAU,iBAAiB;YAC1B,eAAe,EAAE,iBAAiB,GACjC,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,WAAW,CAAC,CAAC;SACzE;KACD;CACD"}
@@ -176,4 +176,25 @@ SDSTextField = __decorate([
176
176
  customElement('sds-textfield')
177
177
  ], SDSTextField);
178
178
  export { SDSTextField };
179
+ /*
180
+ // Angular
181
+ declare module '@angular/core' {
182
+ interface IntrinsicElements {
183
+ 'sds-textfield': SDSTextFieldProps;
184
+ }
185
+ }
186
+
187
+ // Vue
188
+ declare module 'vue' {
189
+ export interface GlobalComponents {
190
+ 'sds-textfield': SDSTextFieldProps;
191
+ }
192
+ }
193
+
194
+ // Svelte
195
+ declare namespace svelteHTML {
196
+ interface HTMLAttributes<T> {
197
+ 'sds-textfield'?: SDSTextFieldProps;
198
+ }
199
+ } */
179
200
  //# sourceMappingURL=sds-textfield.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"sds-textfield.js","sourceRoot":"","sources":["../../src/sds-textfield/sds-textfield.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './sds-textfield.styles';\n\nimport '../sds-icon/sds-icon';\n\ntype InputType = 'text' | 'email' | 'tel' | 'number' | 'password' | 'search' | 'url';\n\n@customElement('sds-textfield')\nexport class SDSTextField extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t// Props\n\t@property({ type: String })\n\ttype: InputType = 'text';\n\n\t@property({ type: String })\n\tvalue?: string;\n\n\t@property({ type: String })\n\tname?: string;\n\n\t@property({ type: String })\n\tlabel?: string;\n\n\t@property({ type: String })\n\tplaceholder?: string;\n\n\t@property({ type: String, attribute: 'help-text' })\n\thelpText?: string;\n\n\t@property({ type: String, attribute: 'error-message' })\n\terrorMessage?: string;\n\n\t@property({ type: Boolean })\n\tdisabled?: boolean = false;\n\n\t@property({ type: Boolean, attribute: 'readonly' })\n\treadOnly?: boolean = false;\n\n\t@property({ type: Boolean })\n\tautocomplete?: boolean = false;\n\n\t// State\n\t@state()\n\tprivate hasIcon = false;\n\n\tprivate readonly handleSlotChange = (e: Event) => {\n\t\tconst slot = e.target as HTMLSlotElement;\n\t\tthis.hasIcon = slot.assignedNodes({ flatten: true }).length > 0;\n\t};\n\n\t// Event handling\n\tprivate readonly _handleInput = (event: InputEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (!this.disabled) {\n\t\t\tthis.dispatchEvent(\n\t\t\t\tnew CustomEvent('input', {\n\t\t\t\t\tdetail: { value: (event.target as HTMLInputElement).value },\n\t\t\t\t\tbubbles: true,\n\t\t\t\t\tcomposed: true,\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly _handleChange = (event: Event) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (!this.disabled) {\n\t\t\tthis.dispatchEvent(\n\t\t\t\tnew CustomEvent('change', {\n\t\t\t\t\tdetail: { value: (event.target as HTMLInputElement).value },\n\t\t\t\t\tbubbles: true,\n\t\t\t\t\tcomposed: true,\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly _handleSelect = (event: Event) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (!this.disabled) {\n\t\t\tconst target = event.target as HTMLInputElement;\n\t\t\tconst selectedText = target.value.substring(target.selectionStart ?? 0, target.selectionEnd ?? 0);\n\n\t\t\tthis.dispatchEvent(\n\t\t\t\tnew CustomEvent('select', {\n\t\t\t\t\tdetail: { selectedText },\n\t\t\t\t\tbubbles: true,\n\t\t\t\t\tcomposed: true,\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly _handleFocus = (event: FocusEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('focus', {\n\t\t\t\tdetail: { value: (event.target as HTMLInputElement).value },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t);\n\t};\n\n\tprivate readonly _handleBlur = (event: FocusEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('blur', {\n\t\t\t\tdetail: { value: (event.target as HTMLInputElement).value },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t);\n\t};\n\n\tselect(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.select();\n\t}\n\n\toverride focus(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.focus();\n\t}\n\n\toverride blur(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.blur();\n\t}\n\n\toverride click(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.click();\n\t}\n\n\toverride render() {\n\t\tconst textfieldClasses = {\n\t\t\t'sds-textfield': true,\n\t\t\t'sds-textfield--error': Boolean(this.errorMessage),\n\t\t\t'sds-textfield--disabled': Boolean(this.disabled),\n\t\t\t'sds-textfield--readonly': Boolean(this.readOnly),\n\t\t\t'sds-textfield--has-icon': this.hasIcon,\n\t\t};\n\n\t\treturn html` <div class=\"${classMap(textfieldClasses)}\">\n\t\t\t${this.label\n\t\t\t\t? html`<label for=\"sds-textfield\" class=\"sds-textfield__label\">${this.label}</label>`\n\t\t\t\t: nothing}\n\t\t\t${this.helpText ? html`<p class=\"sds-textfield__help-text\">${this.helpText}</p>` : nothing}\n\t\t\t<div class=\"sds-textfield__input-container\">\n\t\t\t\t<input\n\t\t\t\t\tclass=\"sds-textfield__input\"\n\t\t\t\t\ttype=\"${this.type}\"\n\t\t\t\t\tid=\"sds-textfield\"\n\t\t\t\t\t?disabled=\"${this.disabled}\"\n\t\t\t\t\t?readonly=\"${this.readOnly}\"\n\t\t\t\t\tplaceholder=\"${ifDefined(this.placeholder)}\"\n\t\t\t\t\tvalue=\"${ifDefined(this.value)}\"\n\t\t\t\t\tname=\"${ifDefined(this.name)}\"\n\t\t\t\t\tautocomplete=\"${this.autocomplete ? 'on' : 'off'}\"\n\t\t\t\t\t@input=\"${this._handleInput}\"\n\t\t\t\t\t@change=\"${this._handleChange}\"\n\t\t\t\t\t@select=\"${this._handleSelect}\"\n\t\t\t\t\t@focus=\"${this._handleFocus}\"\n\t\t\t\t\t@blur=\"${this._handleBlur}\"\n\t\t\t\t/>\n\t\t\t\t<slot name=\"after\" @slotchange=\"${this.handleSlotChange}\" aria-hidden=\"true\"></slot>\n\t\t\t</div>\n\t\t\t${this.errorMessage\n\t\t\t\t? html`<p class=\"sds-textfield__error-message\">\n\t\t\t\t\t\t<sds-icon\n\t\t\t\t\t\t\tname=\"warning-material-filled\"\n\t\t\t\t\t\t\tsize=\"m\"\n\t\t\t\t\t\t\tcolor=\"${!this.disabled\n\t\t\t\t\t\t\t\t? `var(--sds-color-semantic-icon-critical)`\n\t\t\t\t\t\t\t\t: `var(--sds-color-semantic-icon-disabled)`}\"\n\t\t\t\t\t\t></sds-icon\n\t\t\t\t\t\t>${this.errorMessage}\n\t\t\t\t\t</p>`\n\t\t\t\t: nothing}\n\t\t</div>`;\n\t}\n}\n\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-textfield': SDSTextField;\n\t}\n}\n"]}
1
+ {"version":3,"file":"sds-textfield.js","sourceRoot":"","sources":["../../src/sds-textfield/sds-textfield.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { styles } from './sds-textfield.styles';\n\nimport '../sds-icon/sds-icon';\n\ntype InputType = 'text' | 'email' | 'tel' | 'number' | 'password' | 'search' | 'url';\n\ninterface SDSTextFieldProps {\n\ttype?: InputType;\n\tvalue?: string;\n\tname?: string;\n\tlabel?: string;\n\tplaceholder?: string;\n\t'help-text'?: string;\n\t'error-message'?: string;\n\tdisabled?: boolean;\n\treadonly?: boolean;\n\tautocomplete?: boolean;\n\tonInput?: (event: CustomEvent<{ value: string }>) => void;\n\tonChange?: (event: CustomEvent<{ value: string }>) => void;\n\tonSelect?: (event: CustomEvent<{ selectedText: string }>) => void;\n\tonFocus?: (event: CustomEvent<{ value: string }>) => void;\n\tonBlur?: (event: CustomEvent<{ value: string }>) => void;\n}\n\n@customElement('sds-textfield')\nexport class SDSTextField extends LitElement {\n\t// Styling\n\tstatic override styles = [styles];\n\n\t// Props\n\t@property({ type: String }) type: InputType = 'text';\n\t@property({ type: String }) value?: string;\n\t@property({ type: String }) name?: string;\n\t@property({ type: String }) label?: string;\n\t@property({ type: String }) placeholder?: string;\n\t@property({ type: String, attribute: 'help-text' }) helpText?: string;\n\t@property({ type: String, attribute: 'error-message' }) errorMessage?: string;\n\t@property({ type: Boolean }) disabled: boolean = false;\n\t@property({ type: Boolean, attribute: 'readonly' }) readOnly: boolean = false;\n\t@property({ type: Boolean }) autocomplete: boolean = false;\n\n\t// State\n\t@state() private hasIcon = false;\n\n\tprivate readonly handleSlotChange = (e: Event) => {\n\t\tconst slot = e.target as HTMLSlotElement;\n\t\tthis.hasIcon = slot.assignedNodes({ flatten: true }).length > 0;\n\t};\n\n\t// Event handling\n\tprivate readonly _handleInput = (event: InputEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (!this.disabled) {\n\t\t\tthis.dispatchEvent(\n\t\t\t\tnew CustomEvent('input', {\n\t\t\t\t\tdetail: { value: (event.target as HTMLInputElement).value },\n\t\t\t\t\tbubbles: true,\n\t\t\t\t\tcomposed: true,\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly _handleChange = (event: Event) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (!this.disabled) {\n\t\t\tthis.dispatchEvent(\n\t\t\t\tnew CustomEvent('change', {\n\t\t\t\t\tdetail: { value: (event.target as HTMLInputElement).value },\n\t\t\t\t\tbubbles: true,\n\t\t\t\t\tcomposed: true,\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly _handleSelect = (event: Event) => {\n\t\tevent.stopImmediatePropagation();\n\t\tif (!this.disabled) {\n\t\t\tconst target = event.target as HTMLInputElement;\n\t\t\tconst selectedText = target.value.substring(target.selectionStart ?? 0, target.selectionEnd ?? 0);\n\n\t\t\tthis.dispatchEvent(\n\t\t\t\tnew CustomEvent('select', {\n\t\t\t\t\tdetail: { selectedText },\n\t\t\t\t\tbubbles: true,\n\t\t\t\t\tcomposed: true,\n\t\t\t\t})\n\t\t\t);\n\t\t}\n\t};\n\n\tprivate readonly _handleFocus = (event: FocusEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('focus', {\n\t\t\t\tdetail: { value: (event.target as HTMLInputElement).value },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t);\n\t};\n\n\tprivate readonly _handleBlur = (event: FocusEvent) => {\n\t\tevent.stopImmediatePropagation();\n\t\tthis.dispatchEvent(\n\t\t\tnew CustomEvent('blur', {\n\t\t\t\tdetail: { value: (event.target as HTMLInputElement).value },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t})\n\t\t);\n\t};\n\n\tselect(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.select();\n\t}\n\n\toverride focus(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.focus();\n\t}\n\n\toverride blur(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.blur();\n\t}\n\n\toverride click(): void {\n\t\tif (!this.disabled) this.shadowRoot?.querySelector('input')?.click();\n\t}\n\n\toverride render() {\n\t\tconst textfieldClasses = {\n\t\t\t'sds-textfield': true,\n\t\t\t'sds-textfield--error': Boolean(this.errorMessage),\n\t\t\t'sds-textfield--disabled': Boolean(this.disabled),\n\t\t\t'sds-textfield--readonly': Boolean(this.readOnly),\n\t\t\t'sds-textfield--has-icon': this.hasIcon,\n\t\t};\n\n\t\treturn html` <div class=\"${classMap(textfieldClasses)}\">\n\t\t\t${this.label\n\t\t\t\t? html`<label for=\"sds-textfield\" class=\"sds-textfield__label\">${this.label}</label>`\n\t\t\t\t: nothing}\n\t\t\t${this.helpText ? html`<p class=\"sds-textfield__help-text\">${this.helpText}</p>` : nothing}\n\t\t\t<div class=\"sds-textfield__input-container\">\n\t\t\t\t<input\n\t\t\t\t\tclass=\"sds-textfield__input\"\n\t\t\t\t\ttype=\"${this.type}\"\n\t\t\t\t\tid=\"sds-textfield\"\n\t\t\t\t\t?disabled=\"${this.disabled}\"\n\t\t\t\t\t?readonly=\"${this.readOnly}\"\n\t\t\t\t\tplaceholder=\"${ifDefined(this.placeholder)}\"\n\t\t\t\t\tvalue=\"${ifDefined(this.value)}\"\n\t\t\t\t\tname=\"${ifDefined(this.name)}\"\n\t\t\t\t\tautocomplete=\"${this.autocomplete ? 'on' : 'off'}\"\n\t\t\t\t\t@input=\"${this._handleInput}\"\n\t\t\t\t\t@change=\"${this._handleChange}\"\n\t\t\t\t\t@select=\"${this._handleSelect}\"\n\t\t\t\t\t@focus=\"${this._handleFocus}\"\n\t\t\t\t\t@blur=\"${this._handleBlur}\"\n\t\t\t\t/>\n\t\t\t\t<slot name=\"after\" @slotchange=\"${this.handleSlotChange}\" aria-hidden=\"true\"></slot>\n\t\t\t</div>\n\t\t\t${this.errorMessage\n\t\t\t\t? html`<p class=\"sds-textfield__error-message\">\n\t\t\t\t\t\t<sds-icon\n\t\t\t\t\t\t\tname=\"warning-material-filled\"\n\t\t\t\t\t\t\tsize=\"m\"\n\t\t\t\t\t\t\tcolor=\"${!this.disabled\n\t\t\t\t\t\t\t\t? `var(--sds-color-semantic-icon-critical)`\n\t\t\t\t\t\t\t\t: `var(--sds-color-semantic-icon-disabled)`}\"\n\t\t\t\t\t\t></sds-icon\n\t\t\t\t\t\t>${this.errorMessage}\n\t\t\t\t\t</p>`\n\t\t\t\t: nothing}\n\t\t</div>`;\n\t}\n}\n\ndeclare global {\n\t// HTML\n\tinterface HTMLElementTagNameMap {\n\t\t'sds-textfield': SDSTextField;\n\t}\n\n\t// React\n\tnamespace JSX {\n\t\tinterface IntrinsicElements {\n\t\t\t'sds-textfield': SDSTextFieldProps &\n\t\t\t\tReact.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;\n\t\t}\n\t}\n}\n\n/*\n// Angular\ndeclare module '@angular/core' {\n\tinterface IntrinsicElements {\n\t\t'sds-textfield': SDSTextFieldProps;\n\t}\n}\n\n// Vue\ndeclare module 'vue' {\n\texport interface GlobalComponents {\n\t\t'sds-textfield': SDSTextFieldProps;\n\t}\n}\n\n// Svelte\ndeclare namespace svelteHTML {\n\tinterface HTMLAttributes<T> {\n\t\t'sds-textfield'?: SDSTextFieldProps;\n\t}\n} */\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@politiet/sheriff-web-components",
3
- "version": "0.6.0",
3
+ "version": "0.6.2",
4
4
  "description": "Sheriff Design System Web Components Library",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",
@@ -20,6 +20,96 @@
20
20
  "import": "./dist/react-wrappers/index.js",
21
21
  "require": "./dist/react-wrappers/index.js",
22
22
  "types": "./dist/react-wrappers/index.d.ts"
23
+ },
24
+ "./sds-button": {
25
+ "import": "./dist/sds-button/sds-button.js",
26
+ "require": "./dist/sds-button/sds-button.js",
27
+ "types": "./dist/sds-button/sds-button.d.ts"
28
+ },
29
+ "./sds-checkbox": {
30
+ "import": "./dist/sds-checkbox/sds-checkbox.js",
31
+ "require": "./dist/sds-checkbox/sds-checkbox.js",
32
+ "types": "./dist/sds-checkbox/sds-checkbox.d.ts"
33
+ },
34
+ "./sds-checkbox-group": {
35
+ "import": "./dist/sds-checkbox-group/sds-checkbox-group.js",
36
+ "require": "./dist/sds-checkbox-group/sds-checkbox-group.js",
37
+ "types": "./dist/sds-checkbox-group/sds-checkbox-group.d.ts"
38
+ },
39
+ "./sds-chip": {
40
+ "import": "./dist/sds-chip/sds-chip.js",
41
+ "require": "./dist/sds-chip/sds-chip.js",
42
+ "types": "./dist/sds-chip/sds-chip.d.ts"
43
+ },
44
+ "./sds-detail": {
45
+ "import": "./dist/sds-detail/sds-detail.js",
46
+ "require": "./dist/sds-detail/sds-detail.js",
47
+ "types": "./dist/sds-detail/sds-detail.d.ts"
48
+ },
49
+ "./sds-heading": {
50
+ "import": "./dist/sds-heading/sds-heading.js",
51
+ "require": "./dist/sds-heading/sds-heading.js",
52
+ "types": "./dist/sds-heading/sds-heading.d.ts"
53
+ },
54
+ "./sds-icon": {
55
+ "import": "./dist/sds-icon/sds-icon.js",
56
+ "require": "./dist/sds-icon/sds-icon.js",
57
+ "types": "./dist/sds-icon/sds-icon.d.ts"
58
+ },
59
+ "./sds-label": {
60
+ "import": "./dist/sds-label/sds-label.js",
61
+ "require": "./dist/sds-label/sds-label.js",
62
+ "types": "./dist/sds-label/sds-label.d.ts"
63
+ },
64
+ "./sds-link": {
65
+ "import": "./dist/sds-link/sds-link.js",
66
+ "require": "./dist/sds-link/sds-link.js",
67
+ "types": "./dist/sds-link/sds-link.d.ts"
68
+ },
69
+ "./sds-loader": {
70
+ "import": "./dist/sds-loader/sds-loader.js",
71
+ "require": "./dist/sds-loader/sds-loader.js",
72
+ "types": "./dist/sds-loader/sds-loader.d.ts"
73
+ },
74
+ "./sds-nav-card": {
75
+ "import": "./dist/sds-nav-card/sds-nav-card.js",
76
+ "require": "./dist/sds-nav-card/sds-nav-card.js",
77
+ "types": "./dist/sds-nav-card/sds-nav-card.d.ts"
78
+ },
79
+ "./sds-notification": {
80
+ "import": "./dist/sds-notification/sds-notification.js",
81
+ "require": "./dist/sds-notification/sds-notification.js",
82
+ "types": "./dist/sds-notification/sds-notification.d.ts"
83
+ },
84
+ "./sds-paragraph": {
85
+ "import": "./dist/sds-paragraph/sds-paragraph.js",
86
+ "require": "./dist/sds-paragraph/sds-paragraph.js",
87
+ "types": "./dist/sds-paragraph/sds-paragraph.d.ts"
88
+ },
89
+ "./sds-radio": {
90
+ "import": "./dist/sds-radio/sds-radio.js",
91
+ "require": "./dist/sds-radio/sds-radio.js",
92
+ "types": "./dist/sds-radio/sds-radio.d.ts"
93
+ },
94
+ "./sds-radio-group": {
95
+ "import": "./dist/sds-radio-group/sds-radio-group.js",
96
+ "require": "./dist/sds-radio-group/sds-radio-group.js",
97
+ "types": "./dist/sds-radio-group/sds-radio-group.d.ts"
98
+ },
99
+ "./sds-switch": {
100
+ "import": "./dist/sds-switch/sds-switch.js",
101
+ "require": "./dist/sds-switch/sds-switch.js",
102
+ "types": "./dist/sds-switch/sds-switch.d.ts"
103
+ },
104
+ "./sds-text": {
105
+ "import": "./dist/sds-text/sds-text.js",
106
+ "require": "./dist/sds-text/sds-text.js",
107
+ "types": "./dist/sds-text/sds-text.d.ts"
108
+ },
109
+ "./sds-textfield": {
110
+ "import": "./dist/sds-textfield/sds-textfield.js",
111
+ "require": "./dist/sds-textfield/sds-textfield.js",
112
+ "types": "./dist/sds-textfield/sds-textfield.d.ts"
23
113
  }
24
114
  },
25
115
  "scripts": {