igniteui-webcomponents 1.0.0-beta.1 → 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (156) hide show
  1. package/README.md +31 -2
  2. package/components/avatar/avatar.d.ts +2 -0
  3. package/components/avatar/avatar.d.ts.map +1 -1
  4. package/components/avatar/avatar.js +11 -7
  5. package/components/avatar/avatar.js.map +1 -1
  6. package/components/badge/badge.d.ts +1 -1
  7. package/components/badge/badge.d.ts.map +1 -1
  8. package/components/badge/badge.js +5 -27
  9. package/components/badge/badge.js.map +1 -1
  10. package/components/badge/badge.material.css.d.ts.map +1 -1
  11. package/components/badge/badge.material.css.js +1 -1
  12. package/components/badge/badge.material.css.js.map +1 -1
  13. package/components/button/button-base.d.ts +11 -15
  14. package/components/button/button-base.d.ts.map +1 -1
  15. package/components/button/button-base.js +53 -27
  16. package/components/button/button-base.js.map +1 -1
  17. package/components/button/button.d.ts +15 -2
  18. package/components/button/button.d.ts.map +1 -1
  19. package/components/button/button.js +34 -24
  20. package/components/button/button.js.map +1 -1
  21. package/components/button/button.material.css.d.ts.map +1 -1
  22. package/components/button/button.material.css.js +1 -1
  23. package/components/button/button.material.css.js.map +1 -1
  24. package/components/button/icon-button.d.ts +2 -6
  25. package/components/button/icon-button.d.ts.map +1 -1
  26. package/components/button/icon-button.js +8 -52
  27. package/components/button/icon-button.js.map +1 -1
  28. package/components/calendar/calendar.d.ts +1 -2
  29. package/components/calendar/calendar.d.ts.map +1 -1
  30. package/components/calendar/calendar.js +5 -10
  31. package/components/calendar/calendar.js.map +1 -1
  32. package/components/calendar/calendar.material.css.d.ts.map +1 -1
  33. package/components/calendar/calendar.material.css.js +1 -1
  34. package/components/calendar/calendar.material.css.js.map +1 -1
  35. package/components/calendar/common/calendar-base.d.ts +2 -0
  36. package/components/calendar/common/calendar-base.d.ts.map +1 -1
  37. package/components/calendar/common/calendar-base.js +2 -0
  38. package/components/calendar/common/calendar-base.js.map +1 -1
  39. package/components/calendar/days-view/days-view.js +1 -1
  40. package/components/calendar/days-view/days-view.js.map +1 -1
  41. package/components/calendar/days-view/days-view.material.css.d.ts.map +1 -1
  42. package/components/calendar/days-view/days-view.material.css.js +1 -1
  43. package/components/calendar/days-view/days-view.material.css.js.map +1 -1
  44. package/components/calendar/months-view/months-view.d.ts.map +1 -1
  45. package/components/calendar/months-view/months-view.js +1 -1
  46. package/components/calendar/months-view/months-view.js.map +1 -1
  47. package/components/calendar/years-view/years-view.d.ts.map +1 -1
  48. package/components/calendar/years-view/years-view.js +1 -1
  49. package/components/calendar/years-view/years-view.js.map +1 -1
  50. package/components/card/card.actions.d.ts +3 -2
  51. package/components/card/card.actions.d.ts.map +1 -1
  52. package/components/card/card.actions.js +4 -14
  53. package/components/card/card.actions.js.map +1 -1
  54. package/components/card/card.content.d.ts +3 -2
  55. package/components/card/card.content.d.ts.map +1 -1
  56. package/components/card/card.content.js +4 -14
  57. package/components/card/card.content.js.map +1 -1
  58. package/components/card/card.d.ts +1 -0
  59. package/components/card/card.d.ts.map +1 -1
  60. package/components/card/card.header.d.ts +3 -2
  61. package/components/card/card.header.d.ts.map +1 -1
  62. package/components/card/card.header.js +4 -14
  63. package/components/card/card.header.js.map +1 -1
  64. package/components/card/card.js +5 -8
  65. package/components/card/card.js.map +1 -1
  66. package/components/card/card.media.d.ts +3 -2
  67. package/components/card/card.media.d.ts.map +1 -1
  68. package/components/card/card.media.js +4 -14
  69. package/components/card/card.media.js.map +1 -1
  70. package/components/checkbox/checkbox.d.ts +1 -0
  71. package/components/checkbox/checkbox.d.ts.map +1 -1
  72. package/components/checkbox/checkbox.js +4 -7
  73. package/components/checkbox/checkbox.js.map +1 -1
  74. package/components/checkbox/switch.d.ts +1 -0
  75. package/components/checkbox/switch.d.ts.map +1 -1
  76. package/components/checkbox/switch.js +3 -7
  77. package/components/checkbox/switch.js.map +1 -1
  78. package/components/common/definitions/defineAllComponents.d.ts +2 -0
  79. package/components/common/definitions/defineAllComponents.d.ts.map +1 -0
  80. package/components/common/definitions/defineAllComponents.js +57 -0
  81. package/components/common/definitions/defineAllComponents.js.map +1 -0
  82. package/components/common/definitions/defineComponents.d.ts +2 -0
  83. package/components/common/definitions/defineComponents.d.ts.map +1 -0
  84. package/components/common/definitions/defineComponents.js +9 -0
  85. package/components/common/definitions/defineComponents.js.map +1 -0
  86. package/components/common/mixins/sizable.d.ts.map +1 -1
  87. package/components/common/mixins/sizable.js.map +1 -1
  88. package/components/form/form.d.ts +1 -0
  89. package/components/form/form.d.ts.map +1 -1
  90. package/components/form/form.js +10 -8
  91. package/components/form/form.js.map +1 -1
  92. package/components/icon/icon.d.ts +1 -0
  93. package/components/icon/icon.d.ts.map +1 -1
  94. package/components/icon/icon.js +1 -0
  95. package/components/icon/icon.js.map +1 -1
  96. package/components/input/input.d.ts +2 -0
  97. package/components/input/input.d.ts.map +1 -1
  98. package/components/input/input.js +6 -8
  99. package/components/input/input.js.map +1 -1
  100. package/components/list/list-header.d.ts +2 -0
  101. package/components/list/list-header.d.ts.map +1 -1
  102. package/components/list/list-header.js +6 -13
  103. package/components/list/list-header.js.map +1 -1
  104. package/components/list/list-item.d.ts +2 -0
  105. package/components/list/list-item.d.ts.map +1 -1
  106. package/components/list/list-item.js +6 -13
  107. package/components/list/list-item.js.map +1 -1
  108. package/components/list/list.d.ts +2 -0
  109. package/components/list/list.d.ts.map +1 -1
  110. package/components/list/list.js +6 -13
  111. package/components/list/list.js.map +1 -1
  112. package/components/nav-drawer/nav-drawer-header-item.d.ts +1 -0
  113. package/components/nav-drawer/nav-drawer-header-item.d.ts.map +1 -1
  114. package/components/nav-drawer/nav-drawer-header-item.js +3 -13
  115. package/components/nav-drawer/nav-drawer-header-item.js.map +1 -1
  116. package/components/nav-drawer/nav-drawer-item.d.ts +1 -3
  117. package/components/nav-drawer/nav-drawer-item.d.ts.map +1 -1
  118. package/components/nav-drawer/nav-drawer-item.js +5 -34
  119. package/components/nav-drawer/nav-drawer-item.js.map +1 -1
  120. package/components/nav-drawer/nav-drawer.d.ts +1 -0
  121. package/components/nav-drawer/nav-drawer.d.ts.map +1 -1
  122. package/components/nav-drawer/nav-drawer.js +4 -7
  123. package/components/nav-drawer/nav-drawer.js.map +1 -1
  124. package/components/navbar/navbar.d.ts +1 -0
  125. package/components/navbar/navbar.d.ts.map +1 -1
  126. package/components/navbar/navbar.js +3 -13
  127. package/components/navbar/navbar.js.map +1 -1
  128. package/components/navbar/navbar.material.css.d.ts.map +1 -1
  129. package/components/navbar/navbar.material.css.js +1 -1
  130. package/components/navbar/navbar.material.css.js.map +1 -1
  131. package/components/radio/radio.d.ts +1 -0
  132. package/components/radio/radio.d.ts.map +1 -1
  133. package/components/radio/radio.js +4 -7
  134. package/components/radio/radio.js.map +1 -1
  135. package/components/radio-group/radio-group.d.ts +1 -0
  136. package/components/radio-group/radio-group.d.ts.map +1 -1
  137. package/components/radio-group/radio-group.js +4 -7
  138. package/components/radio-group/radio-group.js.map +1 -1
  139. package/components/ripple/ripple.d.ts +1 -0
  140. package/components/ripple/ripple.d.ts.map +1 -1
  141. package/components/ripple/ripple.js +3 -13
  142. package/components/ripple/ripple.js.map +1 -1
  143. package/custom-elements.json +87 -167
  144. package/index.d.ts +12 -5
  145. package/index.d.ts.map +1 -1
  146. package/index.js +11 -5
  147. package/index.js.map +1 -1
  148. package/package.json +8 -2
  149. package/themes/bootstrap.css +1 -1
  150. package/themes/fluent.css +1 -1
  151. package/themes/indigo.css +1 -1
  152. package/vscode-html-custom-data.json +75 -134
  153. package/components/button/link-button.d.ts +0 -14
  154. package/components/button/link-button.d.ts.map +0 -1
  155. package/components/button/link-button.js +0 -48
  156. package/components/button/link-button.js.map +0 -1
@@ -1,3 +1,3 @@
1
1
  import { css } from 'lit';
2
- export const styles = css `:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;min-height:3.5rem;max-height:8rem;padding:1rem;background:hsla(var(--igc-primary-500), var(--igc-primary-a));color:var(--igc-primary-500-contrast);-webkit-box-shadow:var(--igc-elevation-4);box-shadow:var(--igc-elevation-4);font-family:var(--igc-font-family)}[part=base]{display:inherit;position:relative;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow:hidden;z-index:4}[part=middle]{display:-webkit-inline-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-margin-start:1rem;margin-inline-start:1rem}[part=start],[part=end]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}[name=end]::slotted(*){-webkit-margin-start:1rem;margin-inline-start:1rem}::slotted(igc-icon){cursor:pointer;color:var(--igc-primary-500-contrast)}`;
2
+ export const styles = css `:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;min-height:3.5rem;max-height:8rem;padding:0 1rem;background:hsla(var(--igc-primary-500), var(--igc-primary-a));color:var(--igc-primary-500-contrast);-webkit-box-shadow:var(--igc-elevation-4);box-shadow:var(--igc-elevation-4);font-family:var(--igc-font-family)}[part=base]{display:inherit;position:relative;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow:hidden;z-index:4}[part=middle]{display:-webkit-inline-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-align:center;-ms-flex-align:center;align-items:center}[part=start],[part=end]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}[name=start]::slotted(*){-webkit-margin-end:1rem;margin-inline-end:1rem}[name=end]::slotted(*){-webkit-margin-start:1rem;margin-inline-start:1rem}::slotted(igc-icon){cursor:pointer;color:var(--igc-primary-500-contrast)}::slotted(*){font-family:var(--igc-h5-font-family);font-weight:var(--igc-h5-font-weight);font-size:var(--igc-h5-font-size);font-style:var(--igc-h5-font-style);letter-spacing:var(--igc-h5-letter-spacing);text-transform:var(--igc-h5-text-transform);line-height:var(--igc-h5-line-height);margin-top:var(--igc-h5-margin-top);margin-bottom:var(--igc-h5-margin-bottom);line-height:normal;margin:0}`;
3
3
  //# sourceMappingURL=navbar.material.css.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"navbar.material.css.js","sourceRoot":"","sources":["../../../src/components/navbar/navbar.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,2kDAA2kD,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;min-height:3.5rem;max-height:8rem;padding:1rem;background:hsla(var(--igc-primary-500), var(--igc-primary-a));color:var(--igc-primary-500-contrast);-webkit-box-shadow:var(--igc-elevation-4);box-shadow:var(--igc-elevation-4);font-family:var(--igc-font-family)}[part=base]{display:inherit;position:relative;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow:hidden;z-index:4}[part=middle]{display:-webkit-inline-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-margin-start:1rem;margin-inline-start:1rem}[part=start],[part=end]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}[name=end]::slotted(*){-webkit-margin-start:1rem;margin-inline-start:1rem}::slotted(igc-icon){cursor:pointer;color:var(--igc-primary-500-contrast)}`;\n"]}
1
+ {"version":3,"file":"navbar.material.css.js","sourceRoot":"","sources":["../../../src/components/navbar/navbar.material.css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,y+DAAy+D,CAAC","sourcesContent":["import { css } from 'lit';\n\nexport const styles = css`:host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box}:host *,:host *::before,:host *::after{-webkit-box-sizing:border-box;box-sizing:border-box}[hidden]{display:none !important}:host{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;min-height:3.5rem;max-height:8rem;padding:0 1rem;background:hsla(var(--igc-primary-500), var(--igc-primary-a));color:var(--igc-primary-500-contrast);-webkit-box-shadow:var(--igc-elevation-4);box-shadow:var(--igc-elevation-4);font-family:var(--igc-font-family)}[part=base]{display:inherit;position:relative;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow:hidden;z-index:4}[part=middle]{display:-webkit-inline-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;-webkit-box-align:center;-ms-flex-align:center;align-items:center}[part=start],[part=end]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}[name=start]::slotted(*){-webkit-margin-end:1rem;margin-inline-end:1rem}[name=end]::slotted(*){-webkit-margin-start:1rem;margin-inline-start:1rem}::slotted(igc-icon){cursor:pointer;color:var(--igc-primary-500-contrast)}::slotted(*){font-family:var(--igc-h5-font-family);font-weight:var(--igc-h5-font-weight);font-size:var(--igc-h5-font-size);font-style:var(--igc-h5-font-style);letter-spacing:var(--igc-h5-letter-spacing);text-transform:var(--igc-h5-text-transform);line-height:var(--igc-h5-line-height);margin-top:var(--igc-h5-margin-top);margin-bottom:var(--igc-h5-margin-bottom);line-height:normal;margin:0}`;\n"]}
@@ -7,6 +7,7 @@ export interface IgcRadioEventMap {
7
7
  }
8
8
  declare const IgcRadioComponent_base: Constructor<import("../common/mixins/event-emitter.js").EventEmitterInterface<IgcRadioEventMap>> & Constructor<LitElement>;
9
9
  export default class IgcRadioComponent extends IgcRadioComponent_base {
10
+ static tagName: string;
10
11
  static styles: import("lit").CSSResult;
11
12
  private inputId;
12
13
  private labelId;
@@ -1 +1 @@
1
- {"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../../src/components/radio/radio.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAIvC,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAQ9D,MAAM,WAAW,gBAAgB;IAC/B,SAAS,EAAE,WAAW,CAAC,OAAO,CAAC,CAAC;IAChC,QAAQ,EAAE,WAAW,CAAC,IAAI,CAAC,CAAC;IAC5B,OAAO,EAAE,WAAW,CAAC,IAAI,CAAC,CAAC;CAC5B;;AAgBD,MAAM,CAAC,OAAO,OAAO,iBAAkB,SAAQ,sBAGlC;IAEX,OAAc,MAAM,0BAAU;IAE9B,OAAO,CAAC,OAAO,CAAuB;IACtC,OAAO,CAAC,OAAO,CAAiC;IAGhD,SAAS,CAAC,KAAK,EAAG,gBAAgB,CAAC;IAGnC,OAAO,CAAC,SAAS,CAAK;IAIf,IAAI,EAAG,MAAM,CAAC;IAId,KAAK,EAAG,MAAM,CAAC;IAKf,OAAO,UAAS;IAIhB,QAAQ,UAAS;IAIjB,OAAO,UAAS;IAIhB,aAAa,EAAE,QAAQ,GAAG,OAAO,CAAW;IAI5C,cAAc,EAAG,MAAM,CAAC;IAGxB,KAAK;IAML,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY;IAM5B,IAAI;IAKJ,cAAc;IAQd,iBAAiB,CAAC,OAAO,EAAE,MAAM;IAKxC,SAAS,CAAC,eAAe,CAAC,KAAK,EAAE,UAAU;IAK3C,SAAS,CAAC,WAAW;IAIrB,SAAS,CAAC,UAAU;IAIpB,SAAS,CAAC,WAAW;IAKrB,SAAS,CAAC,YAAY;IAYtB,SAAS,CAAC,WAAW;IASrB,SAAS,CAAC,MAAM;CAoCjB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,iBAAiB,CAAC;KAChC;CACF"}
1
+ {"version":3,"file":"radio.d.ts","sourceRoot":"","sources":["../../../src/components/radio/radio.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAIvC,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAQ9D,MAAM,WAAW,gBAAgB;IAC/B,SAAS,EAAE,WAAW,CAAC,OAAO,CAAC,CAAC;IAChC,QAAQ,EAAE,WAAW,CAAC,IAAI,CAAC,CAAC;IAC5B,OAAO,EAAE,WAAW,CAAC,IAAI,CAAC,CAAC;CAC5B;;AAeD,MAAM,CAAC,OAAO,OAAO,iBAAkB,SAAQ,sBAGlC;IAEX,OAAc,OAAO,SAAe;IAGpC,OAAc,MAAM,0BAAU;IAE9B,OAAO,CAAC,OAAO,CAAuB;IACtC,OAAO,CAAC,OAAO,CAAiC;IAGhD,SAAS,CAAC,KAAK,EAAG,gBAAgB,CAAC;IAGnC,OAAO,CAAC,SAAS,CAAK;IAIf,IAAI,EAAG,MAAM,CAAC;IAId,KAAK,EAAG,MAAM,CAAC;IAKf,OAAO,UAAS;IAIhB,QAAQ,UAAS;IAIjB,OAAO,UAAS;IAIhB,aAAa,EAAE,QAAQ,GAAG,OAAO,CAAW;IAI5C,cAAc,EAAG,MAAM,CAAC;IAGxB,KAAK;IAML,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY;IAM5B,IAAI;IAKJ,cAAc;IAQd,iBAAiB,CAAC,OAAO,EAAE,MAAM;IAKxC,SAAS,CAAC,eAAe,CAAC,KAAK,EAAE,UAAU;IAK3C,SAAS,CAAC,WAAW;IAIrB,SAAS,CAAC,UAAU;IAIpB,SAAS,CAAC,WAAW;IAKrB,SAAS,CAAC,YAAY;IAYtB,SAAS,CAAC,WAAW;IASrB,SAAS,CAAC,MAAM;CAoCjB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,iBAAiB,CAAC;KAChC;CACF"}
@@ -5,7 +5,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
5
5
  return c > 3 && r && Object.defineProperty(target, key, r), r;
6
6
  };
7
7
  import { html, LitElement } from 'lit';
8
- import { customElement, property, query, state } from 'lit/decorators.js';
8
+ import { property, query, state } from 'lit/decorators.js';
9
9
  import { styles } from './radio.material.css';
10
10
  import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
11
11
  import { alternateName, watch, blazorTwoWayBind } from '../common/decorators';
@@ -13,7 +13,7 @@ import { ifDefined } from 'lit/directives/if-defined.js';
13
13
  import { live } from 'lit/directives/live.js';
14
14
  import { partNameMap } from '../common/util.js';
15
15
  let nextId = 0;
16
- let IgcRadioComponent = class IgcRadioComponent extends EventEmitterMixin(LitElement) {
16
+ export default class IgcRadioComponent extends EventEmitterMixin(LitElement) {
17
17
  constructor() {
18
18
  super(...arguments);
19
19
  this.inputId = `radio-${nextId++}`;
@@ -106,7 +106,8 @@ let IgcRadioComponent = class IgcRadioComponent extends EventEmitterMixin(LitEle
106
106
  </label>
107
107
  `;
108
108
  }
109
- };
109
+ }
110
+ IgcRadioComponent.tagName = 'igc-radio';
110
111
  IgcRadioComponent.styles = styles;
111
112
  __decorate([
112
113
  query('input[type="radio"]', true)
@@ -145,8 +146,4 @@ __decorate([
145
146
  __decorate([
146
147
  watch('checked', { waitUntilFirstUpdate: true })
147
148
  ], IgcRadioComponent.prototype, "handleChange", null);
148
- IgcRadioComponent = __decorate([
149
- customElement('igc-radio')
150
- ], IgcRadioComponent);
151
- export default IgcRadioComponent;
152
149
  //# sourceMappingURL=radio.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"radio.js","sourceRoot":"","sources":["../../../src/components/radio/radio.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { styles } from './radio.material.css';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { Constructor } from '../common/mixins/constructor.js';\nimport { alternateName, watch, blazorTwoWayBind } from '../common/decorators';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { live } from 'lit/directives/live.js';\nimport { partNameMap } from '../common/util.js';\n\nlet nextId = 0;\n\nexport interface IgcRadioEventMap {\n igcChange: CustomEvent<boolean>;\n igcFocus: CustomEvent<void>;\n igcBlur: CustomEvent<void>;\n}\n\n/**\n * @element igc-radio\n *\n * @slot - The radio label.\n *\n * @fires igcChange - Emitted when the control's checked state changes.\n * @fires igcFocus - Emitted when the control gains focus.\n * @fires igcBlur - Emitted when the control loses focus.\n *\n * @csspart base - The radio control base wrapper.\n * @csspart control - The radio control.\n * @csspart label - The radio control label.\n */\n@customElement('igc-radio')\nexport default class IgcRadioComponent extends EventEmitterMixin<\n IgcRadioEventMap,\n Constructor<LitElement>\n>(LitElement) {\n /** @private */\n public static styles = styles;\n\n private inputId = `radio-${nextId++}`;\n private labelId = `radio-label-${this.inputId}`;\n\n @query('input[type=\"radio\"]', true)\n protected input!: HTMLInputElement;\n\n @state()\n private _tabIndex = 0;\n\n /** The name attribute of the control. */\n @property()\n public name!: string;\n\n /** The value attribute of the control. */\n @property()\n public value!: string;\n\n /** The checked state of the control. */\n @property({ type: Boolean })\n @blazorTwoWayBind('igcChange', 'detail')\n public checked = false;\n\n /** Disables the radio control. */\n @property({ type: Boolean, reflect: true })\n public disabled = false;\n\n /** Controls the validity of the control. */\n @property({ type: Boolean, reflect: true })\n public invalid = false;\n\n /** The label position of the radio control. */\n @property({ reflect: true, attribute: 'label-position' })\n public labelPosition: 'before' | 'after' = 'after';\n\n /** Sets the aria-labelledby attribute for the radio control. */\n @property({ reflect: true, attribute: 'aria-labelledby' })\n public ariaLabelledby!: string;\n\n /** Simulates a click on the radio control. */\n public click() {\n this.input.click();\n }\n\n /** Sets focus on the radio control. */\n @alternateName('focusComponent')\n public focus(options?: FocusOptions) {\n this.input.focus(options);\n }\n\n /** Removes focus from the radio control. */\n @alternateName('blurComponent')\n public blur() {\n this.input.blur();\n }\n\n /** Checks for validity of the control and shows the browser message if it invalid. */\n public reportValidity() {\n this.input.reportValidity();\n }\n\n /**\n * Sets a custom validation message for the control.\n * As long as `message` is not empty, the control is considered invalid.\n */\n public setCustomValidity(message: string) {\n this.input.setCustomValidity(message);\n this.invalid = !this.input.checkValidity();\n }\n\n protected handleMouseDown(event: MouseEvent) {\n event.preventDefault();\n this.input.focus();\n }\n\n protected handleClick() {\n this.checked = true;\n }\n\n protected handleBlur() {\n this.emitEvent('igcBlur');\n }\n\n protected handleFocus() {\n this.emitEvent('igcFocus');\n }\n\n @watch('checked', { waitUntilFirstUpdate: true })\n protected handleChange() {\n if (this.checked) {\n this.getSiblings().forEach((radio) => {\n radio.checked = false;\n radio._tabIndex = -1;\n });\n this.input.focus();\n this._tabIndex = 0;\n this.emitEvent('igcChange', { detail: this.checked });\n }\n }\n\n protected getSiblings() {\n const group = this.closest('igc-radio-group');\n if (!group) return [];\n\n return Array.from<IgcRadioComponent>(\n group.querySelectorAll('igc-radio')\n ).filter((radio) => radio.name === this.name && radio !== this);\n }\n\n protected render() {\n return html`\n <label\n part=\"${partNameMap({ base: true, checked: this.checked })}\"\n for=\"${this.inputId}\"\n @mousedown=\"${this.handleMouseDown}\"\n >\n <input\n id=\"${this.inputId}\"\n type=\"radio\"\n name=\"${ifDefined(this.name)}\"\n value=\"${ifDefined(this.value)}\"\n .disabled=\"${this.disabled}\"\n .checked=\"${live(this.checked)}\"\n tabindex=${this._tabIndex}\n aria-checked=\"${this.checked ? 'true' : 'false'}\"\n aria-disabled=\"${this.disabled ? 'true' : 'false'}\"\n aria-labelledby=\"${this.ariaLabelledby\n ? this.ariaLabelledby\n : this.labelId}\"\n @click=\"${this.handleClick}\"\n @blur=\"${this.handleBlur}\"\n @focus=\"${this.handleFocus}\"\n />\n <span\n part=\"${partNameMap({ control: true, checked: this.checked })}\"\n ></span>\n <span\n part=\"${partNameMap({ label: true, checked: this.checked })}\"\n id=\"${this.labelId}\"\n >\n <slot></slot>\n </span>\n </label>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-radio': IgcRadioComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"radio.js","sourceRoot":"","sources":["../../../src/components/radio/radio.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { styles } from './radio.material.css';\nimport { EventEmitterMixin } from '../common/mixins/event-emitter.js';\nimport { Constructor } from '../common/mixins/constructor.js';\nimport { alternateName, watch, blazorTwoWayBind } from '../common/decorators';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { live } from 'lit/directives/live.js';\nimport { partNameMap } from '../common/util.js';\n\nlet nextId = 0;\n\nexport interface IgcRadioEventMap {\n igcChange: CustomEvent<boolean>;\n igcFocus: CustomEvent<void>;\n igcBlur: CustomEvent<void>;\n}\n\n/**\n * @element igc-radio\n *\n * @slot - The radio label.\n *\n * @fires igcChange - Emitted when the control's checked state changes.\n * @fires igcFocus - Emitted when the control gains focus.\n * @fires igcBlur - Emitted when the control loses focus.\n *\n * @csspart base - The radio control base wrapper.\n * @csspart control - The radio control.\n * @csspart label - The radio control label.\n */\nexport default class IgcRadioComponent extends EventEmitterMixin<\n IgcRadioEventMap,\n Constructor<LitElement>\n>(LitElement) {\n /** @private */\n public static tagName = 'igc-radio';\n\n /** @private */\n public static styles = styles;\n\n private inputId = `radio-${nextId++}`;\n private labelId = `radio-label-${this.inputId}`;\n\n @query('input[type=\"radio\"]', true)\n protected input!: HTMLInputElement;\n\n @state()\n private _tabIndex = 0;\n\n /** The name attribute of the control. */\n @property()\n public name!: string;\n\n /** The value attribute of the control. */\n @property()\n public value!: string;\n\n /** The checked state of the control. */\n @property({ type: Boolean })\n @blazorTwoWayBind('igcChange', 'detail')\n public checked = false;\n\n /** Disables the radio control. */\n @property({ type: Boolean, reflect: true })\n public disabled = false;\n\n /** Controls the validity of the control. */\n @property({ type: Boolean, reflect: true })\n public invalid = false;\n\n /** The label position of the radio control. */\n @property({ reflect: true, attribute: 'label-position' })\n public labelPosition: 'before' | 'after' = 'after';\n\n /** Sets the aria-labelledby attribute for the radio control. */\n @property({ reflect: true, attribute: 'aria-labelledby' })\n public ariaLabelledby!: string;\n\n /** Simulates a click on the radio control. */\n public click() {\n this.input.click();\n }\n\n /** Sets focus on the radio control. */\n @alternateName('focusComponent')\n public focus(options?: FocusOptions) {\n this.input.focus(options);\n }\n\n /** Removes focus from the radio control. */\n @alternateName('blurComponent')\n public blur() {\n this.input.blur();\n }\n\n /** Checks for validity of the control and shows the browser message if it invalid. */\n public reportValidity() {\n this.input.reportValidity();\n }\n\n /**\n * Sets a custom validation message for the control.\n * As long as `message` is not empty, the control is considered invalid.\n */\n public setCustomValidity(message: string) {\n this.input.setCustomValidity(message);\n this.invalid = !this.input.checkValidity();\n }\n\n protected handleMouseDown(event: MouseEvent) {\n event.preventDefault();\n this.input.focus();\n }\n\n protected handleClick() {\n this.checked = true;\n }\n\n protected handleBlur() {\n this.emitEvent('igcBlur');\n }\n\n protected handleFocus() {\n this.emitEvent('igcFocus');\n }\n\n @watch('checked', { waitUntilFirstUpdate: true })\n protected handleChange() {\n if (this.checked) {\n this.getSiblings().forEach((radio) => {\n radio.checked = false;\n radio._tabIndex = -1;\n });\n this.input.focus();\n this._tabIndex = 0;\n this.emitEvent('igcChange', { detail: this.checked });\n }\n }\n\n protected getSiblings() {\n const group = this.closest('igc-radio-group');\n if (!group) return [];\n\n return Array.from<IgcRadioComponent>(\n group.querySelectorAll('igc-radio')\n ).filter((radio) => radio.name === this.name && radio !== this);\n }\n\n protected render() {\n return html`\n <label\n part=\"${partNameMap({ base: true, checked: this.checked })}\"\n for=\"${this.inputId}\"\n @mousedown=\"${this.handleMouseDown}\"\n >\n <input\n id=\"${this.inputId}\"\n type=\"radio\"\n name=\"${ifDefined(this.name)}\"\n value=\"${ifDefined(this.value)}\"\n .disabled=\"${this.disabled}\"\n .checked=\"${live(this.checked)}\"\n tabindex=${this._tabIndex}\n aria-checked=\"${this.checked ? 'true' : 'false'}\"\n aria-disabled=\"${this.disabled ? 'true' : 'false'}\"\n aria-labelledby=\"${this.ariaLabelledby\n ? this.ariaLabelledby\n : this.labelId}\"\n @click=\"${this.handleClick}\"\n @blur=\"${this.handleBlur}\"\n @focus=\"${this.handleFocus}\"\n />\n <span\n part=\"${partNameMap({ control: true, checked: this.checked })}\"\n ></span>\n <span\n part=\"${partNameMap({ label: true, checked: this.checked })}\"\n id=\"${this.labelId}\"\n >\n <slot></slot>\n </span>\n </label>\n `;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-radio': IgcRadioComponent;\n }\n}\n"]}
@@ -1,5 +1,6 @@
1
1
  import { LitElement } from 'lit';
2
2
  export default class IgcRadioGroupComponent extends LitElement {
3
+ static tagName: string;
3
4
  static styles: import("lit").CSSResult;
4
5
  private _slottedRadios;
5
6
  private get radios();
@@ -1 +1 @@
1
- {"version":3,"file":"radio-group.d.ts","sourceRoot":"","sources":["../../../src/components/radio-group/radio-group.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAMvC,MAAM,CAAC,OAAO,OAAO,sBAAuB,SAAQ,UAAU;IAE5D,OAAc,MAAM,0BAAU;IAG9B,OAAO,CAAC,cAAc,CAAiC;IAEvD,OAAO,KAAK,MAAM,GAEjB;IAED,OAAO,KAAK,KAAK,GAGhB;;IAQM,SAAS,EAAE,UAAU,GAAG,YAAY,CAAc;IAEzD,OAAO,CAAC,aAAa,CA8BnB;IAEF,SAAS,CAAC,MAAM;CAGjB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,sBAAsB,CAAC;KAC3C;CACF"}
1
+ {"version":3,"file":"radio-group.d.ts","sourceRoot":"","sources":["../../../src/components/radio-group/radio-group.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAKvC,MAAM,CAAC,OAAO,OAAO,sBAAuB,SAAQ,UAAU;IAE5D,OAAc,OAAO,SAAqB;IAG1C,OAAc,MAAM,0BAAU;IAG9B,OAAO,CAAC,cAAc,CAAiC;IAEvD,OAAO,KAAK,MAAM,GAEjB;IAED,OAAO,KAAK,KAAK,GAGhB;;IAQM,SAAS,EAAE,UAAU,GAAG,YAAY,CAAc;IAEzD,OAAO,CAAC,aAAa,CA8BnB;IAEF,SAAS,CAAC,MAAM;CAGjB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,sBAAsB,CAAC;KAC3C;CACF"}
@@ -5,9 +5,9 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
5
5
  return c > 3 && r && Object.defineProperty(target, key, r), r;
6
6
  };
7
7
  import { html, LitElement } from 'lit';
8
- import { customElement, property, queryAssignedNodes } from 'lit/decorators.js';
8
+ import { property, queryAssignedNodes } from 'lit/decorators.js';
9
9
  import { styles } from './radio-group.material.css';
10
- let IgcRadioGroupComponent = class IgcRadioGroupComponent extends LitElement {
10
+ export default class IgcRadioGroupComponent extends LitElement {
11
11
  constructor() {
12
12
  super();
13
13
  this.alignment = 'vertical';
@@ -51,7 +51,8 @@ let IgcRadioGroupComponent = class IgcRadioGroupComponent extends LitElement {
51
51
  render() {
52
52
  return html `<slot></slot>`;
53
53
  }
54
- };
54
+ }
55
+ IgcRadioGroupComponent.tagName = 'igc-radio-group';
55
56
  IgcRadioGroupComponent.styles = styles;
56
57
  __decorate([
57
58
  queryAssignedNodes(undefined, true, 'igc-radio')
@@ -59,8 +60,4 @@ __decorate([
59
60
  __decorate([
60
61
  property({ reflect: true })
61
62
  ], IgcRadioGroupComponent.prototype, "alignment", void 0);
62
- IgcRadioGroupComponent = __decorate([
63
- customElement('igc-radio-group')
64
- ], IgcRadioGroupComponent);
65
- export default IgcRadioGroupComponent;
66
63
  //# sourceMappingURL=radio-group.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"radio-group.js","sourceRoot":"","sources":["../../../src/components/radio-group/radio-group.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, LitElement } from 'lit';\nimport { customElement, property, queryAssignedNodes } from 'lit/decorators.js';\nimport { default as IgcRadioComponent } from '../radio/radio';\nimport { styles } from './radio-group.material.css';\n\n@customElement('igc-radio-group')\nexport default class IgcRadioGroupComponent extends LitElement {\n /** @private */\n public static styles = styles;\n\n @queryAssignedNodes(undefined, true, 'igc-radio')\n private _slottedRadios!: NodeListOf<IgcRadioComponent>;\n\n private get radios() {\n return Array.from(this._slottedRadios).filter((radio) => !radio.disabled);\n }\n\n private get isLTR(): boolean {\n const styles = window.getComputedStyle(this);\n return styles.getPropertyValue('direction') === 'ltr';\n }\n\n constructor() {\n super();\n this.addEventListener('keydown', this.handleKeydown);\n }\n\n @property({ reflect: true })\n public alignment: 'vertical' | 'horizontal' = 'vertical';\n\n private handleKeydown = (event: KeyboardEvent) => {\n const { key } = event;\n\n if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(key)) {\n const checked = this.radios.find((radio) => radio.checked);\n let index = this.radios.indexOf(checked!);\n\n switch (key) {\n case 'ArrowUp':\n index += -1;\n break;\n case 'ArrowLeft':\n index += this.isLTR ? -1 : 1;\n break;\n case 'ArrowRight':\n index += this.isLTR ? 1 : -1;\n break;\n default:\n index += 1;\n }\n\n if (index < 0) index = this.radios.length - 1;\n if (index > this.radios.length - 1) index = 0;\n\n this.radios.forEach((radio) => (radio.checked = false));\n this.radios[index].focus();\n this.radios[index].checked = true;\n\n event.preventDefault();\n }\n };\n\n protected render() {\n return html`<slot></slot>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-radio-group': IgcRadioGroupComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"radio-group.js","sourceRoot":"","sources":["../../../src/components/radio-group/radio-group.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAEjE,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAEpD,MAAM,CAAC,OAAO,OAAO,sBAAuB,SAAQ,UAAU;IAmB5D;QACE,KAAK,EAAE,CAAC;QAKH,cAAS,GAA8B,UAAU,CAAC;QAEjD,kBAAa,GAAG,CAAC,KAAoB,EAAE,EAAE;YAC/C,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,CAAC;YAEtB,IAAI,CAAC,SAAS,EAAE,WAAW,EAAE,WAAW,EAAE,YAAY,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE;gBACrE,MAAM,OAAO,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;gBAC3D,IAAI,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,OAAQ,CAAC,CAAC;gBAE1C,QAAQ,GAAG,EAAE;oBACX,KAAK,SAAS;wBACZ,KAAK,IAAI,CAAC,CAAC,CAAC;wBACZ,MAAM;oBACR,KAAK,WAAW;wBACd,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;wBAC7B,MAAM;oBACR,KAAK,YAAY;wBACf,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;wBAC7B,MAAM;oBACR;wBACE,KAAK,IAAI,CAAC,CAAC;iBACd;gBAED,IAAI,KAAK,GAAG,CAAC;oBAAE,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC;gBAC9C,IAAI,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC;oBAAE,KAAK,GAAG,CAAC,CAAC;gBAE9C,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,CAAC,CAAC;gBACxD,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,KAAK,EAAE,CAAC;gBAC3B,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC;gBAElC,KAAK,CAAC,cAAc,EAAE,CAAC;aACxB;QACH,CAAC,CAAC;QApCA,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IACvD,CAAC;IAZD,IAAY,MAAM;QAChB,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;IAC5E,CAAC;IAED,IAAY,KAAK;QACf,MAAM,MAAM,GAAG,MAAM,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC;QAC7C,OAAO,MAAM,CAAC,gBAAgB,CAAC,WAAW,CAAC,KAAK,KAAK,CAAC;IACxD,CAAC;IA0CS,MAAM;QACd,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;;AA3Da,8BAAO,GAAG,iBAAiB,CAAC;AAG5B,6BAAM,GAAG,MAAM,CAAC;AAG9B;IADC,kBAAkB,CAAC,SAAS,EAAE,IAAI,EAAE,WAAW,CAAC;8DACM;AAiBvD;IADC,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;yDAC6B","sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, queryAssignedNodes } from 'lit/decorators.js';\nimport { default as IgcRadioComponent } from '../radio/radio';\nimport { styles } from './radio-group.material.css';\n\nexport default class IgcRadioGroupComponent extends LitElement {\n /** @private */\n public static tagName = 'igc-radio-group';\n\n /** @private */\n public static styles = styles;\n\n @queryAssignedNodes(undefined, true, 'igc-radio')\n private _slottedRadios!: NodeListOf<IgcRadioComponent>;\n\n private get radios() {\n return Array.from(this._slottedRadios).filter((radio) => !radio.disabled);\n }\n\n private get isLTR(): boolean {\n const styles = window.getComputedStyle(this);\n return styles.getPropertyValue('direction') === 'ltr';\n }\n\n constructor() {\n super();\n this.addEventListener('keydown', this.handleKeydown);\n }\n\n @property({ reflect: true })\n public alignment: 'vertical' | 'horizontal' = 'vertical';\n\n private handleKeydown = (event: KeyboardEvent) => {\n const { key } = event;\n\n if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(key)) {\n const checked = this.radios.find((radio) => radio.checked);\n let index = this.radios.indexOf(checked!);\n\n switch (key) {\n case 'ArrowUp':\n index += -1;\n break;\n case 'ArrowLeft':\n index += this.isLTR ? -1 : 1;\n break;\n case 'ArrowRight':\n index += this.isLTR ? 1 : -1;\n break;\n default:\n index += 1;\n }\n\n if (index < 0) index = this.radios.length - 1;\n if (index > this.radios.length - 1) index = 0;\n\n this.radios.forEach((radio) => (radio.checked = false));\n this.radios[index].focus();\n this.radios[index].checked = true;\n\n event.preventDefault();\n }\n };\n\n protected render() {\n return html`<slot></slot>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-radio-group': IgcRadioGroupComponent;\n }\n}\n"]}
@@ -1,5 +1,6 @@
1
1
  import { LitElement } from 'lit';
2
2
  export default class IgcRippleComponent extends LitElement {
3
+ static tagName: string;
3
4
  static styles: import("lit").CSSResult;
4
5
  constructor();
5
6
  private handler;
@@ -1 +1 @@
1
- {"version":3,"file":"ripple.d.ts","sourceRoot":"","sources":["../../../src/components/ripple/ripple.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AAWvC,MAAM,CAAC,OAAO,OAAO,kBAAmB,SAAQ,UAAU;IAExD,OAAc,MAAM,0BAAU;;IAO9B,OAAO,CAAC,OAAO,CAiCb;IAEF,OAAO,CAAC,aAAa;IAQrB,SAAS,CAAC,MAAM;CAGjB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,YAAY,EAAE,kBAAkB,CAAC;KAClC;CACF"}
1
+ {"version":3,"file":"ripple.d.ts","sourceRoot":"","sources":["../../../src/components/ripple/ripple.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;AASvC,MAAM,CAAC,OAAO,OAAO,kBAAmB,SAAQ,UAAU;IAExD,OAAc,OAAO,SAAgB;IAGrC,OAAc,MAAM,0BAAU;;IAO9B,OAAO,CAAC,OAAO,CAiCb;IAEF,OAAO,CAAC,aAAa;IAQrB,SAAS,CAAC,MAAM;CAGjB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,YAAY,EAAE,kBAAkB,CAAC;KAClC;CACF"}
@@ -1,13 +1,6 @@
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
1
  import { html, LitElement } from 'lit';
8
- import { customElement } from 'lit/decorators.js';
9
2
  import { styles } from './ripple.material.css';
10
- let IgcRippleComponent = class IgcRippleComponent extends LitElement {
3
+ export default class IgcRippleComponent extends LitElement {
11
4
  constructor() {
12
5
  super();
13
6
  this.handler = ({ clientX, clientY }) => {
@@ -55,10 +48,7 @@ let IgcRippleComponent = class IgcRippleComponent extends LitElement {
55
48
  render() {
56
49
  return html `<div></div>`;
57
50
  }
58
- };
51
+ }
52
+ IgcRippleComponent.tagName = 'igc-ripple';
59
53
  IgcRippleComponent.styles = styles;
60
- IgcRippleComponent = __decorate([
61
- customElement('igc-ripple')
62
- ], IgcRippleComponent);
63
- export default IgcRippleComponent;
64
54
  //# sourceMappingURL=ripple.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ripple.js","sourceRoot":"","sources":["../../../src/components/ripple/ripple.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAS/C,IAAqB,kBAAkB,GAAvC,MAAqB,kBAAmB,SAAQ,UAAU;IAIxD;QACE,KAAK,EAAE,CAAC;QAIF,YAAO,GAAG,CAAC,EAAE,OAAO,EAAE,OAAO,EAAc,EAAE,EAAE;;YACrD,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;YAC/C,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;YAEnE,MAAM,MAAM,GAAiC;gBAC3C,QAAQ,EAAE,UAAU;gBACpB,OAAO,EAAE,OAAO;gBAChB,aAAa,EAAE,MAAM;gBACrB,eAAe,EAAE,QAAQ;gBACzB,SAAS,EAAE,+BAA+B;gBAC1C,UAAU,EAAE,oBAAoB;gBAChC,MAAM,EAAE,cAAc;gBACtB,MAAM,EAAE,iBAAiB;gBACzB,KAAK,EAAE,GAAG,MAAM,IAAI;gBACpB,MAAM,EAAE,GAAG,MAAM,IAAI;gBACrB,YAAY,EAAE,KAAK;gBACnB,GAAG,EAAE,GAAG,GAAG,IAAI;gBACf,IAAI,EAAE,GAAG,IAAI,IAAI;gBACjB,UAAU,EAAE,wCAAwC;aACrD,CAAC;YACF,MAAM,MAAM,GAAe;gBACzB,EAAE,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,WAAW,EAAE;gBACxC,EAAE,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,UAAU,EAAE;aACtC,CAAC;YACF,MAAM,IAAI,GAA6B;gBACrC,QAAQ,EAAE,GAAG;gBACb,IAAI,EAAE,UAAU;gBAChB,MAAM,EAAE,QAAQ;aACjB,CAAC;YAEF,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;YACrC,MAAA,IAAI,CAAC,UAAU,0CAAE,WAAW,CAAC,OAAO,CAAC,CAAC;YACtC,OAAO,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC,CAAC;QACtE,CAAC,CAAC;QApCA,IAAI,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;IACnD,CAAC;IAqCO,aAAa,CAAC,CAAS,EAAE,CAAS;QACxC,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAClE,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;QACvC,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,IAAI,GAAG,MAAM,GAAG,CAAC,CAAC,CAAC;QAChD,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,GAAG,MAAM,GAAG,CAAC,CAAC,CAAC;QAC9C,OAAO,EAAE,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;IAC5C,CAAC;IAES,MAAM;QACd,OAAO,IAAI,CAAA,aAAa,CAAC;IAC3B,CAAC;CACF,CAAA;AArDe,yBAAM,GAAG,MAAO,CAAA;AAFX,kBAAkB;IADtC,aAAa,CAAC,YAAY,CAAC;GACP,kBAAkB,CAuDtC;eAvDoB,kBAAkB","sourcesContent":["import { html, LitElement } from 'lit';\nimport { customElement } from 'lit/decorators.js';\nimport { styles } from './ripple.material.css';\n\n/**\n * A ripple can be applied to an element to represent\n * interactive surface.\n *\n * @element igc-ripple\n */\n@customElement('igc-ripple')\nexport default class IgcRippleComponent extends LitElement {\n /** @private */\n public static styles = styles;\n\n constructor() {\n super();\n this.addEventListener('mousedown', this.handler);\n }\n\n private handler = ({ clientX, clientY }: MouseEvent) => {\n const element = document.createElement('span');\n const { radius, top, left } = this.getDimensions(clientX, clientY);\n\n const styles: Partial<CSSStyleDeclaration> = {\n position: 'absolute',\n display: 'block',\n pointerEvents: 'none',\n transformOrigin: 'center',\n transform: `translate3d(0, 0, 0) scale(0)`,\n willChange: 'opacity, transform',\n margin: `0 !important`,\n border: 'none !important',\n width: `${radius}px`,\n height: `${radius}px`,\n borderRadius: '50%',\n top: `${top}px`,\n left: `${left}px`,\n background: 'var(--color, hsl(var(--igc-gray-800)))',\n };\n const frames: Keyframe[] = [\n { opacity: 0.5, transform: 'scale(.3)' },\n { opacity: 0, transform: 'scale(2)' },\n ];\n const opts: KeyframeAnimationOptions = {\n duration: 600, // --igc-ripple-duration,\n fill: 'forwards',\n easing: 'linear', // --igc-ripple-easing\n };\n\n Object.assign(element.style, styles);\n this.shadowRoot?.appendChild(element);\n element.animate(frames, opts).finished.then(() => element.remove());\n };\n\n private getDimensions(x: number, y: number) {\n const { width, height, left, top } = this.getBoundingClientRect();\n const radius = Math.max(width, height);\n const _left = Math.round(x - left - radius / 2);\n const _top = Math.round(y - top - radius / 2);\n return { radius, top: _top, left: _left };\n }\n\n protected render() {\n return html`<div></div>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-ripple': IgcRippleComponent;\n }\n}\n"]}
1
+ {"version":3,"file":"ripple.js","sourceRoot":"","sources":["../../../src/components/ripple/ripple.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAQ/C,MAAM,CAAC,OAAO,OAAO,kBAAmB,SAAQ,UAAU;IAOxD;QACE,KAAK,EAAE,CAAC;QAIF,YAAO,GAAG,CAAC,EAAE,OAAO,EAAE,OAAO,EAAc,EAAE,EAAE;;YACrD,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;YAC/C,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;YAEnE,MAAM,MAAM,GAAiC;gBAC3C,QAAQ,EAAE,UAAU;gBACpB,OAAO,EAAE,OAAO;gBAChB,aAAa,EAAE,MAAM;gBACrB,eAAe,EAAE,QAAQ;gBACzB,SAAS,EAAE,+BAA+B;gBAC1C,UAAU,EAAE,oBAAoB;gBAChC,MAAM,EAAE,cAAc;gBACtB,MAAM,EAAE,iBAAiB;gBACzB,KAAK,EAAE,GAAG,MAAM,IAAI;gBACpB,MAAM,EAAE,GAAG,MAAM,IAAI;gBACrB,YAAY,EAAE,KAAK;gBACnB,GAAG,EAAE,GAAG,GAAG,IAAI;gBACf,IAAI,EAAE,GAAG,IAAI,IAAI;gBACjB,UAAU,EAAE,wCAAwC;aACrD,CAAC;YACF,MAAM,MAAM,GAAe;gBACzB,EAAE,OAAO,EAAE,GAAG,EAAE,SAAS,EAAE,WAAW,EAAE;gBACxC,EAAE,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,UAAU,EAAE;aACtC,CAAC;YACF,MAAM,IAAI,GAA6B;gBACrC,QAAQ,EAAE,GAAG;gBACb,IAAI,EAAE,UAAU;gBAChB,MAAM,EAAE,QAAQ;aACjB,CAAC;YAEF,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;YACrC,MAAA,IAAI,CAAC,UAAU,0CAAE,WAAW,CAAC,OAAO,CAAC,CAAC;YACtC,OAAO,CAAC,OAAO,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC,CAAC;QACtE,CAAC,CAAC;QApCA,IAAI,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;IACnD,CAAC;IAqCO,aAAa,CAAC,CAAS,EAAE,CAAS;QACxC,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAClE,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;QACvC,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,IAAI,GAAG,MAAM,GAAG,CAAC,CAAC,CAAC;QAChD,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,GAAG,MAAM,GAAG,CAAC,CAAC,CAAC;QAC9C,OAAO,EAAE,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;IAC5C,CAAC;IAES,MAAM;QACd,OAAO,IAAI,CAAA,aAAa,CAAC;IAC3B,CAAC;;AAvDa,0BAAO,GAAG,YAAY,CAAC;AAGvB,yBAAM,GAAG,MAAM,CAAC","sourcesContent":["import { html, LitElement } from 'lit';\nimport { styles } from './ripple.material.css';\n\n/**\n * A ripple can be applied to an element to represent\n * interactive surface.\n *\n * @element igc-ripple\n */\nexport default class IgcRippleComponent extends LitElement {\n /** @private */\n public static tagName = 'igc-ripple';\n\n /** @private */\n public static styles = styles;\n\n constructor() {\n super();\n this.addEventListener('mousedown', this.handler);\n }\n\n private handler = ({ clientX, clientY }: MouseEvent) => {\n const element = document.createElement('span');\n const { radius, top, left } = this.getDimensions(clientX, clientY);\n\n const styles: Partial<CSSStyleDeclaration> = {\n position: 'absolute',\n display: 'block',\n pointerEvents: 'none',\n transformOrigin: 'center',\n transform: `translate3d(0, 0, 0) scale(0)`,\n willChange: 'opacity, transform',\n margin: `0 !important`,\n border: 'none !important',\n width: `${radius}px`,\n height: `${radius}px`,\n borderRadius: '50%',\n top: `${top}px`,\n left: `${left}px`,\n background: 'var(--color, hsl(var(--igc-gray-800)))',\n };\n const frames: Keyframe[] = [\n { opacity: 0.5, transform: 'scale(.3)' },\n { opacity: 0, transform: 'scale(2)' },\n ];\n const opts: KeyframeAnimationOptions = {\n duration: 600, // --igc-ripple-duration,\n fill: 'forwards',\n easing: 'linear', // --igc-ripple-easing\n };\n\n Object.assign(element.style, styles);\n this.shadowRoot?.appendChild(element);\n element.animate(frames, opts).finished.then(() => element.remove());\n };\n\n private getDimensions(x: number, y: number) {\n const { width, height, left, top } = this.getBoundingClientRect();\n const radius = Math.max(width, height);\n const _left = Math.round(x - left - radius / 2);\n const _top = Math.round(y - top - radius / 2);\n return { radius, top: _top, left: _left };\n }\n\n protected render() {\n return html`<div></div>`;\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'igc-ripple': IgcRippleComponent;\n }\n}\n"]}