carbon-components-angular 3.8.0 → 3.9.3

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 (127) hide show
  1. package/bundle/carbon-angular.umd.js +2 -2
  2. package/bundle/carbon-angular.umd.js.map +1 -1
  3. package/checkbox/checkbox.component.d.ts +4 -0
  4. package/checkbox/checkbox.component.js +6 -1
  5. package/checkbox/checkbox.component.js.map +1 -1
  6. package/checkbox/checkbox.component.metadata.json +1 -1
  7. package/checkbox/checkbox.component.ngfactory.js +2 -2
  8. package/checkbox/checkbox.component.ngfactory.js.map +1 -1
  9. package/checkbox/checkbox.component.ngsummary.json +1 -1
  10. package/checkbox/checkbox.module.ngfactory.js.map +1 -1
  11. package/combobox/combobox.component.d.ts +14 -4
  12. package/combobox/combobox.component.js +12 -9
  13. package/combobox/combobox.component.js.map +1 -1
  14. package/combobox/combobox.component.metadata.json +1 -1
  15. package/combobox/combobox.component.ngfactory.js +15 -8
  16. package/combobox/combobox.component.ngfactory.js.map +1 -1
  17. package/combobox/combobox.component.ngsummary.json +1 -1
  18. package/combobox/combobox.module.ngfactory.js.map +1 -1
  19. package/content-switcher/content-switcher.component.d.ts +1 -0
  20. package/content-switcher/content-switcher.component.js +18 -5
  21. package/content-switcher/content-switcher.component.js.map +1 -1
  22. package/content-switcher/content-switcher.component.metadata.json +1 -1
  23. package/content-switcher/content-switcher.component.ngfactory.js +2 -2
  24. package/content-switcher/content-switcher.component.ngfactory.js.map +1 -1
  25. package/content-switcher/content-switcher.component.ngsummary.json +1 -1
  26. package/content-switcher/content-switcher.module.ngfactory.js.map +1 -1
  27. package/datepicker/datepicker.component.d.ts +1 -1
  28. package/datepicker/datepicker.component.js.map +1 -1
  29. package/datepicker-input/datepicker-input.component.d.ts +2 -2
  30. package/datepicker-input/datepicker-input.component.js +1 -1
  31. package/datepicker-input/datepicker-input.component.js.map +1 -1
  32. package/datepicker-input/datepicker-input.component.metadata.json +1 -1
  33. package/datepicker-input/datepicker-input.component.ngfactory.js +14 -11
  34. package/datepicker-input/datepicker-input.component.ngfactory.js.map +1 -1
  35. package/datepicker-input/datepicker-input.module.ngfactory.js.map +1 -1
  36. package/docs/documentation/classes/CheckboxChange.html +7 -1
  37. package/docs/documentation/classes/NumberChange.html +11 -7
  38. package/docs/documentation/classes/ToggleChange.html +13 -5
  39. package/docs/documentation/components/Checkbox.html +74 -41
  40. package/docs/documentation/components/ComboBox.html +366 -184
  41. package/docs/documentation/components/ContentSwitcher.html +136 -12
  42. package/docs/documentation/components/DatePicker.html +2 -2
  43. package/docs/documentation/components/DatePickerInput.html +24 -22
  44. package/docs/documentation/components/Dropdown.html +335 -62
  45. package/docs/documentation/components/File.html +10 -6
  46. package/docs/documentation/components/FileUploader.html +26 -24
  47. package/docs/documentation/components/HeaderItem.html +2 -2
  48. package/docs/documentation/components/Label.html +3 -3
  49. package/docs/documentation/components/Number.html +57 -41
  50. package/docs/documentation/components/Select.html +55 -42
  51. package/docs/documentation/components/Slider.html +254 -142
  52. package/docs/documentation/components/TimePicker.html +103 -17
  53. package/docs/documentation/components/TimePickerSelect.html +65 -37
  54. package/docs/documentation/components/Toggle.html +168 -55
  55. package/docs/documentation/coverage.html +20 -20
  56. package/docs/documentation/js/search/search_index.js +2 -2
  57. package/docs/storybook/iframe.html +3 -3
  58. package/docs/storybook/{main.56858f6c72e70f546e4c.bundle.js → main.e71ec014aa45dc1d6679.bundle.js} +194 -104
  59. package/docs/storybook/main.e71ec014aa45dc1d6679.bundle.js.map +1 -0
  60. package/docs/storybook/{runtime~main.56858f6c72e70f546e4c.bundle.js → runtime~main.e71ec014aa45dc1d6679.bundle.js} +1 -1
  61. package/docs/storybook/{runtime~main.56858f6c72e70f546e4c.bundle.js.map → runtime~main.e71ec014aa45dc1d6679.bundle.js.map} +1 -1
  62. package/docs/storybook/{vendors~main.56858f6c72e70f546e4c.bundle.js → vendors~main.e71ec014aa45dc1d6679.bundle.js} +1 -1
  63. package/docs/storybook/{vendors~main.56858f6c72e70f546e4c.bundle.js.map → vendors~main.e71ec014aa45dc1d6679.bundle.js.map} +1 -1
  64. package/dropdown/dropdown.component.d.ts +12 -0
  65. package/dropdown/dropdown.component.js +12 -2
  66. package/dropdown/dropdown.component.js.map +1 -1
  67. package/dropdown/dropdown.component.metadata.json +1 -1
  68. package/dropdown/dropdown.component.ngfactory.js +18 -11
  69. package/dropdown/dropdown.component.ngfactory.js.map +1 -1
  70. package/dropdown/dropdown.component.ngsummary.json +1 -1
  71. package/dropdown/dropdown.module.ngfactory.js.map +1 -1
  72. package/file-uploader/file-uploader.component.js +1 -1
  73. package/file-uploader/file-uploader.component.js.map +1 -1
  74. package/file-uploader/file-uploader.component.metadata.json +1 -1
  75. package/file-uploader/file-uploader.component.ngfactory.js +1 -1
  76. package/file-uploader/file-uploader.component.ngfactory.js.map +1 -1
  77. package/file-uploader/file.component.js +1 -1
  78. package/file-uploader/file.component.js.map +1 -1
  79. package/file-uploader/file.component.metadata.json +1 -1
  80. package/file-uploader/file.component.ngfactory.js +7 -1
  81. package/file-uploader/file.component.ngfactory.js.map +1 -1
  82. package/input/label.component.d.ts +1 -1
  83. package/input/label.component.js.map +1 -1
  84. package/number-input/number.component.d.ts +3 -3
  85. package/number-input/number.component.js +1 -1
  86. package/number-input/number.component.js.map +1 -1
  87. package/number-input/number.component.metadata.json +1 -1
  88. package/number-input/number.component.ngfactory.js +25 -21
  89. package/number-input/number.component.ngfactory.js.map +1 -1
  90. package/number-input/number.module.ngfactory.js.map +1 -1
  91. package/package.json +1 -1
  92. package/select/select.component.d.ts +3 -3
  93. package/select/select.component.js +4 -8
  94. package/select/select.component.js.map +1 -1
  95. package/select/select.component.metadata.json +1 -1
  96. package/select/select.component.ngfactory.js +21 -15
  97. package/select/select.component.ngfactory.js.map +1 -1
  98. package/select/select.component.ngsummary.json +1 -1
  99. package/slider/slider.component.d.ts +4 -1
  100. package/slider/slider.component.js +7 -3
  101. package/slider/slider.component.js.map +1 -1
  102. package/slider/slider.component.metadata.json +1 -1
  103. package/slider/slider.component.ngfactory.js +10 -7
  104. package/slider/slider.component.ngfactory.js.map +1 -1
  105. package/slider/slider.component.ngsummary.json +1 -1
  106. package/timepicker/timepicker.component.d.ts +3 -2
  107. package/timepicker/timepicker.component.js +5 -2
  108. package/timepicker/timepicker.component.js.map +1 -1
  109. package/timepicker/timepicker.component.metadata.json +1 -1
  110. package/timepicker/timepicker.component.ngfactory.js +4 -1
  111. package/timepicker/timepicker.component.ngfactory.js.map +1 -1
  112. package/timepicker/timepicker.component.ngsummary.json +1 -1
  113. package/timepicker-select/timepicker-select.component.d.ts +1 -0
  114. package/timepicker-select/timepicker-select.component.js +1 -0
  115. package/timepicker-select/timepicker-select.component.js.map +1 -1
  116. package/timepicker-select/timepicker-select.component.metadata.json +1 -1
  117. package/timepicker-select/timepicker-select.component.ngsummary.json +1 -1
  118. package/toggle/toggle.component.d.ts +3 -2
  119. package/toggle/toggle.component.js +5 -2
  120. package/toggle/toggle.component.js.map +1 -1
  121. package/toggle/toggle.component.metadata.json +1 -1
  122. package/toggle/toggle.component.ngfactory.js +7 -4
  123. package/toggle/toggle.component.ngfactory.js.map +1 -1
  124. package/toggle/toggle.component.ngsummary.json +1 -1
  125. package/ui-shell/header/header-item.component.js +1 -1
  126. package/ui-shell/header/header-item.component.js.map +1 -1
  127. package/docs/storybook/main.56858f6c72e70f546e4c.bundle.js.map +0 -1
@@ -1 +1 @@
1
- {"moduleName":null,"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbolic":"class","members":{"min":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"max":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"step":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"value":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"shiftMultiplier":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"disableArrowKeys":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"valueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"hostClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":3,"members":[]},"arguments":["class.bx--slider-container"]}]}],"thumb":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]},"arguments":["thumb"]}]}],"track":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]},"arguments":["track"]}]}],"range":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]},"arguments":["range"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbol":5,"members":[]}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"getFractionComplete":[{"__symbolic":"method"}],"scaleX":[{"__symbolic":"method"}],"convertToValue":[{"__symbolic":"method"}],"convertToPx":[{"__symbolic":"method"}],"incrementValue":[{"__symbolic":"method"}],"decrementValue":[{"__symbolic":"method"}],"onChange":[{"__symbolic":"method"}],"onClick":[{"__symbolic":"method"}],"onFocus":[{"__symbolic":"method"}],"onMouseMove":[{"__symbolic":"method"}],"onMouseDown":[{"__symbolic":"method"}],"onMouseUp":[{"__symbolic":"method"}],"onKeyDown":[{"__symbolic":"method"}]},"statics":{"count":0}},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0,"members":[]},"diDeps":[{"isAttribute":false,"isHost":false,"isSelf":false,"isSkipSelf":false,"isOptional":false,"token":{"identifier":{"reference":{"__symbol":5,"members":[]}}}}],"lifecycleHooks":[1,6]},"isComponent":true,"selector":"ibm-slider","exportAs":null,"inputs":{"min":"min","max":"max","step":"step","value":"value","id":"id","shiftMultiplier":"shiftMultiplier","skeleton":"skeleton","disableArrowKeys":"disableArrowKeys","disabled":"disabled"},"outputs":{"valueChange":"valueChange"},"hostListeners":{},"hostProperties":{"class.bx--slider-container":"hostClass"},"hostAttributes":{},"providers":[{"token":{"identifier":{"reference":{"__symbol":6,"members":[]}}},"useClass":null,"useFactory":null,"useExisting":{"identifier":{"reference":{"__symbol":0,"members":[]}}},"multi":true}],"viewProviders":[],"queries":[],"guards":{},"viewQueries":[{"selectors":[{"value":"thumb"}],"first":true,"descendants":true,"propertyName":"thumb","read":null},{"selectors":[{"value":"track"}],"first":true,"descendants":true,"propertyName":"track","read":null},{"selectors":[{"value":"range"}],"first":true,"descendants":true,"propertyName":"range","read":null}],"entryComponents":[],"changeDetection":1,"template":{"ngContentSelectors":["[minLabel]","[maxLabel]","input"],"encapsulation":2},"componentViewType":{"__symbol":7,"members":[]},"rendererType":{"__symbol":8,"members":[]},"componentFactory":{"__symbol":9,"members":[]}}}],"symbols":[{"__symbol":0,"name":"Slider","filePath":"./slider.component"},{"__symbol":1,"name":"Input","filePath":"@angular/core"},{"__symbol":2,"name":"Output","filePath":"@angular/core"},{"__symbol":3,"name":"HostBinding","filePath":"@angular/core"},{"__symbol":4,"name":"ViewChild","filePath":"@angular/core"},{"__symbol":5,"name":"ElementRef","filePath":"@angular/core"},{"__symbol":6,"name":"NG_VALUE_ACCESSOR","filePath":"@angular/forms"},{"__symbol":7,"name":"View_Slider_0","filePath":"./slider.component.ngfactory"},{"__symbol":8,"name":"RenderType_Slider","filePath":"./slider.component.ngfactory"},{"__symbol":9,"name":"SliderNgFactory","filePath":"./slider.component.ngfactory"}]}
1
+ {"moduleName":null,"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbolic":"class","members":{"min":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"max":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"step":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"value":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"shiftMultiplier":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"disableArrowKeys":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]}}]}],"valueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"hostClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":3,"members":[]},"arguments":["class.bx--form-item"]}]}],"thumb":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]},"arguments":["thumb"]}]}],"track":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]},"arguments":["track"]}]}],"range":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]},"arguments":["range"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbol":5,"members":[]}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"getFractionComplete":[{"__symbolic":"method"}],"scaleX":[{"__symbolic":"method"}],"convertToValue":[{"__symbolic":"method"}],"convertToPx":[{"__symbolic":"method"}],"incrementValue":[{"__symbolic":"method"}],"decrementValue":[{"__symbolic":"method"}],"onChange":[{"__symbolic":"method"}],"onClick":[{"__symbolic":"method"}],"onFocus":[{"__symbolic":"method"}],"onMouseMove":[{"__symbolic":"method"}],"onMouseDown":[{"__symbolic":"method"}],"onMouseUp":[{"__symbolic":"method"}],"onKeyDown":[{"__symbolic":"method"}],"isTemplate":[{"__symbolic":"method"}]},"statics":{"count":0}},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0,"members":[]},"diDeps":[{"isAttribute":false,"isHost":false,"isSelf":false,"isSkipSelf":false,"isOptional":false,"token":{"identifier":{"reference":{"__symbol":5,"members":[]}}}}],"lifecycleHooks":[1,6]},"isComponent":true,"selector":"ibm-slider","exportAs":null,"inputs":{"min":"min","max":"max","step":"step","value":"value","id":"id","shiftMultiplier":"shiftMultiplier","skeleton":"skeleton","label":"label","disableArrowKeys":"disableArrowKeys","disabled":"disabled"},"outputs":{"valueChange":"valueChange"},"hostListeners":{},"hostProperties":{"class.bx--form-item":"hostClass"},"hostAttributes":{},"providers":[{"token":{"identifier":{"reference":{"__symbol":6,"members":[]}}},"useClass":null,"useFactory":null,"useExisting":{"identifier":{"reference":{"__symbol":0,"members":[]}}},"multi":true}],"viewProviders":[],"queries":[],"guards":{},"viewQueries":[{"selectors":[{"value":"thumb"}],"first":true,"descendants":true,"propertyName":"thumb","read":null},{"selectors":[{"value":"track"}],"first":true,"descendants":true,"propertyName":"track","read":null},{"selectors":[{"value":"range"}],"first":true,"descendants":true,"propertyName":"range","read":null}],"entryComponents":[],"changeDetection":1,"template":{"ngContentSelectors":["[minLabel]","[maxLabel]","input"],"encapsulation":2},"componentViewType":{"__symbol":7,"members":[]},"rendererType":{"__symbol":8,"members":[]},"componentFactory":{"__symbol":9,"members":[]}}}],"symbols":[{"__symbol":0,"name":"Slider","filePath":"./slider.component"},{"__symbol":1,"name":"Input","filePath":"@angular/core"},{"__symbol":2,"name":"Output","filePath":"@angular/core"},{"__symbol":3,"name":"HostBinding","filePath":"@angular/core"},{"__symbol":4,"name":"ViewChild","filePath":"@angular/core"},{"__symbol":5,"name":"ElementRef","filePath":"@angular/core"},{"__symbol":6,"name":"NG_VALUE_ACCESSOR","filePath":"@angular/forms"},{"__symbol":7,"name":"View_Slider_0","filePath":"./slider.component.ngfactory"},{"__symbol":8,"name":"RenderType_Slider","filePath":"./slider.component.ngfactory"},{"__symbol":9,"name":"SliderNgFactory","filePath":"./slider.component.ngfactory"}]}
@@ -18,7 +18,7 @@
18
18
  */
19
19
 
20
20
 
21
- import { EventEmitter } from "@angular/core";
21
+ import { EventEmitter, TemplateRef } from "@angular/core";
22
22
  /**
23
23
  * [See demo](../../?path=/story/time-picker--simple)
24
24
  *
@@ -33,7 +33,7 @@ export declare class TimePicker {
33
33
  */
34
34
  static timePickerCount: number;
35
35
  timePicker: boolean;
36
- label: any;
36
+ label: string | TemplateRef<any>;
37
37
  placeholder: string;
38
38
  pattern: string;
39
39
  id: string;
@@ -49,4 +49,5 @@ export declare class TimePicker {
49
49
  theme: "light" | "dark";
50
50
  valueChange: EventEmitter<string>;
51
51
  onChange(event: any): void;
52
+ isTemplate(value: any): boolean;
52
53
  }
@@ -18,7 +18,7 @@
18
18
  */
19
19
 
20
20
 
21
- import { Component, Input, Output, EventEmitter, HostBinding } from "@angular/core";
21
+ import { Component, Input, Output, EventEmitter, HostBinding, TemplateRef } from "@angular/core";
22
22
  /**
23
23
  * [See demo](../../?path=/story/time-picker--simple)
24
24
  *
@@ -47,6 +47,9 @@ var TimePicker = /** @class */ (function () {
47
47
  TimePicker.prototype.onChange = function (event) {
48
48
  this.valueChange.emit(event.target.value);
49
49
  };
50
+ TimePicker.prototype.isTemplate = function (value) {
51
+ return value instanceof TemplateRef;
52
+ };
50
53
  /**
51
54
  * Tracks the total number of selects instantiated. Used to generate unique IDs
52
55
  */
@@ -54,7 +57,7 @@ var TimePicker = /** @class */ (function () {
54
57
  TimePicker.decorators = [
55
58
  { type: Component, args: [{
56
59
  selector: "ibm-timepicker",
57
- template: "\n\t\t\t<div class=\"bx--time-picker__input\">\n\t\t\t\t<label *ngIf=\"!skeleton\" [attr.for]=\"id\" class=\"bx--label\">{{label}}</label>\n\t\t\t\t<input\n\t\t\t\t\t[ngClass]=\"{\n\t\t\t\t\t\t'bx--text-input--light': theme === 'light',\n\t\t\t\t\t\t'bx--skeleton': skeleton\n\t\t\t\t\t}\"\n\t\t\t\t\t[value]=\"value\"\n\t\t\t\t\t[placeholder]=\"placeholder\"\n\t\t\t\t\t[pattern]=\"pattern\"\n\t\t\t\t\t[attr.id]=\"id\"\n\t\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t\tmaxlength=\"5\"\n\t\t\t\t\t(change)=\"onChange($event)\"\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tclass=\"bx--time-picker__input-field bx--text-input\">\n\t\t\t</div>\n\t\t\t<ng-content></ng-content>\n\t"
60
+ template: "\n\t\t\t<div class=\"bx--time-picker__input\">\n\t\t\t\t<label *ngIf=\"!skeleton\" [for]=\"id\" class=\"bx--label\">\n\t\t\t\t\t<ng-container *ngIf=\"!isTemplate(label)\">{{label}}</ng-container>\n\t\t\t\t\t<ng-template *ngIf=\"isTemplate(label)\" [ngTemplateOutlet]=\"label\"></ng-template>\n\t\t\t\t</label>\n\t\t\t\t<input\n\t\t\t\t\t[ngClass]=\"{\n\t\t\t\t\t\t'bx--text-input--light': theme === 'light',\n\t\t\t\t\t\t'bx--skeleton': skeleton\n\t\t\t\t\t}\"\n\t\t\t\t\t[value]=\"value\"\n\t\t\t\t\t[placeholder]=\"placeholder\"\n\t\t\t\t\t[pattern]=\"pattern\"\n\t\t\t\t\t[attr.id]=\"id\"\n\t\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t\tmaxlength=\"5\"\n\t\t\t\t\t(change)=\"onChange($event)\"\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tclass=\"bx--time-picker__input-field bx--text-input\">\n\t\t\t</div>\n\t\t\t<ng-content></ng-content>\n\t"
58
61
  },] },
59
62
  ];
60
63
  TimePicker.propDecorators = {
@@ -1 +1 @@
1
- {"version":3,"file":"timepicker.component.js","sourceRoot":"","sources":["../src/timepicker/timepicker.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,SAAS,EACT,KAAK,EACL,MAAM,EACN,YAAY,EACZ,WAAW,EACX,MAAM,eAAe,CAAC;AAEvB;;;;;;;GAOG;AACH;IAAA;QA6BuC,eAAU,GAAG,IAAI,CAAC;QAG/C,gBAAW,GAAG,OAAO,CAAC;QACtB,YAAO,GAAG,2BAA2B,CAAC;QACtC,OAAE,GAAG,gBAAc,UAAU,CAAC,eAAe,EAAI,CAAC;QAClD,aAAQ,GAAG,KAAK,CAAC;QAG1B;;WAEG;QACM,aAAQ,GAAG,KAAK,CAAC;QAE1B;;WAEG;QACM,UAAK,GAAqB,MAAM,CAAC;QAEhC,gBAAW,GAAyB,IAAI,YAAY,EAAE,CAAC;IAKlE,CAAC;IAHA,6BAAQ,GAAR,UAAS,KAAK;QACb,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAC3C,CAAC;IA5BD;;OAEG;IACI,0BAAe,GAAG,CAAC,CAAC;;gBA3B3B,SAAS,SAAC;oBACV,QAAQ,EAAE,gBAAgB;oBAC1B,QAAQ,EAAE,2pBAmBT;iBACD;;;6BAOC,WAAW,SAAC,uBAAuB;wBAEnC,KAAK;8BACL,KAAK;0BACL,KAAK;qBACL,KAAK;2BACL,KAAK;wBACL,KAAK;2BAKL,KAAK;wBAKL,KAAK;8BAEL,MAAM;;IAKR,iBAAC;CAAA,AArDD,IAqDC;SA9BY,UAAU","sourcesContent":["import {\n\tComponent,\n\tInput,\n\tOutput,\n\tEventEmitter,\n\tHostBinding\n} from \"@angular/core\";\n\n/**\n * [See demo](../../?path=/story/time-picker--simple)\n *\n * <example-url>../../iframe.html?id=time-picker--simple</example-url>\n *\n * @export\n * @class TimePicker\n */\n@Component({\n\tselector: \"ibm-timepicker\",\n\ttemplate: `\n\t\t\t<div class=\"bx--time-picker__input\">\n\t\t\t\t<label *ngIf=\"!skeleton\" [attr.for]=\"id\" class=\"bx--label\">{{label}}</label>\n\t\t\t\t<input\n\t\t\t\t\t[ngClass]=\"{\n\t\t\t\t\t\t'bx--text-input--light': theme === 'light',\n\t\t\t\t\t\t'bx--skeleton': skeleton\n\t\t\t\t\t}\"\n\t\t\t\t\t[value]=\"value\"\n\t\t\t\t\t[placeholder]=\"placeholder\"\n\t\t\t\t\t[pattern]=\"pattern\"\n\t\t\t\t\t[attr.id]=\"id\"\n\t\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t\tmaxlength=\"5\"\n\t\t\t\t\t(change)=\"onChange($event)\"\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tclass=\"bx--time-picker__input-field bx--text-input\">\n\t\t\t</div>\n\t\t\t<ng-content></ng-content>\n\t`\n})\nexport class TimePicker {\n\t/**\n\t * Tracks the total number of selects instantiated. Used to generate unique IDs\n\t */\n\tstatic timePickerCount = 0;\n\n\t@HostBinding(\"class.bx--time-picker\") timePicker = true;\n\n\t@Input() label;\n\t@Input() placeholder = \"hh:mm\";\n\t@Input() pattern = \"(1[012]|[0-9]):[0-5][0-9]\";\n\t@Input() id = `timepicker-${TimePicker.timePickerCount++}`;\n\t@Input() disabled = false;\n\t@Input() value: string;\n\n\t/**\n\t * Set to true for a loading select.\n\t */\n\t@Input() skeleton = false;\n\n\t/**\n\t * `light` or `dark` select theme\n\t */\n\t@Input() theme: \"light\" | \"dark\" = \"dark\";\n\n\t@Output() valueChange: EventEmitter<string> = new EventEmitter();\n\n\tonChange(event) {\n\t\tthis.valueChange.emit(event.target.value);\n\t}\n}\n"]}
1
+ {"version":3,"file":"timepicker.component.js","sourceRoot":"","sources":["../src/timepicker/timepicker.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACN,SAAS,EACT,KAAK,EACL,MAAM,EACN,YAAY,EACZ,WAAW,EACX,WAAW,EACX,MAAM,eAAe,CAAC;AAEvB;;;;;;;GAOG;AACH;IAAA;QAgCuC,eAAU,GAAG,IAAI,CAAC;QAG/C,gBAAW,GAAG,OAAO,CAAC;QACtB,YAAO,GAAG,2BAA2B,CAAC;QACtC,OAAE,GAAG,gBAAc,UAAU,CAAC,eAAe,EAAI,CAAC;QAClD,aAAQ,GAAG,KAAK,CAAC;QAG1B;;WAEG;QACM,aAAQ,GAAG,KAAK,CAAC;QAE1B;;WAEG;QACM,UAAK,GAAqB,MAAM,CAAC;QAEhC,gBAAW,GAAyB,IAAI,YAAY,EAAE,CAAC;IASlE,CAAC;IAPA,6BAAQ,GAAR,UAAS,KAAK;QACb,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAC3C,CAAC;IAEM,+BAAU,GAAjB,UAAkB,KAAK;QACtB,OAAO,KAAK,YAAY,WAAW,CAAC;IACrC,CAAC;IAhCD;;OAEG;IACI,0BAAe,GAAG,CAAC,CAAC;;gBA9B3B,SAAS,SAAC;oBACV,QAAQ,EAAE,gBAAgB;oBAC1B,QAAQ,EAAE,s0BAsBT;iBACD;;;6BAOC,WAAW,SAAC,uBAAuB;wBAEnC,KAAK;8BACL,KAAK;0BACL,KAAK;qBACL,KAAK;2BACL,KAAK;wBACL,KAAK;2BAKL,KAAK;wBAKL,KAAK;8BAEL,MAAM;;IASR,iBAAC;CAAA,AA5DD,IA4DC;SAlCY,UAAU","sourcesContent":["import {\n\tComponent,\n\tInput,\n\tOutput,\n\tEventEmitter,\n\tHostBinding,\n\tTemplateRef\n} from \"@angular/core\";\n\n/**\n * [See demo](../../?path=/story/time-picker--simple)\n *\n * <example-url>../../iframe.html?id=time-picker--simple</example-url>\n *\n * @export\n * @class TimePicker\n */\n@Component({\n\tselector: \"ibm-timepicker\",\n\ttemplate: `\n\t\t\t<div class=\"bx--time-picker__input\">\n\t\t\t\t<label *ngIf=\"!skeleton\" [for]=\"id\" class=\"bx--label\">\n\t\t\t\t\t<ng-container *ngIf=\"!isTemplate(label)\">{{label}}</ng-container>\n\t\t\t\t\t<ng-template *ngIf=\"isTemplate(label)\" [ngTemplateOutlet]=\"label\"></ng-template>\n\t\t\t\t</label>\n\t\t\t\t<input\n\t\t\t\t\t[ngClass]=\"{\n\t\t\t\t\t\t'bx--text-input--light': theme === 'light',\n\t\t\t\t\t\t'bx--skeleton': skeleton\n\t\t\t\t\t}\"\n\t\t\t\t\t[value]=\"value\"\n\t\t\t\t\t[placeholder]=\"placeholder\"\n\t\t\t\t\t[pattern]=\"pattern\"\n\t\t\t\t\t[attr.id]=\"id\"\n\t\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t\tmaxlength=\"5\"\n\t\t\t\t\t(change)=\"onChange($event)\"\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tclass=\"bx--time-picker__input-field bx--text-input\">\n\t\t\t</div>\n\t\t\t<ng-content></ng-content>\n\t`\n})\nexport class TimePicker {\n\t/**\n\t * Tracks the total number of selects instantiated. Used to generate unique IDs\n\t */\n\tstatic timePickerCount = 0;\n\n\t@HostBinding(\"class.bx--time-picker\") timePicker = true;\n\n\t@Input() label: string | TemplateRef<any>;\n\t@Input() placeholder = \"hh:mm\";\n\t@Input() pattern = \"(1[012]|[0-9]):[0-5][0-9]\";\n\t@Input() id = `timepicker-${TimePicker.timePickerCount++}`;\n\t@Input() disabled = false;\n\t@Input() value: string;\n\n\t/**\n\t * Set to true for a loading select.\n\t */\n\t@Input() skeleton = false;\n\n\t/**\n\t * `light` or `dark` select theme\n\t */\n\t@Input() theme: \"light\" | \"dark\" = \"dark\";\n\n\t@Output() valueChange: EventEmitter<string> = new EventEmitter();\n\n\tonChange(event) {\n\t\tthis.valueChange.emit(event.target.value);\n\t}\n\n\tpublic isTemplate(value) {\n\t\treturn value instanceof TemplateRef;\n\t}\n}\n"]}
@@ -1 +1 @@
1
- [{"__symbolic":"module","version":4,"metadata":{"TimePicker":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":16,"character":1},"arguments":[{"selector":"ibm-timepicker","template":"\n\t\t\t<div class=\"bx--time-picker__input\">\n\t\t\t\t<label *ngIf=\"!skeleton\" [attr.for]=\"id\" class=\"bx--label\">{{label}}</label>\n\t\t\t\t<input\n\t\t\t\t\t[ngClass]=\"{\n\t\t\t\t\t\t'bx--text-input--light': theme === 'light',\n\t\t\t\t\t\t'bx--skeleton': skeleton\n\t\t\t\t\t}\"\n\t\t\t\t\t[value]=\"value\"\n\t\t\t\t\t[placeholder]=\"placeholder\"\n\t\t\t\t\t[pattern]=\"pattern\"\n\t\t\t\t\t[attr.id]=\"id\"\n\t\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t\tmaxlength=\"5\"\n\t\t\t\t\t(change)=\"onChange($event)\"\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tclass=\"bx--time-picker__input-field bx--text-input\">\n\t\t\t</div>\n\t\t\t<ng-content></ng-content>\n\t"}]}],"members":{"timePicker":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":45,"character":2},"arguments":["class.bx--time-picker"]}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":47,"character":2}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":48,"character":2}}]}],"pattern":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":49,"character":2}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":50,"character":2}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":51,"character":2}}]}],"value":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":52,"character":2}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":2}}]}],"theme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":62,"character":2}}]}],"valueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":64,"character":2}}]}],"onChange":[{"__symbolic":"method"}]},"statics":{"timePickerCount":0}}}}]
1
+ [{"__symbolic":"module","version":4,"metadata":{"TimePicker":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":17,"character":1},"arguments":[{"selector":"ibm-timepicker","template":"\n\t\t\t<div class=\"bx--time-picker__input\">\n\t\t\t\t<label *ngIf=\"!skeleton\" [for]=\"id\" class=\"bx--label\">\n\t\t\t\t\t<ng-container *ngIf=\"!isTemplate(label)\">{{label}}</ng-container>\n\t\t\t\t\t<ng-template *ngIf=\"isTemplate(label)\" [ngTemplateOutlet]=\"label\"></ng-template>\n\t\t\t\t</label>\n\t\t\t\t<input\n\t\t\t\t\t[ngClass]=\"{\n\t\t\t\t\t\t'bx--text-input--light': theme === 'light',\n\t\t\t\t\t\t'bx--skeleton': skeleton\n\t\t\t\t\t}\"\n\t\t\t\t\t[value]=\"value\"\n\t\t\t\t\t[placeholder]=\"placeholder\"\n\t\t\t\t\t[pattern]=\"pattern\"\n\t\t\t\t\t[attr.id]=\"id\"\n\t\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t\tmaxlength=\"5\"\n\t\t\t\t\t(change)=\"onChange($event)\"\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tclass=\"bx--time-picker__input-field bx--text-input\">\n\t\t\t</div>\n\t\t\t<ng-content></ng-content>\n\t"}]}],"members":{"timePicker":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":49,"character":2},"arguments":["class.bx--time-picker"]}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":51,"character":2}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":52,"character":2}}]}],"pattern":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":53,"character":2}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":54,"character":2}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":55,"character":2}}]}],"value":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":56,"character":2}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":61,"character":2}}]}],"theme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":66,"character":2}}]}],"valueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":68,"character":2}}]}],"onChange":[{"__symbolic":"method"}],"isTemplate":[{"__symbolic":"method"}]},"statics":{"timePickerCount":0}}}}]
@@ -30,7 +30,10 @@ import * as i2 from "./timepicker.component";
30
30
  var styles_TimePicker = [];
31
31
  var RenderType_TimePicker = i0.ɵcrt({ encapsulation: 2, styles: styles_TimePicker, data: {} });
32
32
  export { RenderType_TimePicker as RenderType_TimePicker };
33
- function View_TimePicker_1(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 1, "label", [["class", "bx--label"]], [[1, "for", 0]], null, null, null, null)), (_l()(), i0.ɵted(1, null, ["", ""]))], null, function (_ck, _v) { var _co = _v.component; var currVal_0 = _co.id; _ck(_v, 0, 0, currVal_0); var currVal_1 = _co.label; _ck(_v, 1, 0, currVal_1); }); }
33
+ function View_TimePicker_2(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 1, null, null, null, null, null, null, null)), (_l()(), i0.ɵted(1, null, ["", ""]))], null, function (_ck, _v) { var _co = _v.component; var currVal_0 = _co.label; _ck(_v, 1, 0, currVal_0); }); }
34
+ function View_TimePicker_4(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵand(0, null, null, 0))], null, null); }
35
+ function View_TimePicker_3(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵand(16777216, null, null, 1, null, View_TimePicker_4)), i0.ɵdid(1, 540672, null, 0, i1.NgTemplateOutlet, [i0.ViewContainerRef], { ngTemplateOutlet: [0, "ngTemplateOutlet"] }, null), (_l()(), i0.ɵand(0, null, null, 0))], function (_ck, _v) { var _co = _v.component; var currVal_0 = _co.label; _ck(_v, 1, 0, currVal_0); }, null); }
36
+ function View_TimePicker_1(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 4, "label", [["class", "bx--label"]], [[8, "htmlFor", 0]], null, null, null, null)), (_l()(), i0.ɵand(16777216, null, null, 1, null, View_TimePicker_2)), i0.ɵdid(2, 16384, null, 0, i1.NgIf, [i0.ViewContainerRef, i0.TemplateRef], { ngIf: [0, "ngIf"] }, null), (_l()(), i0.ɵand(16777216, null, null, 1, null, View_TimePicker_3)), i0.ɵdid(4, 16384, null, 0, i1.NgIf, [i0.ViewContainerRef, i0.TemplateRef], { ngIf: [0, "ngIf"] }, null)], function (_ck, _v) { var _co = _v.component; var currVal_1 = !_co.isTemplate(_co.label); _ck(_v, 2, 0, currVal_1); var currVal_2 = _co.isTemplate(_co.label); _ck(_v, 4, 0, currVal_2); }, function (_ck, _v) { var _co = _v.component; var currVal_0 = _co.id; _ck(_v, 0, 0, currVal_0); }); }
34
37
  export function View_TimePicker_0(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 5, "div", [["class", "bx--time-picker__input"]], null, null, null, null, null)), (_l()(), i0.ɵand(16777216, null, null, 1, null, View_TimePicker_1)), i0.ɵdid(2, 16384, null, 0, i1.NgIf, [i0.ViewContainerRef, i0.TemplateRef], { ngIf: [0, "ngIf"] }, null), (_l()(), i0.ɵeld(3, 0, null, null, 2, "input", [["class", "bx--time-picker__input-field bx--text-input"], ["maxlength", "5"], ["type", "text"]], [[8, "value", 0], [8, "placeholder", 0], [8, "pattern", 0], [1, "id", 0], [8, "disabled", 0]], [[null, "change"]], function (_v, en, $event) { var ad = true; var _co = _v.component; if (("change" === en)) {
35
38
  var pd_0 = (_co.onChange($event) !== false);
36
39
  ad = (pd_0 && ad);
@@ -1 +1 @@
1
- {"version":3,"file":"timepicker.component.ngfactory.js","sourceRoot":"","sources":["../src/timepicker/timepicker.component.ngfactory.ts","../src/timepicker/timepicker.component.ts.TimePicker.html"],"names":[],"mappings":";;;;;;;;;;;;qDCEI,+GAA2D,KAAA,gCAAS,yDAA3C,mBAAe,KAAxC,YAA2D,EAAlC,SAAe,GAAmB,kDAAS;4DADrE,+GAAoC,KACnC,0KAA2D,IAC3D,0TAaqD,YAFpD;;wBAA2B;MAX5B,iMAaqD,GAZpD,0DAGE,KAWJ,eAAY,iDAhBJ,oBAAiB,WAAxB,YAA2D,EAApD,SAAiB,GAcvB,6DAAmD,EAZnD,0DAGE,YAJH,YAaqD,EAApD,SAAmD,EAZnD,SAGE,mDACF,mBAAe,QACf,mBAA2B,cAC3B,mBAAmB,UACnB,mBAAc,KACd,mBAAqB,WATtB,YAaqD,EARpD,SAAe,EACf,SAA2B,EAC3B,SAAmB,EACnB,SAAc,EACd,SAAqB","sourcesContent":["import * as i0 from '@angular/core';\ni0.ComponentFactory;\n","\n\t\t\t<div class=\"bx--time-picker__input\">\n\t\t\t\t<label *ngIf=\"!skeleton\" [attr.for]=\"id\" class=\"bx--label\">{{label}}</label>\n\t\t\t\t<input\n\t\t\t\t\t[ngClass]=\"{\n\t\t\t\t\t\t'bx--text-input--light': theme === 'light',\n\t\t\t\t\t\t'bx--skeleton': skeleton\n\t\t\t\t\t}\"\n\t\t\t\t\t[value]=\"value\"\n\t\t\t\t\t[placeholder]=\"placeholder\"\n\t\t\t\t\t[pattern]=\"pattern\"\n\t\t\t\t\t[attr.id]=\"id\"\n\t\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t\tmaxlength=\"5\"\n\t\t\t\t\t(change)=\"onChange($event)\"\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tclass=\"bx--time-picker__input-field bx--text-input\">\n\t\t\t</div>\n\t\t\t<ng-content></ng-content>\n\t"]}
1
+ {"version":3,"file":"timepicker.component.ngfactory.js","sourceRoot":"","sources":["../src/timepicker/timepicker.component.ngfactory.ts","../src/timepicker/timepicker.component.ts.TimePicker.html"],"names":[],"mappings":";;;;;;;;;;;;qDCGK,6EAAyC,KAAA,2IAAS;;qDAClD,+LAAkE,sFAA3B,mBAA0B,QAAjE,YAAkE,EAA3B,SAA0B;qDAFlE,mHAAsD,KACrD,0KAAyC,IACzC,0KAAkE,iDADpD,mCAA0B,SAAxC,YAAyC,EAA3B,SAA0B,GAC3B,kCAAyB,SAAtC,YAAkE,EAArD,SAAyB,mDAFd,mBAAU,KAAnC,YAAsD,EAA7B,SAAU;4DADpC,+GAAoC,KACnC,0KAAsD,IAItD,0TAaqD,YAFpD;;wBAA2B;MAX5B,iMAaqD,GAZpD,0DAGE,KAWJ,eAAY,iDAnBJ,oBAAiB,WAAxB,YAAsD,EAA/C,SAAiB,GAiBvB,6DAAmD,EAZnD,0DAGE,YAJH,YAaqD,EAApD,SAAmD,EAZnD,SAGE,mDACF,mBAAe,QACf,mBAA2B,cAC3B,mBAAmB,UACnB,mBAAc,KACd,mBAAqB,WATtB,YAaqD,EARpD,SAAe,EACf,SAA2B,EAC3B,SAAmB,EACnB,SAAc,EACd,SAAqB","sourcesContent":["import * as i0 from '@angular/core';\ni0.ComponentFactory;\n","\n\t\t\t<div class=\"bx--time-picker__input\">\n\t\t\t\t<label *ngIf=\"!skeleton\" [for]=\"id\" class=\"bx--label\">\n\t\t\t\t\t<ng-container *ngIf=\"!isTemplate(label)\">{{label}}</ng-container>\n\t\t\t\t\t<ng-template *ngIf=\"isTemplate(label)\" [ngTemplateOutlet]=\"label\"></ng-template>\n\t\t\t\t</label>\n\t\t\t\t<input\n\t\t\t\t\t[ngClass]=\"{\n\t\t\t\t\t\t'bx--text-input--light': theme === 'light',\n\t\t\t\t\t\t'bx--skeleton': skeleton\n\t\t\t\t\t}\"\n\t\t\t\t\t[value]=\"value\"\n\t\t\t\t\t[placeholder]=\"placeholder\"\n\t\t\t\t\t[pattern]=\"pattern\"\n\t\t\t\t\t[attr.id]=\"id\"\n\t\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t\tmaxlength=\"5\"\n\t\t\t\t\t(change)=\"onChange($event)\"\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tclass=\"bx--time-picker__input-field bx--text-input\">\n\t\t\t</div>\n\t\t\t<ng-content></ng-content>\n\t"]}
@@ -1 +1 @@
1
- {"moduleName":null,"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbolic":"class","members":{"timePicker":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]},"arguments":["class.bx--time-picker"]}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"pattern":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"value":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"theme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"valueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":3,"members":[]}}]}],"onChange":[{"__symbolic":"method"}]},"statics":{"timePickerCount":0}},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0,"members":[]},"diDeps":[],"lifecycleHooks":[]},"isComponent":true,"selector":"ibm-timepicker","exportAs":null,"inputs":{"label":"label","placeholder":"placeholder","pattern":"pattern","id":"id","disabled":"disabled","value":"value","skeleton":"skeleton","theme":"theme"},"outputs":{"valueChange":"valueChange"},"hostListeners":{},"hostProperties":{"class.bx--time-picker":"timePicker"},"hostAttributes":{},"providers":[],"viewProviders":[],"queries":[],"guards":{},"viewQueries":[],"entryComponents":[],"changeDetection":1,"template":{"ngContentSelectors":["*"],"encapsulation":2},"componentViewType":{"__symbol":4,"members":[]},"rendererType":{"__symbol":5,"members":[]},"componentFactory":{"__symbol":6,"members":[]}}}],"symbols":[{"__symbol":0,"name":"TimePicker","filePath":"./timepicker.component"},{"__symbol":1,"name":"HostBinding","filePath":"@angular/core"},{"__symbol":2,"name":"Input","filePath":"@angular/core"},{"__symbol":3,"name":"Output","filePath":"@angular/core"},{"__symbol":4,"name":"View_TimePicker_0","filePath":"./timepicker.component.ngfactory"},{"__symbol":5,"name":"RenderType_TimePicker","filePath":"./timepicker.component.ngfactory"},{"__symbol":6,"name":"TimePickerNgFactory","filePath":"./timepicker.component.ngfactory"}]}
1
+ {"moduleName":null,"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbolic":"class","members":{"timePicker":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":1,"members":[]},"arguments":["class.bx--time-picker"]}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"placeholder":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"pattern":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"disabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"value":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"theme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]}}]}],"valueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":3,"members":[]}}]}],"onChange":[{"__symbolic":"method"}],"isTemplate":[{"__symbolic":"method"}]},"statics":{"timePickerCount":0}},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0,"members":[]},"diDeps":[],"lifecycleHooks":[]},"isComponent":true,"selector":"ibm-timepicker","exportAs":null,"inputs":{"label":"label","placeholder":"placeholder","pattern":"pattern","id":"id","disabled":"disabled","value":"value","skeleton":"skeleton","theme":"theme"},"outputs":{"valueChange":"valueChange"},"hostListeners":{},"hostProperties":{"class.bx--time-picker":"timePicker"},"hostAttributes":{},"providers":[],"viewProviders":[],"queries":[],"guards":{},"viewQueries":[],"entryComponents":[],"changeDetection":1,"template":{"ngContentSelectors":["*"],"encapsulation":2},"componentViewType":{"__symbol":4,"members":[]},"rendererType":{"__symbol":5,"members":[]},"componentFactory":{"__symbol":6,"members":[]}}}],"symbols":[{"__symbol":0,"name":"TimePicker","filePath":"./timepicker.component"},{"__symbol":1,"name":"HostBinding","filePath":"@angular/core"},{"__symbol":2,"name":"Input","filePath":"@angular/core"},{"__symbol":3,"name":"Output","filePath":"@angular/core"},{"__symbol":4,"name":"View_TimePicker_0","filePath":"./timepicker.component.ngfactory"},{"__symbol":5,"name":"RenderType_TimePicker","filePath":"./timepicker.component.ngfactory"},{"__symbol":6,"name":"TimePickerNgFactory","filePath":"./timepicker.component.ngfactory"}]}
@@ -41,6 +41,7 @@ export declare class TimePickerSelect extends Select {
41
41
  * `light` or `dark` select theme
42
42
  */
43
43
  theme: "light" | "dark";
44
+ label: string;
44
45
  timePickerSelectSkeleton: boolean;
45
46
  readonly timePickerSelectLight: boolean;
46
47
  valueChange: EventEmitter<string>;
@@ -80,6 +80,7 @@ var TimePickerSelect = /** @class */ (function (_super) {
80
80
  id: [{ type: Input }],
81
81
  skeleton: [{ type: Input }],
82
82
  theme: [{ type: Input }],
83
+ label: [{ type: Input }],
83
84
  timePickerSelectSkeleton: [{ type: HostBinding, args: ["class.bx--skeleton",] }],
84
85
  timePickerSelectLight: [{ type: HostBinding, args: ["class.bx--select--light",] }],
85
86
  valueChange: [{ type: Output }]
@@ -1 +1 @@
1
- {"version":3,"file":"timepicker-select.component.js","sourceRoot":"","sources":["../src/timepicker-select/timepicker-select.component.ts"],"names":[],"mappings":";;;;;;;;;;AAAA,OAAO,EACN,SAAS,EACT,KAAK,EACL,MAAM,EACN,YAAY,EACZ,WAAW,EACX,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAEpD;;;;;;;;GAQG;AACH;IAesC,oCAAM;IAf5C;QAAA,qEA0CC;QA1BiC,gBAAU,GAAG,IAAI,CAAC;QACL,sBAAgB,GAAG,IAAI,CAAC;QAE7D,QAAE,GAAG,uBAAqB,gBAAgB,CAAC,WAAW,EAAI,CAAC;QAEpE;;WAEG;QACM,cAAQ,GAAG,KAAK,CAAC;QAE1B;;WAEG;QACM,WAAK,GAAqB,MAAM,CAAC;QAEP,8BAAwB,GAAG,KAAI,CAAC,QAAQ,CAAC;QAMlE,iBAAW,GAAyB,IAAI,YAAY,EAAE,CAAC;;IAKlE,CAAC;IATA,sBAA4C,mDAAqB;aAAjE;YACC,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC;QAC/B,CAAC;;;OAAA;IAID,mCAAQ,GAAR,UAAS,KAAK;QACb,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAC3C,CAAC;;gBAzCD,SAAS,SAAC;oBACV,QAAQ,EAAE,uBAAuB;oBACjC,QAAQ,EAAE,0bAWT;iBACD;;;6BAEC,WAAW,SAAC,kBAAkB;mCAC9B,WAAW,SAAC,+BAA+B;qBAE3C,KAAK;2BAKL,KAAK;wBAKL,KAAK;2CAEL,WAAW,SAAC,oBAAoB;wCAEhC,WAAW,SAAC,yBAAyB;8BAIrC,MAAM;;IAKR,uBAAC;CAAA,AA1CD,CAesC,MAAM,GA2B3C;SA3BY,gBAAgB","sourcesContent":["import {\n\tComponent,\n\tInput,\n\tOutput,\n\tEventEmitter,\n\tHostBinding\n} from \"@angular/core\";\nimport { Select } from \"../select/select.component\";\n\n/**\n * [See demo](../../?path=/story/time-picker-select--simple)\n *\n * <example-url>../../iframe.html?id=time-picker-select--simple</example-url>\n *\n * @export\n * @class TimePickerSelect\n * @extends {Select}\n */\n@Component({\n\tselector: \"ibm-timepicker-select\",\n\ttemplate: `\n\t\t\t<label *ngIf=\"!skeleton\" [attr.for]=\"id\" class=\"bx--label bx--visually-hidden\">{{label}}</label>\n\t\t\t<select\n\t\t\t\t#select\n\t\t\t\t[attr.id]=\"id\"\n\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t(change)=\"onChange($event)\"\n\t\t\t\tclass=\"bx--select-input\">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</select>\n\t\t\t<ibm-icon-chevron-down16 *ngIf=\"!skeleton\" class=\"bx--select__arrow\"></ibm-icon-chevron-down16>\n\t`\n})\nexport class TimePickerSelect extends Select {\n\t@HostBinding(\"class.bx--select\") timeSelect = true;\n\t@HostBinding(\"class.bx--time-picker__select\") timePickerSelect = true;\n\n\t@Input() id = `timepicker-select-${TimePickerSelect.selectCount++}`;\n\n\t/**\n\t * Set to true for a loading select.\n\t */\n\t@Input() skeleton = false;\n\n\t/**\n\t * `light` or `dark` select theme\n\t */\n\t@Input() theme: \"light\" | \"dark\" = \"dark\";\n\n\t@HostBinding(\"class.bx--skeleton\") timePickerSelectSkeleton = this.skeleton;\n\n\t@HostBinding(\"class.bx--select--light\") get timePickerSelectLight() {\n\t\treturn this.theme === \"light\";\n\t}\n\n\t@Output() valueChange: EventEmitter<string> = new EventEmitter();\n\n\tonChange(event) {\n\t\tthis.valueChange.emit(event.target.value);\n\t}\n}\n"]}
1
+ {"version":3,"file":"timepicker-select.component.js","sourceRoot":"","sources":["../src/timepicker-select/timepicker-select.component.ts"],"names":[],"mappings":";;;;;;;;;;AAAA,OAAO,EACN,SAAS,EACT,KAAK,EACL,MAAM,EACN,YAAY,EACZ,WAAW,EAEX,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAEpD;;;;;;;;GAQG;AACH;IAesC,oCAAM;IAf5C;QAAA,qEA4CC;QA5BiC,gBAAU,GAAG,IAAI,CAAC;QACL,sBAAgB,GAAG,IAAI,CAAC;QAE7D,QAAE,GAAG,uBAAqB,gBAAgB,CAAC,WAAW,EAAI,CAAC;QAEpE;;WAEG;QACM,cAAQ,GAAG,KAAK,CAAC;QAE1B;;WAEG;QACM,WAAK,GAAqB,MAAM,CAAC;QAIP,8BAAwB,GAAG,KAAI,CAAC,QAAQ,CAAC;QAMlE,iBAAW,GAAyB,IAAI,YAAY,EAAE,CAAC;;IAKlE,CAAC;IATA,sBAA4C,mDAAqB;aAAjE;YACC,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC;QAC/B,CAAC;;;OAAA;IAID,mCAAQ,GAAR,UAAS,KAAK;QACb,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;IAC3C,CAAC;;gBA3CD,SAAS,SAAC;oBACV,QAAQ,EAAE,uBAAuB;oBACjC,QAAQ,EAAE,0bAWT;iBACD;;;6BAEC,WAAW,SAAC,kBAAkB;mCAC9B,WAAW,SAAC,+BAA+B;qBAE3C,KAAK;2BAKL,KAAK;wBAKL,KAAK;wBAEL,KAAK;2CAEL,WAAW,SAAC,oBAAoB;wCAEhC,WAAW,SAAC,yBAAyB;8BAIrC,MAAM;;IAKR,uBAAC;CAAA,AA5CD,CAesC,MAAM,GA6B3C;SA7BY,gBAAgB","sourcesContent":["import {\n\tComponent,\n\tInput,\n\tOutput,\n\tEventEmitter,\n\tHostBinding,\n\tTemplateRef\n} from \"@angular/core\";\nimport { Select } from \"../select/select.component\";\n\n/**\n * [See demo](../../?path=/story/time-picker-select--simple)\n *\n * <example-url>../../iframe.html?id=time-picker-select--simple</example-url>\n *\n * @export\n * @class TimePickerSelect\n * @extends {Select}\n */\n@Component({\n\tselector: \"ibm-timepicker-select\",\n\ttemplate: `\n\t\t\t<label *ngIf=\"!skeleton\" [attr.for]=\"id\" class=\"bx--label bx--visually-hidden\">{{label}}</label>\n\t\t\t<select\n\t\t\t\t#select\n\t\t\t\t[attr.id]=\"id\"\n\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t(change)=\"onChange($event)\"\n\t\t\t\tclass=\"bx--select-input\">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</select>\n\t\t\t<ibm-icon-chevron-down16 *ngIf=\"!skeleton\" class=\"bx--select__arrow\"></ibm-icon-chevron-down16>\n\t`\n})\nexport class TimePickerSelect extends Select {\n\t@HostBinding(\"class.bx--select\") timeSelect = true;\n\t@HostBinding(\"class.bx--time-picker__select\") timePickerSelect = true;\n\n\t@Input() id = `timepicker-select-${TimePickerSelect.selectCount++}`;\n\n\t/**\n\t * Set to true for a loading select.\n\t */\n\t@Input() skeleton = false;\n\n\t/**\n\t * `light` or `dark` select theme\n\t */\n\t@Input() theme: \"light\" | \"dark\" = \"dark\";\n\n\t@Input() label: string;\n\n\t@HostBinding(\"class.bx--skeleton\") timePickerSelectSkeleton = this.skeleton;\n\n\t@HostBinding(\"class.bx--select--light\") get timePickerSelectLight() {\n\t\treturn this.theme === \"light\";\n\t}\n\n\t@Output() valueChange: EventEmitter<string> = new EventEmitter();\n\n\tonChange(event) {\n\t\tthis.valueChange.emit(event.target.value);\n\t}\n}\n"]}
@@ -1 +1 @@
1
- [{"__symbolic":"module","version":4,"metadata":{"TimePickerSelect":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../select/select.component","name":"Select","line":33,"character":38},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":18,"character":1},"arguments":[{"selector":"ibm-timepicker-select","template":"\n\t\t\t<label *ngIf=\"!skeleton\" [attr.for]=\"id\" class=\"bx--label bx--visually-hidden\">{{label}}</label>\n\t\t\t<select\n\t\t\t\t#select\n\t\t\t\t[attr.id]=\"id\"\n\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t(change)=\"onChange($event)\"\n\t\t\t\tclass=\"bx--select-input\">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</select>\n\t\t\t<ibm-icon-chevron-down16 *ngIf=\"!skeleton\" class=\"bx--select__arrow\"></ibm-icon-chevron-down16>\n\t"}]}],"members":{"timeSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":34,"character":2},"arguments":["class.bx--select"]}]}],"timePickerSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":35,"character":2},"arguments":["class.bx--time-picker__select"]}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":2}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":2}}]}],"theme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":47,"character":2}}]}],"timePickerSelectSkeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":49,"character":2},"arguments":["class.bx--skeleton"]}]}],"timePickerSelectLight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":51,"character":2},"arguments":["class.bx--select--light"]}]}],"valueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":55,"character":2}}]}],"onChange":[{"__symbolic":"method"}]}}}}]
1
+ [{"__symbolic":"module","version":4,"metadata":{"TimePickerSelect":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../select/select.component","name":"Select","line":34,"character":38},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":19,"character":1},"arguments":[{"selector":"ibm-timepicker-select","template":"\n\t\t\t<label *ngIf=\"!skeleton\" [attr.for]=\"id\" class=\"bx--label bx--visually-hidden\">{{label}}</label>\n\t\t\t<select\n\t\t\t\t#select\n\t\t\t\t[attr.id]=\"id\"\n\t\t\t\t[disabled]=\"disabled\"\n\t\t\t\t(change)=\"onChange($event)\"\n\t\t\t\tclass=\"bx--select-input\">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</select>\n\t\t\t<ibm-icon-chevron-down16 *ngIf=\"!skeleton\" class=\"bx--select__arrow\"></ibm-icon-chevron-down16>\n\t"}]}],"members":{"timeSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":35,"character":2},"arguments":["class.bx--select"]}]}],"timePickerSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":36,"character":2},"arguments":["class.bx--time-picker__select"]}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":2}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":2}}]}],"theme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":48,"character":2}}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":50,"character":2}}]}],"timePickerSelectSkeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":52,"character":2},"arguments":["class.bx--skeleton"]}]}],"timePickerSelectLight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":54,"character":2},"arguments":["class.bx--select--light"]}]}],"valueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":58,"character":2}}]}],"onChange":[{"__symbolic":"method"}]}}}}]
@@ -1 +1 @@
1
- {"moduleName":null,"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbolic":"class","extends":{"__symbol":1,"members":[]},"members":{"timeSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]},"arguments":["class.bx--select"]}]}],"timePickerSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]},"arguments":["class.bx--time-picker__select"]}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":3,"members":[]}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":3,"members":[]}}]}],"theme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":3,"members":[]}}]}],"timePickerSelectSkeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]},"arguments":["class.bx--skeleton"]}]}],"timePickerSelectLight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]},"arguments":["class.bx--select--light"]}]}],"valueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]}}]}],"onChange":[{"__symbolic":"method"}]}},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0,"members":[]},"diDeps":[],"lifecycleHooks":[]},"isComponent":true,"selector":"ibm-timepicker-select","exportAs":null,"inputs":{"display":"display","label":"label","helperText":"helperText","invalidText":"invalidText","id":"id","disabled":"disabled","skeleton":"skeleton","invalid":"invalid","theme":"theme"},"outputs":{"selected":"selected","valueChange":"valueChange"},"hostListeners":{"blur":"blur()"},"hostProperties":{"class.bx--select":"timeSelect","class.bx--time-picker__select":"timePickerSelect","class.bx--skeleton":"timePickerSelectSkeleton","class.bx--select--light":"timePickerSelectLight"},"hostAttributes":{},"providers":[],"viewProviders":[],"queries":[],"guards":{},"viewQueries":[{"selectors":[{"value":"select"}],"first":true,"descendants":true,"propertyName":"select","read":null}],"entryComponents":[],"changeDetection":1,"template":{"ngContentSelectors":["*"],"encapsulation":2},"componentViewType":{"__symbol":5,"members":[]},"rendererType":{"__symbol":6,"members":[]},"componentFactory":{"__symbol":7,"members":[]}}}],"symbols":[{"__symbol":0,"name":"TimePickerSelect","filePath":"./timepicker-select.component"},{"__symbol":1,"name":"Select","filePath":"../select/select.component"},{"__symbol":2,"name":"HostBinding","filePath":"@angular/core"},{"__symbol":3,"name":"Input","filePath":"@angular/core"},{"__symbol":4,"name":"Output","filePath":"@angular/core"},{"__symbol":5,"name":"View_TimePickerSelect_0","filePath":"./timepicker-select.component.ngfactory"},{"__symbol":6,"name":"RenderType_TimePickerSelect","filePath":"./timepicker-select.component.ngfactory"},{"__symbol":7,"name":"TimePickerSelectNgFactory","filePath":"./timepicker-select.component.ngfactory"}]}
1
+ {"moduleName":null,"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"__symbolic":"class","extends":{"__symbol":1,"members":[]},"members":{"timeSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]},"arguments":["class.bx--select"]}]}],"timePickerSelect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]},"arguments":["class.bx--time-picker__select"]}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":3,"members":[]}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":3,"members":[]}}]}],"theme":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":3,"members":[]}}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":3,"members":[]}}]}],"timePickerSelectSkeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]},"arguments":["class.bx--skeleton"]}]}],"timePickerSelectLight":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":2,"members":[]},"arguments":["class.bx--select--light"]}]}],"valueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]}}]}],"onChange":[{"__symbolic":"method"}]}},"type":{"summaryKind":1,"type":{"reference":{"__symbol":0,"members":[]},"diDeps":[],"lifecycleHooks":[]},"isComponent":true,"selector":"ibm-timepicker-select","exportAs":null,"inputs":{"display":"display","label":"label","helperText":"helperText","invalidText":"invalidText","id":"id","disabled":"disabled","skeleton":"skeleton","invalid":"invalid","theme":"theme"},"outputs":{"selected":"selected","valueChange":"valueChange"},"hostListeners":{"blur":"blur()"},"hostProperties":{"class.bx--select":"timeSelect","class.bx--time-picker__select":"timePickerSelect","class.bx--skeleton":"timePickerSelectSkeleton","class.bx--select--light":"timePickerSelectLight"},"hostAttributes":{},"providers":[],"viewProviders":[],"queries":[],"guards":{},"viewQueries":[{"selectors":[{"value":"select"}],"first":true,"descendants":true,"propertyName":"select","read":null}],"entryComponents":[],"changeDetection":1,"template":{"ngContentSelectors":["*"],"encapsulation":2},"componentViewType":{"__symbol":5,"members":[]},"rendererType":{"__symbol":6,"members":[]},"componentFactory":{"__symbol":7,"members":[]}}}],"symbols":[{"__symbol":0,"name":"TimePickerSelect","filePath":"./timepicker-select.component"},{"__symbol":1,"name":"Select","filePath":"../select/select.component"},{"__symbol":2,"name":"HostBinding","filePath":"@angular/core"},{"__symbol":3,"name":"Input","filePath":"@angular/core"},{"__symbol":4,"name":"Output","filePath":"@angular/core"},{"__symbol":5,"name":"View_TimePickerSelect_0","filePath":"./timepicker-select.component.ngfactory"},{"__symbol":6,"name":"RenderType_TimePickerSelect","filePath":"./timepicker-select.component.ngfactory"},{"__symbol":7,"name":"TimePickerSelectNgFactory","filePath":"./timepicker-select.component.ngfactory"}]}
@@ -19,7 +19,7 @@
19
19
 
20
20
 
21
21
  import { Checkbox } from "../checkbox/checkbox.component";
22
- import { ChangeDetectorRef, EventEmitter } from "@angular/core";
22
+ import { ChangeDetectorRef, EventEmitter, TemplateRef } from "@angular/core";
23
23
  import { I18n } from "../i18n/i18n.module";
24
24
  /**
25
25
  * Defines the set of states for a toggle component.
@@ -75,7 +75,7 @@ export declare class Toggle extends Checkbox {
75
75
  * Text that is set as the label of the toggle.
76
76
  * @type {(string)}
77
77
  */
78
- label: string;
78
+ label: string | TemplateRef<any>;
79
79
  /**
80
80
  * Size of the toggle component.
81
81
  */
@@ -103,4 +103,5 @@ export declare class Toggle extends Checkbox {
103
103
  * Creates instance of `ToggleChange` used to propagate the change event.
104
104
  */
105
105
  emitChangeEvent(): void;
106
+ isTemplate(value: any): boolean;
106
107
  }
@@ -29,7 +29,7 @@ var __extends = (this && this.__extends) || (function () {
29
29
  };
30
30
  })();
31
31
  import { Checkbox } from "../checkbox/checkbox.component";
32
- import { ChangeDetectorRef, Component, Input, Output, EventEmitter } from "@angular/core";
32
+ import { ChangeDetectorRef, Component, Input, Output, EventEmitter, TemplateRef } from "@angular/core";
33
33
  import { NG_VALUE_ACCESSOR } from "@angular/forms";
34
34
  import { I18n } from "../i18n/i18n.module";
35
35
  /**
@@ -131,6 +131,9 @@ var Toggle = /** @class */ (function (_super) {
131
131
  this.propagateChange(this.checked);
132
132
  this.change.emit(event);
133
133
  };
134
+ Toggle.prototype.isTemplate = function (value) {
135
+ return value instanceof TemplateRef;
136
+ };
134
137
  /**
135
138
  * Variable used for creating unique ids for toggle components.
136
139
  */
@@ -138,7 +141,7 @@ var Toggle = /** @class */ (function (_super) {
138
141
  Toggle.decorators = [
139
142
  { type: Component, args: [{
140
143
  selector: "ibm-toggle",
141
- template: "\n\t\t<div *ngIf=\"label\" class=\"bx--label\" [id]=\"ariaLabelledby\">{{label}}</div>\n\t\t<input\n\t\t\tclass=\"bx--toggle\"\n\t\t\ttype=\"checkbox\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--toggle--small': size === 'sm',\n\t\t\t\t'bx--skeleton': skeleton\n\t\t\t}\"\n\t\t\t[id]=\"id\"\n\t\t\t[value]=\"value\"\n\t\t\t[name]=\"name\"\n\t\t\t[required]=\"required\"\n\t\t\t[checked]=\"checked\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\t[attr.aria-labelledby]=\"ariaLabelledby\"\n\t\t\t[attr.aria-checked]=\"checked\"\n\t\t\t(change)=\"onChange($event)\"\n\t\t\t(click)=\"onClick($event)\">\n\t\t<label\n\t\t\tclass=\"bx--toggle__label\"\n\t\t\t[for]=\"id\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--skeleton': skeleton\n\t\t\t}\">\n\t\t\t<span class=\"bx--toggle__text--left\">{{(!skeleton ? offText : null) | async }}</span>\n\t\t\t<span class=\"bx--toggle__appearance\">\n\t\t\t\t<svg *ngIf=\"size === 'sm'\" class=\"bx--toggle__check\" width=\"6px\" height=\"5px\" viewBox=\"0 0 6 5\">\n\t\t\t\t\t<path d=\"M2.2 2.7L5 0 6 1 2.2 5 0 2.7 1 1.5z\"/>\n\t\t\t\t</svg>\n\t\t\t</span>\n\t\t\t<span class=\"bx--toggle__text--right\">{{(!skeleton ? onText : null) | async}}</span>\n\t\t</label>\n\t",
144
+ template: "\n\t\t<label *ngIf=\"label\" [id]=\"ariaLabelledby\" class=\"bx--label\">\n\t\t\t<ng-container *ngIf=\"!isTemplate(label)\">{{label}}</ng-container>\n\t\t\t<ng-template *ngIf=\"isTemplate(label)\" [ngTemplateOutlet]=\"label\"></ng-template>\n\t\t</label>\n\t\t<input\n\t\t\tclass=\"bx--toggle\"\n\t\t\ttype=\"checkbox\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--toggle--small': size === 'sm',\n\t\t\t\t'bx--skeleton': skeleton\n\t\t\t}\"\n\t\t\t[id]=\"id\"\n\t\t\t[value]=\"value\"\n\t\t\t[name]=\"name\"\n\t\t\t[required]=\"required\"\n\t\t\t[checked]=\"checked\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\t[attr.aria-labelledby]=\"ariaLabelledby\"\n\t\t\t[attr.aria-checked]=\"checked\"\n\t\t\t(change)=\"onChange($event)\"\n\t\t\t(click)=\"onClick($event)\">\n\t\t<label\n\t\t\tclass=\"bx--toggle__label\"\n\t\t\t[for]=\"id\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--skeleton': skeleton\n\t\t\t}\">\n\t\t\t<span class=\"bx--toggle__text--left\">{{(!skeleton ? offText : null) | async }}</span>\n\t\t\t<span class=\"bx--toggle__appearance\">\n\t\t\t\t<svg *ngIf=\"size === 'sm'\" class=\"bx--toggle__check\" width=\"6px\" height=\"5px\" viewBox=\"0 0 6 5\">\n\t\t\t\t\t<path d=\"M2.2 2.7L5 0 6 1 2.2 5 0 2.7 1 1.5z\"/>\n\t\t\t\t</svg>\n\t\t\t</span>\n\t\t\t<span class=\"bx--toggle__text--right\">{{(!skeleton ? onText : null) | async}}</span>\n\t\t</label>\n\t",
142
145
  providers: [
143
146
  {
144
147
  provide: NG_VALUE_ACCESSOR,
@@ -1 +1 @@
1
- {"version":3,"file":"toggle.component.js","sourceRoot":"","sources":["../src/toggle/toggle.component.ts"],"names":[],"mappings":";;;;;;;;;;AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAC1D,OAAO,EACN,iBAAiB,EACjB,SAAS,EACT,KAAK,EACL,MAAM,EACN,YAAY,EACZ,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAEnD,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAE3C;;GAEG;AACH,MAAM,CAAN,IAAY,WAKX;AALD,WAAY,WAAW;IACtB,6CAAI,CAAA;IACJ,+DAAa,CAAA;IACb,mDAAO,CAAA;IACP,uDAAS,CAAA;AACV,CAAC,EALW,WAAW,KAAX,WAAW,QAKtB;AAED;;GAEG;AACH;IAAA;IASA,CAAC;IAAD,mBAAC;AAAD,CAAC,AATD,IASC;;AAED;;;;;;;;;;;;GAYG;AACH;IA4C4B,0BAAQ;IAwDnC;;OAEG;IACH,gBAAsB,iBAAoC,EAAY,IAAU;QAAhF,YACC,kBAAM,iBAAiB,CAAC,SAExB;QAHqB,uBAAiB,GAAjB,iBAAiB,CAAmB;QAAY,UAAI,GAAJ,IAAI,CAAM;QAzBhF;;WAEG;QACM,UAAI,GAAgB,IAAI,CAAC;QAClC;;WAEG;QACM,cAAQ,GAAG,KAAK,CAAC;QAE1B;;WAEG;QACH,QAAE,GAAG,SAAS,GAAG,MAAM,CAAC,WAAW,CAAC;QAEpC;;;WAGG;QACO,YAAM,GAAG,IAAI,YAAY,EAAgB,CAAC;QAE1C,cAAQ,GAAG,KAAI,CAAC,IAAI,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC;QACvC,aAAO,GAAG,KAAI,CAAC,IAAI,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;QAM9C,MAAM,CAAC,WAAW,EAAE,CAAC;;IACtB,CAAC;IArDD,sBACI,2BAAO;aAIX;YACC,OAAO,IAAI,CAAC,QAAQ,CAAC;QACtB,CAAC;QAVD;;WAEG;aACH,UACY,KAAa;YACxB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC3B,CAAC;;;OAAA;IASD,sBACI,0BAAM;aAIV;YACC,OAAO,IAAI,CAAC,OAAO,CAAC;QACrB,CAAC;QAVD;;WAEG;aACH,UACW,KAAa;YACvB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC1B,CAAC;;;OAAA;IAwCD;;OAEG;IACH,gCAAe,GAAf;QACC,IAAI,KAAK,GAAG,IAAI,YAAY,EAAE,CAAC;QAC/B,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC;QACpB,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC;QAE7B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACnC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACzB,CAAC;IAzED;;OAEG;IACI,kBAAW,GAAG,CAAC,CAAC;;gBAhDvB,SAAS,SAAC;oBACV,QAAQ,EAAE,YAAY;oBACtB,QAAQ,EAAE,2pCAiCT;oBACD,SAAS,EAAE;wBACV;4BACC,OAAO,EAAE,iBAAiB;4BAC1B,WAAW,EAAE,MAAM;4BACnB,KAAK,EAAE,IAAI;yBACX;qBACD;iBACD;;;;gBA1FA,iBAAiB;gBAQT,IAAI;;;0BA4FX,KAAK;yBAYL,KAAK;wBAYL,KAAK;uBAIL,KAAK;2BAIL,KAAK;yBAWL,MAAM;;IAuBR,aAAC;CAAA,AAvHD,CA4C4B,QAAQ,GA2EnC;SA3EY,MAAM","sourcesContent":["import { Checkbox } from \"../checkbox/checkbox.component\";\nimport {\n\tChangeDetectorRef,\n\tComponent,\n\tInput,\n\tOutput,\n\tEventEmitter\n} from \"@angular/core\";\nimport { NG_VALUE_ACCESSOR } from \"@angular/forms\";\n\nimport { I18n } from \"../i18n/i18n.module\";\n\n/**\n * Defines the set of states for a toggle component.\n */\nexport enum ToggleState {\n\tInit,\n\tIndeterminate,\n\tChecked,\n\tUnchecked\n}\n\n/**\n * Used to emit changes performed on toggle components.\n */\nexport class ToggleChange {\n\t/**\n\t * Contains the `Toggle` that has been changed.\n\t */\n\tsource: Toggle;\n\t/**\n\t * The state of the `Toggle` encompassed in the `ToggleChange` class.\n\t */\n\tchecked: boolean;\n}\n\n/**\n * [See demo](../../?path=/story/toggle--basic)\n *\n * ```html\n * <ibm-toggle [(ngModel)]=\"toggleState\">Toggle</ibm-toggle>\n * ```\n *\n * <example-url>../../iframe.html?id=toggle--basic</example-url>\n *\n * @export\n * @class Toggle\n * @extends {Checkbox}\n */\n@Component({\n\tselector: \"ibm-toggle\",\n\ttemplate: `\n\t\t<div *ngIf=\"label\" class=\"bx--label\" [id]=\"ariaLabelledby\">{{label}}</div>\n\t\t<input\n\t\t\tclass=\"bx--toggle\"\n\t\t\ttype=\"checkbox\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--toggle--small': size === 'sm',\n\t\t\t\t'bx--skeleton': skeleton\n\t\t\t}\"\n\t\t\t[id]=\"id\"\n\t\t\t[value]=\"value\"\n\t\t\t[name]=\"name\"\n\t\t\t[required]=\"required\"\n\t\t\t[checked]=\"checked\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\t[attr.aria-labelledby]=\"ariaLabelledby\"\n\t\t\t[attr.aria-checked]=\"checked\"\n\t\t\t(change)=\"onChange($event)\"\n\t\t\t(click)=\"onClick($event)\">\n\t\t<label\n\t\t\tclass=\"bx--toggle__label\"\n\t\t\t[for]=\"id\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--skeleton': skeleton\n\t\t\t}\">\n\t\t\t<span class=\"bx--toggle__text--left\">{{(!skeleton ? offText : null) | async }}</span>\n\t\t\t<span class=\"bx--toggle__appearance\">\n\t\t\t\t<svg *ngIf=\"size === 'sm'\" class=\"bx--toggle__check\" width=\"6px\" height=\"5px\" viewBox=\"0 0 6 5\">\n\t\t\t\t\t<path d=\"M2.2 2.7L5 0 6 1 2.2 5 0 2.7 1 1.5z\"/>\n\t\t\t\t</svg>\n\t\t\t</span>\n\t\t\t<span class=\"bx--toggle__text--right\">{{(!skeleton ? onText : null) | async}}</span>\n\t\t</label>\n\t`,\n\tproviders: [\n\t\t{\n\t\t\tprovide: NG_VALUE_ACCESSOR,\n\t\t\tuseExisting: Toggle,\n\t\t\tmulti: true\n\t\t}\n\t]\n})\nexport class Toggle extends Checkbox {\n\t/**\n\t * Variable used for creating unique ids for toggle components.\n\t */\n\tstatic toggleCount = 0;\n\n\t/**\n\t * Text that is set on the left side of the toggle.\n\t */\n\t@Input()\n\tset offText(value: string) {\n\t\tthis._offText.next(value);\n\t}\n\n\tget offText() {\n\t\treturn this._offText;\n\t}\n\n\t/**\n\t * Text that is set on the right side of the toggle.\n\t */\n\t@Input()\n\tset onText(value: string) {\n\t\tthis._onText.next(value);\n\t}\n\n\tget onText() {\n\t\treturn this._onText;\n\t}\n\t/**\n\t * Text that is set as the label of the toggle.\n\t * @type {(string)}\n\t */\n\t@Input() label: string;\n\t/**\n\t * Size of the toggle component.\n\t */\n\t@Input() size: \"sm\" | \"md\" = \"md\";\n\t/**\n\t * Set to `true` for a loading toggle.\n\t */\n\t@Input() skeleton = false;\n\n\t/**\n\t * The unique id allocated to the `Toggle`.\n\t */\n\tid = \"toggle-\" + Toggle.toggleCount;\n\n\t/**\n\t * Emits event notifying other classes when a change in state occurs on a toggle after a\n\t * click.\n\t */\n\t@Output() change = new EventEmitter<ToggleChange>();\n\n\tprotected _offText = this.i18n.get(\"TOGGLE.OFF\");\n\tprotected _onText = this.i18n.get(\"TOGGLE.ON\");\n\t/**\n\t * Creates an instance of Toggle.\n\t */\n\tconstructor(protected changeDetectorRef: ChangeDetectorRef, protected i18n: I18n) {\n\t\tsuper(changeDetectorRef);\n\t\tToggle.toggleCount++;\n\t}\n\n\t/**\n\t * Creates instance of `ToggleChange` used to propagate the change event.\n\t */\n\temitChangeEvent() {\n\t\tlet event = new ToggleChange();\n\t\tevent.source = this;\n\t\tevent.checked = this.checked;\n\n\t\tthis.propagateChange(this.checked);\n\t\tthis.change.emit(event);\n\t}\n}\n"]}
1
+ {"version":3,"file":"toggle.component.js","sourceRoot":"","sources":["../src/toggle/toggle.component.ts"],"names":[],"mappings":";;;;;;;;;;AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,gCAAgC,CAAC;AAC1D,OAAO,EACN,iBAAiB,EACjB,SAAS,EACT,KAAK,EACL,MAAM,EACN,YAAY,EACZ,WAAW,EACX,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAEnD,OAAO,EAAE,IAAI,EAAE,MAAM,qBAAqB,CAAC;AAE3C;;GAEG;AACH,MAAM,CAAN,IAAY,WAKX;AALD,WAAY,WAAW;IACtB,6CAAI,CAAA;IACJ,+DAAa,CAAA;IACb,mDAAO,CAAA;IACP,uDAAS,CAAA;AACV,CAAC,EALW,WAAW,KAAX,WAAW,QAKtB;AAED;;GAEG;AACH;IAAA;IASA,CAAC;IAAD,mBAAC;AAAD,CAAC,AATD,IASC;;AAED;;;;;;;;;;;;GAYG;AACH;IA+C4B,0BAAQ;IAwDnC;;OAEG;IACH,gBAAsB,iBAAoC,EAAY,IAAU;QAAhF,YACC,kBAAM,iBAAiB,CAAC,SAExB;QAHqB,uBAAiB,GAAjB,iBAAiB,CAAmB;QAAY,UAAI,GAAJ,IAAI,CAAM;QAzBhF;;WAEG;QACM,UAAI,GAAgB,IAAI,CAAC;QAClC;;WAEG;QACM,cAAQ,GAAG,KAAK,CAAC;QAE1B;;WAEG;QACH,QAAE,GAAG,SAAS,GAAG,MAAM,CAAC,WAAW,CAAC;QAEpC;;;WAGG;QACO,YAAM,GAAG,IAAI,YAAY,EAAgB,CAAC;QAE1C,cAAQ,GAAG,KAAI,CAAC,IAAI,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC;QACvC,aAAO,GAAG,KAAI,CAAC,IAAI,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;QAM9C,MAAM,CAAC,WAAW,EAAE,CAAC;;IACtB,CAAC;IArDD,sBACI,2BAAO;aAIX;YACC,OAAO,IAAI,CAAC,QAAQ,CAAC;QACtB,CAAC;QAVD;;WAEG;aACH,UACY,KAAa;YACxB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC3B,CAAC;;;OAAA;IASD,sBACI,0BAAM;aAIV;YACC,OAAO,IAAI,CAAC,OAAO,CAAC;QACrB,CAAC;QAVD;;WAEG;aACH,UACW,KAAa;YACvB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC1B,CAAC;;;OAAA;IAwCD;;OAEG;IACH,gCAAe,GAAf;QACC,IAAI,KAAK,GAAG,IAAI,YAAY,EAAE,CAAC;QAC/B,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC;QACpB,KAAK,CAAC,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC;QAE7B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACnC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACzB,CAAC;IAEM,2BAAU,GAAjB,UAAkB,KAAK;QACtB,OAAO,KAAK,YAAY,WAAW,CAAC;IACrC,CAAC;IA7ED;;OAEG;IACI,kBAAW,GAAG,CAAC,CAAC;;gBAnDvB,SAAS,SAAC;oBACV,QAAQ,EAAE,YAAY;oBACtB,QAAQ,EAAE,m0CAoCT;oBACD,SAAS,EAAE;wBACV;4BACC,OAAO,EAAE,iBAAiB;4BAC1B,WAAW,EAAE,MAAM;4BACnB,KAAK,EAAE,IAAI;yBACX;qBACD;iBACD;;;;gBA9FA,iBAAiB;gBAST,IAAI;;;0BA+FX,KAAK;yBAYL,KAAK;wBAYL,KAAK;uBAIL,KAAK;2BAIL,KAAK;yBAWL,MAAM;;IA2BR,aAAC;CAAA,AA9HD,CA+C4B,QAAQ,GA+EnC;SA/EY,MAAM","sourcesContent":["import { Checkbox } from \"../checkbox/checkbox.component\";\nimport {\n\tChangeDetectorRef,\n\tComponent,\n\tInput,\n\tOutput,\n\tEventEmitter,\n\tTemplateRef\n} from \"@angular/core\";\nimport { NG_VALUE_ACCESSOR } from \"@angular/forms\";\n\nimport { I18n } from \"../i18n/i18n.module\";\n\n/**\n * Defines the set of states for a toggle component.\n */\nexport enum ToggleState {\n\tInit,\n\tIndeterminate,\n\tChecked,\n\tUnchecked\n}\n\n/**\n * Used to emit changes performed on toggle components.\n */\nexport class ToggleChange {\n\t/**\n\t * Contains the `Toggle` that has been changed.\n\t */\n\tsource: Toggle;\n\t/**\n\t * The state of the `Toggle` encompassed in the `ToggleChange` class.\n\t */\n\tchecked: boolean;\n}\n\n/**\n * [See demo](../../?path=/story/toggle--basic)\n *\n * ```html\n * <ibm-toggle [(ngModel)]=\"toggleState\">Toggle</ibm-toggle>\n * ```\n *\n * <example-url>../../iframe.html?id=toggle--basic</example-url>\n *\n * @export\n * @class Toggle\n * @extends {Checkbox}\n */\n@Component({\n\tselector: \"ibm-toggle\",\n\ttemplate: `\n\t\t<label *ngIf=\"label\" [id]=\"ariaLabelledby\" class=\"bx--label\">\n\t\t\t<ng-container *ngIf=\"!isTemplate(label)\">{{label}}</ng-container>\n\t\t\t<ng-template *ngIf=\"isTemplate(label)\" [ngTemplateOutlet]=\"label\"></ng-template>\n\t\t</label>\n\t\t<input\n\t\t\tclass=\"bx--toggle\"\n\t\t\ttype=\"checkbox\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--toggle--small': size === 'sm',\n\t\t\t\t'bx--skeleton': skeleton\n\t\t\t}\"\n\t\t\t[id]=\"id\"\n\t\t\t[value]=\"value\"\n\t\t\t[name]=\"name\"\n\t\t\t[required]=\"required\"\n\t\t\t[checked]=\"checked\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\t[attr.aria-labelledby]=\"ariaLabelledby\"\n\t\t\t[attr.aria-checked]=\"checked\"\n\t\t\t(change)=\"onChange($event)\"\n\t\t\t(click)=\"onClick($event)\">\n\t\t<label\n\t\t\tclass=\"bx--toggle__label\"\n\t\t\t[for]=\"id\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--skeleton': skeleton\n\t\t\t}\">\n\t\t\t<span class=\"bx--toggle__text--left\">{{(!skeleton ? offText : null) | async }}</span>\n\t\t\t<span class=\"bx--toggle__appearance\">\n\t\t\t\t<svg *ngIf=\"size === 'sm'\" class=\"bx--toggle__check\" width=\"6px\" height=\"5px\" viewBox=\"0 0 6 5\">\n\t\t\t\t\t<path d=\"M2.2 2.7L5 0 6 1 2.2 5 0 2.7 1 1.5z\"/>\n\t\t\t\t</svg>\n\t\t\t</span>\n\t\t\t<span class=\"bx--toggle__text--right\">{{(!skeleton ? onText : null) | async}}</span>\n\t\t</label>\n\t`,\n\tproviders: [\n\t\t{\n\t\t\tprovide: NG_VALUE_ACCESSOR,\n\t\t\tuseExisting: Toggle,\n\t\t\tmulti: true\n\t\t}\n\t]\n})\nexport class Toggle extends Checkbox {\n\t/**\n\t * Variable used for creating unique ids for toggle components.\n\t */\n\tstatic toggleCount = 0;\n\n\t/**\n\t * Text that is set on the left side of the toggle.\n\t */\n\t@Input()\n\tset offText(value: string) {\n\t\tthis._offText.next(value);\n\t}\n\n\tget offText() {\n\t\treturn this._offText;\n\t}\n\n\t/**\n\t * Text that is set on the right side of the toggle.\n\t */\n\t@Input()\n\tset onText(value: string) {\n\t\tthis._onText.next(value);\n\t}\n\n\tget onText() {\n\t\treturn this._onText;\n\t}\n\t/**\n\t * Text that is set as the label of the toggle.\n\t * @type {(string)}\n\t */\n\t@Input() label: string | TemplateRef<any>;\n\t/**\n\t * Size of the toggle component.\n\t */\n\t@Input() size: \"sm\" | \"md\" = \"md\";\n\t/**\n\t * Set to `true` for a loading toggle.\n\t */\n\t@Input() skeleton = false;\n\n\t/**\n\t * The unique id allocated to the `Toggle`.\n\t */\n\tid = \"toggle-\" + Toggle.toggleCount;\n\n\t/**\n\t * Emits event notifying other classes when a change in state occurs on a toggle after a\n\t * click.\n\t */\n\t@Output() change = new EventEmitter<ToggleChange>();\n\n\tprotected _offText = this.i18n.get(\"TOGGLE.OFF\");\n\tprotected _onText = this.i18n.get(\"TOGGLE.ON\");\n\t/**\n\t * Creates an instance of Toggle.\n\t */\n\tconstructor(protected changeDetectorRef: ChangeDetectorRef, protected i18n: I18n) {\n\t\tsuper(changeDetectorRef);\n\t\tToggle.toggleCount++;\n\t}\n\n\t/**\n\t * Creates instance of `ToggleChange` used to propagate the change event.\n\t */\n\temitChangeEvent() {\n\t\tlet event = new ToggleChange();\n\t\tevent.source = this;\n\t\tevent.checked = this.checked;\n\n\t\tthis.propagateChange(this.checked);\n\t\tthis.change.emit(event);\n\t}\n\n\tpublic isTemplate(value) {\n\t\treturn value instanceof TemplateRef;\n\t}\n}\n"]}
@@ -1 +1 @@
1
- [{"__symbolic":"module","version":4,"metadata":{"ToggleState":{"Init":0,"Indeterminate":1,"Checked":2,"Unchecked":3},"ToggleChange":{"__symbolic":"class"},"Toggle":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../checkbox/checkbox.component","name":"Checkbox","line":93,"character":28},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":49,"character":1},"arguments":[{"selector":"ibm-toggle","template":"\n\t\t<div *ngIf=\"label\" class=\"bx--label\" [id]=\"ariaLabelledby\">{{label}}</div>\n\t\t<input\n\t\t\tclass=\"bx--toggle\"\n\t\t\ttype=\"checkbox\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--toggle--small': size === 'sm',\n\t\t\t\t'bx--skeleton': skeleton\n\t\t\t}\"\n\t\t\t[id]=\"id\"\n\t\t\t[value]=\"value\"\n\t\t\t[name]=\"name\"\n\t\t\t[required]=\"required\"\n\t\t\t[checked]=\"checked\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\t[attr.aria-labelledby]=\"ariaLabelledby\"\n\t\t\t[attr.aria-checked]=\"checked\"\n\t\t\t(change)=\"onChange($event)\"\n\t\t\t(click)=\"onClick($event)\">\n\t\t<label\n\t\t\tclass=\"bx--toggle__label\"\n\t\t\t[for]=\"id\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--skeleton': skeleton\n\t\t\t}\">\n\t\t\t<span class=\"bx--toggle__text--left\">{{(!skeleton ? offText : null) | async }}</span>\n\t\t\t<span class=\"bx--toggle__appearance\">\n\t\t\t\t<svg *ngIf=\"size === 'sm'\" class=\"bx--toggle__check\" width=\"6px\" height=\"5px\" viewBox=\"0 0 6 5\">\n\t\t\t\t\t<path d=\"M2.2 2.7L5 0 6 1 2.2 5 0 2.7 1 1.5z\"/>\n\t\t\t\t</svg>\n\t\t\t</span>\n\t\t\t<span class=\"bx--toggle__text--right\">{{(!skeleton ? onText : null) | async}}</span>\n\t\t</label>\n\t","providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":87,"character":12},"useExisting":{"__symbolic":"reference","name":"Toggle"},"multi":true}]}]}],"members":{"offText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":102,"character":2}}]}],"onText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":114,"character":2}}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":126,"character":2}}]}],"size":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":130,"character":2}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":134,"character":2}}]}],"change":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":145,"character":2}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":152,"character":42},{"__symbolic":"reference","module":"../i18n/i18n.module","name":"I18n","line":152,"character":77}]}],"emitChangeEvent":[{"__symbolic":"method"}]},"statics":{"toggleCount":0}}}}]
1
+ [{"__symbolic":"module","version":4,"metadata":{"ToggleState":{"Init":0,"Indeterminate":1,"Checked":2,"Unchecked":3},"ToggleChange":{"__symbolic":"class"},"Toggle":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../checkbox/checkbox.component","name":"Checkbox","line":97,"character":28},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":50,"character":1},"arguments":[{"selector":"ibm-toggle","template":"\n\t\t<label *ngIf=\"label\" [id]=\"ariaLabelledby\" class=\"bx--label\">\n\t\t\t<ng-container *ngIf=\"!isTemplate(label)\">{{label}}</ng-container>\n\t\t\t<ng-template *ngIf=\"isTemplate(label)\" [ngTemplateOutlet]=\"label\"></ng-template>\n\t\t</label>\n\t\t<input\n\t\t\tclass=\"bx--toggle\"\n\t\t\ttype=\"checkbox\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--toggle--small': size === 'sm',\n\t\t\t\t'bx--skeleton': skeleton\n\t\t\t}\"\n\t\t\t[id]=\"id\"\n\t\t\t[value]=\"value\"\n\t\t\t[name]=\"name\"\n\t\t\t[required]=\"required\"\n\t\t\t[checked]=\"checked\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\t[attr.aria-labelledby]=\"ariaLabelledby\"\n\t\t\t[attr.aria-checked]=\"checked\"\n\t\t\t(change)=\"onChange($event)\"\n\t\t\t(click)=\"onClick($event)\">\n\t\t<label\n\t\t\tclass=\"bx--toggle__label\"\n\t\t\t[for]=\"id\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--skeleton': skeleton\n\t\t\t}\">\n\t\t\t<span class=\"bx--toggle__text--left\">{{(!skeleton ? offText : null) | async }}</span>\n\t\t\t<span class=\"bx--toggle__appearance\">\n\t\t\t\t<svg *ngIf=\"size === 'sm'\" class=\"bx--toggle__check\" width=\"6px\" height=\"5px\" viewBox=\"0 0 6 5\">\n\t\t\t\t\t<path d=\"M2.2 2.7L5 0 6 1 2.2 5 0 2.7 1 1.5z\"/>\n\t\t\t\t</svg>\n\t\t\t</span>\n\t\t\t<span class=\"bx--toggle__text--right\">{{(!skeleton ? onText : null) | async}}</span>\n\t\t</label>\n\t","providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":91,"character":12},"useExisting":{"__symbolic":"reference","name":"Toggle"},"multi":true}]}]}],"members":{"offText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":106,"character":2}}]}],"onText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":118,"character":2}}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":130,"character":2}}]}],"size":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":134,"character":2}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":138,"character":2}}]}],"change":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":149,"character":2}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":156,"character":42},{"__symbolic":"reference","module":"../i18n/i18n.module","name":"I18n","line":156,"character":77}]}],"emitChangeEvent":[{"__symbolic":"method"}],"isTemplate":[{"__symbolic":"method"}]},"statics":{"toggleCount":0}}}}]
@@ -32,16 +32,19 @@ import * as i4 from "../i18n/i18n.service";
32
32
  var styles_Toggle = [];
33
33
  var RenderType_Toggle = i0.ɵcrt({ encapsulation: 2, styles: styles_Toggle, data: {} });
34
34
  export { RenderType_Toggle as RenderType_Toggle };
35
- function View_Toggle_1(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 1, "div", [["class", "bx--label"]], [[8, "id", 0]], null, null, null, null)), (_l()(), i0.ɵted(1, null, ["", ""]))], null, function (_ck, _v) { var _co = _v.component; var currVal_0 = _co.ariaLabelledby; _ck(_v, 0, 0, currVal_0); var currVal_1 = _co.label; _ck(_v, 1, 0, currVal_1); }); }
36
- function View_Toggle_2(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 1, ":svg:svg", [["class", "bx--toggle__check"], ["height", "5px"], ["viewBox", "0 0 6 5"], ["width", "6px"]], null, null, null, null, null)), (_l()(), i0.ɵeld(1, 0, null, null, 0, ":svg:path", [["d", "M2.2 2.7L5 0 6 1 2.2 5 0 2.7 1 1.5z"]], null, null, null, null, null))], null, null); }
35
+ function View_Toggle_2(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 1, null, null, null, null, null, null, null)), (_l()(), i0.ɵted(1, null, ["", ""]))], null, function (_ck, _v) { var _co = _v.component; var currVal_0 = _co.label; _ck(_v, 1, 0, currVal_0); }); }
36
+ function View_Toggle_4(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵand(0, null, null, 0))], null, null); }
37
+ function View_Toggle_3(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵand(16777216, null, null, 1, null, View_Toggle_4)), i0.ɵdid(1, 540672, null, 0, i1.NgTemplateOutlet, [i0.ViewContainerRef], { ngTemplateOutlet: [0, "ngTemplateOutlet"] }, null), (_l()(), i0.ɵand(0, null, null, 0))], function (_ck, _v) { var _co = _v.component; var currVal_0 = _co.label; _ck(_v, 1, 0, currVal_0); }, null); }
38
+ function View_Toggle_1(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 4, "label", [["class", "bx--label"]], [[8, "id", 0]], null, null, null, null)), (_l()(), i0.ɵand(16777216, null, null, 1, null, View_Toggle_2)), i0.ɵdid(2, 16384, null, 0, i1.NgIf, [i0.ViewContainerRef, i0.TemplateRef], { ngIf: [0, "ngIf"] }, null), (_l()(), i0.ɵand(16777216, null, null, 1, null, View_Toggle_3)), i0.ɵdid(4, 16384, null, 0, i1.NgIf, [i0.ViewContainerRef, i0.TemplateRef], { ngIf: [0, "ngIf"] }, null)], function (_ck, _v) { var _co = _v.component; var currVal_1 = !_co.isTemplate(_co.label); _ck(_v, 2, 0, currVal_1); var currVal_2 = _co.isTemplate(_co.label); _ck(_v, 4, 0, currVal_2); }, function (_ck, _v) { var _co = _v.component; var currVal_0 = _co.ariaLabelledby; _ck(_v, 0, 0, currVal_0); }); }
39
+ function View_Toggle_5(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 1, ":svg:svg", [["class", "bx--toggle__check"], ["height", "5px"], ["viewBox", "0 0 6 5"], ["width", "6px"]], null, null, null, null, null)), (_l()(), i0.ɵeld(1, 0, null, null, 0, ":svg:path", [["d", "M2.2 2.7L5 0 6 1 2.2 5 0 2.7 1 1.5z"]], null, null, null, null, null))], null, null); }
37
40
  export function View_Toggle_0(_l) { return i0.ɵvid(0, [i0.ɵqud(402653184, 1, { inputCheckbox: 0 }), (_l()(), i0.ɵand(16777216, null, null, 1, null, View_Toggle_1)), i0.ɵdid(2, 16384, null, 0, i1.NgIf, [i0.ViewContainerRef, i0.TemplateRef], { ngIf: [0, "ngIf"] }, null), (_l()(), i0.ɵeld(3, 0, null, null, 2, "input", [["class", "bx--toggle"], ["type", "checkbox"]], [[8, "id", 0], [8, "value", 0], [8, "name", 0], [8, "required", 0], [8, "checked", 0], [8, "disabled", 0], [1, "aria-labelledby", 0], [1, "aria-checked", 0]], [[null, "change"], [null, "click"]], function (_v, en, $event) { var ad = true; var _co = _v.component; if (("change" === en)) {
38
41
  var pd_0 = (_co.onChange($event) !== false);
39
42
  ad = (pd_0 && ad);
40
43
  } if (("click" === en)) {
41
44
  var pd_1 = (_co.onClick($event) !== false);
42
45
  ad = (pd_1 && ad);
43
- } return ad; }, null, null)), i0.ɵdid(4, 278528, null, 0, i1.NgClass, [i0.IterableDiffers, i0.KeyValueDiffers, i0.ElementRef, i0.Renderer2], { klass: [0, "klass"], ngClass: [1, "ngClass"] }, null), i0.ɵpod(5, { "bx--toggle--small": 0, "bx--skeleton": 1 }), (_l()(), i0.ɵeld(6, 0, null, null, 11, "label", [["class", "bx--toggle__label"]], [[8, "htmlFor", 0]], null, null, null, null)), i0.ɵdid(7, 278528, null, 0, i1.NgClass, [i0.IterableDiffers, i0.KeyValueDiffers, i0.ElementRef, i0.Renderer2], { klass: [0, "klass"], ngClass: [1, "ngClass"] }, null), i0.ɵpod(8, { "bx--skeleton": 0 }), (_l()(), i0.ɵeld(9, 0, null, null, 2, "span", [["class", "bx--toggle__text--left"]], null, null, null, null, null)), (_l()(), i0.ɵted(10, null, ["", ""])), i0.ɵpid(131072, i1.AsyncPipe, [i0.ChangeDetectorRef]), (_l()(), i0.ɵeld(12, 0, null, null, 2, "span", [["class", "bx--toggle__appearance"]], null, null, null, null, null)), (_l()(), i0.ɵand(16777216, null, null, 1, null, View_Toggle_2)), i0.ɵdid(14, 16384, null, 0, i1.NgIf, [i0.ViewContainerRef, i0.TemplateRef], { ngIf: [0, "ngIf"] }, null), (_l()(), i0.ɵeld(15, 0, null, null, 2, "span", [["class", "bx--toggle__text--right"]], null, null, null, null, null)), (_l()(), i0.ɵted(16, null, ["", ""])), i0.ɵpid(131072, i1.AsyncPipe, [i0.ChangeDetectorRef])], function (_ck, _v) { var _co = _v.component; var currVal_0 = _co.label; _ck(_v, 2, 0, currVal_0); var currVal_9 = "bx--toggle"; var currVal_10 = _ck(_v, 5, 0, (_co.size === "sm"), _co.skeleton); _ck(_v, 4, 0, currVal_9, currVal_10); var currVal_12 = "bx--toggle__label"; var currVal_13 = _ck(_v, 8, 0, _co.skeleton); _ck(_v, 7, 0, currVal_12, currVal_13); var currVal_15 = (_co.size === "sm"); _ck(_v, 14, 0, currVal_15); }, function (_ck, _v) { var _co = _v.component; var currVal_1 = _co.id; var currVal_2 = _co.value; var currVal_3 = _co.name; var currVal_4 = _co.required; var currVal_5 = _co.checked; var currVal_6 = _co.disabled; var currVal_7 = _co.ariaLabelledby; var currVal_8 = _co.checked; _ck(_v, 3, 0, currVal_1, currVal_2, currVal_3, currVal_4, currVal_5, currVal_6, currVal_7, currVal_8); var currVal_11 = _co.id; _ck(_v, 6, 0, currVal_11); var currVal_14 = i0.ɵunv(_v, 10, 0, i0.ɵnov(_v, 11).transform((!_co.skeleton ? _co.offText : null))); _ck(_v, 10, 0, currVal_14); var currVal_16 = i0.ɵunv(_v, 16, 0, i0.ɵnov(_v, 17).transform((!_co.skeleton ? _co.onText : null))); _ck(_v, 16, 0, currVal_16); }); }
46
+ } return ad; }, null, null)), i0.ɵdid(4, 278528, null, 0, i1.NgClass, [i0.IterableDiffers, i0.KeyValueDiffers, i0.ElementRef, i0.Renderer2], { klass: [0, "klass"], ngClass: [1, "ngClass"] }, null), i0.ɵpod(5, { "bx--toggle--small": 0, "bx--skeleton": 1 }), (_l()(), i0.ɵeld(6, 0, null, null, 11, "label", [["class", "bx--toggle__label"]], [[8, "htmlFor", 0]], null, null, null, null)), i0.ɵdid(7, 278528, null, 0, i1.NgClass, [i0.IterableDiffers, i0.KeyValueDiffers, i0.ElementRef, i0.Renderer2], { klass: [0, "klass"], ngClass: [1, "ngClass"] }, null), i0.ɵpod(8, { "bx--skeleton": 0 }), (_l()(), i0.ɵeld(9, 0, null, null, 2, "span", [["class", "bx--toggle__text--left"]], null, null, null, null, null)), (_l()(), i0.ɵted(10, null, ["", ""])), i0.ɵpid(131072, i1.AsyncPipe, [i0.ChangeDetectorRef]), (_l()(), i0.ɵeld(12, 0, null, null, 2, "span", [["class", "bx--toggle__appearance"]], null, null, null, null, null)), (_l()(), i0.ɵand(16777216, null, null, 1, null, View_Toggle_5)), i0.ɵdid(14, 16384, null, 0, i1.NgIf, [i0.ViewContainerRef, i0.TemplateRef], { ngIf: [0, "ngIf"] }, null), (_l()(), i0.ɵeld(15, 0, null, null, 2, "span", [["class", "bx--toggle__text--right"]], null, null, null, null, null)), (_l()(), i0.ɵted(16, null, ["", ""])), i0.ɵpid(131072, i1.AsyncPipe, [i0.ChangeDetectorRef])], function (_ck, _v) { var _co = _v.component; var currVal_0 = _co.label; _ck(_v, 2, 0, currVal_0); var currVal_9 = "bx--toggle"; var currVal_10 = _ck(_v, 5, 0, (_co.size === "sm"), _co.skeleton); _ck(_v, 4, 0, currVal_9, currVal_10); var currVal_12 = "bx--toggle__label"; var currVal_13 = _ck(_v, 8, 0, _co.skeleton); _ck(_v, 7, 0, currVal_12, currVal_13); var currVal_15 = (_co.size === "sm"); _ck(_v, 14, 0, currVal_15); }, function (_ck, _v) { var _co = _v.component; var currVal_1 = _co.id; var currVal_2 = _co.value; var currVal_3 = _co.name; var currVal_4 = _co.required; var currVal_5 = _co.checked; var currVal_6 = _co.disabled; var currVal_7 = _co.ariaLabelledby; var currVal_8 = _co.checked; _ck(_v, 3, 0, currVal_1, currVal_2, currVal_3, currVal_4, currVal_5, currVal_6, currVal_7, currVal_8); var currVal_11 = _co.id; _ck(_v, 6, 0, currVal_11); var currVal_14 = i0.ɵunv(_v, 10, 0, i0.ɵnov(_v, 11).transform((!_co.skeleton ? _co.offText : null))); _ck(_v, 10, 0, currVal_14); var currVal_16 = i0.ɵunv(_v, 16, 0, i0.ɵnov(_v, 17).transform((!_co.skeleton ? _co.onText : null))); _ck(_v, 16, 0, currVal_16); }); }
44
47
  export function View_Toggle_Host_0(_l) { return i0.ɵvid(0, [(_l()(), i0.ɵeld(0, 0, null, null, 2, "ibm-toggle", [], [[2, "bx--checkbox-wrapper", null], [2, "bx--form-item", null]], null, null, View_Toggle_0, RenderType_Toggle)), i0.ɵprd(5120, null, i2.NG_VALUE_ACCESSOR, function (p0_0) { return [p0_0]; }, [i3.Toggle]), i0.ɵdid(2, 4243456, null, 0, i3.Toggle, [i0.ChangeDetectorRef, i4.I18n], null, null)], null, function (_ck, _v) { var currVal_0 = i0.ɵnov(_v, 2).checkboxWrapperClass; var currVal_1 = i0.ɵnov(_v, 2).formItemClass; _ck(_v, 0, 0, currVal_0, currVal_1); }); }
45
- var ToggleNgFactory = i0.ɵccf("ibm-toggle", i3.Toggle, View_Toggle_Host_0, { size: "size", nested: "nested", inline: "inline", disabled: "disabled", skeleton: "skeleton", name: "name", id: "id", required: "required", value: "value", ariaLabel: "aria-label", ariaLabelledby: "aria-labelledby", indeterminate: "indeterminate", checked: "checked", offText: "offText", onText: "onText", label: "label" }, { change: "change", indeterminateChange: "indeterminateChange" }, []);
48
+ var ToggleNgFactory = i0.ɵccf("ibm-toggle", i3.Toggle, View_Toggle_Host_0, { size: "size", nested: "nested", inline: "inline", disabled: "disabled", skeleton: "skeleton", hideLabel: "hideLabel", name: "name", id: "id", required: "required", value: "value", ariaLabel: "aria-label", ariaLabelledby: "aria-labelledby", indeterminate: "indeterminate", checked: "checked", offText: "offText", onText: "onText", label: "label" }, { change: "change", indeterminateChange: "indeterminateChange" }, []);
46
49
  export { ToggleNgFactory as ToggleNgFactory };
47
50
  //# sourceMappingURL=toggle.component.ngfactory.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"toggle.component.ngfactory.js","sourceRoot":"","sources":["../src/toggle/toggle.component.ngfactory.ts","../src/toggle/toggle.component.ts.Toggle.html"],"names":[],"mappings":";;;;;;;;;;;;;;iDCCE,4GAA2D,KAAA,gCAAS,yDAA/B,mBAAqB,iBAA1D,YAA2D,EAAtB,SAAqB,GAAC,kDAAS;iDA0BlE,4KAAgG,KAC/F,8HAA+C;qGA3BlD,sKAA2D,IAC3D,0VAgB2B,YAD1B;;wBAA2B;MAC3B;;wBAAyB;MAhB1B,iMAgB2B,GAb1B,sDAGE,MAWH,qSAKI,GAFH,8BAEE,MACF,gHAAqC,KAAA,yFAAyC,KAC9E,iHAAqC,KACpC,uKAAgG,IAIjG,kHAAsC,KAAA,yFAAuC,kDA9BzE,mBAAa,QAAlB,YAA2D,EAAtD,SAAa,GAEjB,4BAAkB,EAElB,uDAGE,YANH,YAgB2B,EAf1B,SAAkB,EAElB,UAGE,GAYF,oCAAyB,EAEzB,kCAEE,YALH,YAKI,EAJH,UAAyB,EAEzB,UAEE,GAGI,mCAAqB,GAA1B,aAAgG,EAA3F,UAAqB,mDAlB3B,mBAAS,KACT,mBAAe,QACf,mBAAa,OACb,mBAAqB,WACrB,mBAAmB,UACnB,mBAAqB,WACrB,mBAAuC,iBACvC,mBAA6B,UAd9B,YAgB2B,EAT1B,SAAS,EACT,SAAe,EACf,SAAa,EACb,SAAqB,EACrB,SAAmB,EACnB,SAAqB,EACrB,SAAuC,EACvC,SAA6B,GAK7B,oBAAU,KAFX,YAKI,EAHH,UAAU,GAI2B,+HAAyC,GAMxC,8HAAuC","sourcesContent":["import * as i0 from '@angular/core';\ni0.ComponentFactory;\n","\n\t\t<div *ngIf=\"label\" class=\"bx--label\" [id]=\"ariaLabelledby\">{{label}}</div>\n\t\t<input\n\t\t\tclass=\"bx--toggle\"\n\t\t\ttype=\"checkbox\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--toggle--small': size === 'sm',\n\t\t\t\t'bx--skeleton': skeleton\n\t\t\t}\"\n\t\t\t[id]=\"id\"\n\t\t\t[value]=\"value\"\n\t\t\t[name]=\"name\"\n\t\t\t[required]=\"required\"\n\t\t\t[checked]=\"checked\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\t[attr.aria-labelledby]=\"ariaLabelledby\"\n\t\t\t[attr.aria-checked]=\"checked\"\n\t\t\t(change)=\"onChange($event)\"\n\t\t\t(click)=\"onClick($event)\">\n\t\t<label\n\t\t\tclass=\"bx--toggle__label\"\n\t\t\t[for]=\"id\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--skeleton': skeleton\n\t\t\t}\">\n\t\t\t<span class=\"bx--toggle__text--left\">{{(!skeleton ? offText : null) | async }}</span>\n\t\t\t<span class=\"bx--toggle__appearance\">\n\t\t\t\t<svg *ngIf=\"size === 'sm'\" class=\"bx--toggle__check\" width=\"6px\" height=\"5px\" viewBox=\"0 0 6 5\">\n\t\t\t\t\t<path d=\"M2.2 2.7L5 0 6 1 2.2 5 0 2.7 1 1.5z\"/>\n\t\t\t\t</svg>\n\t\t\t</span>\n\t\t\t<span class=\"bx--toggle__text--right\">{{(!skeleton ? onText : null) | async}}</span>\n\t\t</label>\n\t"]}
1
+ {"version":3,"file":"toggle.component.ngfactory.js","sourceRoot":"","sources":["../src/toggle/toggle.component.ngfactory.ts","../src/toggle/toggle.component.ts.Toggle.html"],"names":[],"mappings":";;;;;;;;;;;;;;iDCEG,6EAAyC,KAAA,2IAAS;;iDAClD,2LAAkE,sFAA3B,mBAA0B,QAAjE,YAAkE,EAA3B,SAA0B;iDAFlE,8GAA6D,KAC5D,sKAAyC,IACzC,sKAAkE,iDADpD,mCAA0B,SAAxC,YAAyC,EAA3B,SAA0B,GAC3B,kCAAyB,SAAtC,YAAkE,EAArD,SAAyB,mDAFlB,mBAAqB,iBAA1C,YAA6D,EAAxC,SAAqB;iDA6BxC,4KAAgG,KAC/F,8HAA+C;qGA9BlD,sKAA6D,IAI7D,0VAgB2B,YAD1B;;wBAA2B;MAC3B;;wBAAyB;MAhB1B,iMAgB2B,GAb1B,sDAGE,MAWH,qSAKI,GAFH,8BAEE,MACF,gHAAqC,KAAA,yFAAyC,KAC9E,iHAAqC,KACpC,uKAAgG,IAIjG,kHAAsC,KAAA,yFAAuC,kDAjCvE,mBAAa,QAApB,YAA6D,EAAtD,SAAa,GAKnB,4BAAkB,EAElB,uDAGE,YANH,YAgB2B,EAf1B,SAAkB,EAElB,UAGE,GAYF,oCAAyB,EAEzB,kCAEE,YALH,YAKI,EAJH,UAAyB,EAEzB,UAEE,GAGI,mCAAqB,GAA1B,aAAgG,EAA3F,UAAqB,mDAlB3B,mBAAS,KACT,mBAAe,QACf,mBAAa,OACb,mBAAqB,WACrB,mBAAmB,UACnB,mBAAqB,WACrB,mBAAuC,iBACvC,mBAA6B,UAd9B,YAgB2B,EAT1B,SAAS,EACT,SAAe,EACf,SAAa,EACb,SAAqB,EACrB,SAAmB,EACnB,SAAqB,EACrB,SAAuC,EACvC,SAA6B,GAK7B,oBAAU,KAFX,YAKI,EAHH,UAAU,GAI2B,+HAAyC,GAMxC,8HAAuC","sourcesContent":["import * as i0 from '@angular/core';\ni0.ComponentFactory;\n","\n\t\t<label *ngIf=\"label\" [id]=\"ariaLabelledby\" class=\"bx--label\">\n\t\t\t<ng-container *ngIf=\"!isTemplate(label)\">{{label}}</ng-container>\n\t\t\t<ng-template *ngIf=\"isTemplate(label)\" [ngTemplateOutlet]=\"label\"></ng-template>\n\t\t</label>\n\t\t<input\n\t\t\tclass=\"bx--toggle\"\n\t\t\ttype=\"checkbox\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--toggle--small': size === 'sm',\n\t\t\t\t'bx--skeleton': skeleton\n\t\t\t}\"\n\t\t\t[id]=\"id\"\n\t\t\t[value]=\"value\"\n\t\t\t[name]=\"name\"\n\t\t\t[required]=\"required\"\n\t\t\t[checked]=\"checked\"\n\t\t\t[disabled]=\"disabled\"\n\t\t\t[attr.aria-labelledby]=\"ariaLabelledby\"\n\t\t\t[attr.aria-checked]=\"checked\"\n\t\t\t(change)=\"onChange($event)\"\n\t\t\t(click)=\"onClick($event)\">\n\t\t<label\n\t\t\tclass=\"bx--toggle__label\"\n\t\t\t[for]=\"id\"\n\t\t\t[ngClass]=\"{\n\t\t\t\t'bx--skeleton': skeleton\n\t\t\t}\">\n\t\t\t<span class=\"bx--toggle__text--left\">{{(!skeleton ? offText : null) | async }}</span>\n\t\t\t<span class=\"bx--toggle__appearance\">\n\t\t\t\t<svg *ngIf=\"size === 'sm'\" class=\"bx--toggle__check\" width=\"6px\" height=\"5px\" viewBox=\"0 0 6 5\">\n\t\t\t\t\t<path d=\"M2.2 2.7L5 0 6 1 2.2 5 0 2.7 1 1.5z\"/>\n\t\t\t\t</svg>\n\t\t\t</span>\n\t\t\t<span class=\"bx--toggle__text--right\">{{(!skeleton ? onText : null) | async}}</span>\n\t\t</label>\n\t"]}
@@ -1 +1 @@
1
- {"moduleName":null,"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"Init":0,"Indeterminate":1,"Checked":2,"Unchecked":3}},{"symbol":{"__symbol":1,"members":[]},"metadata":{"__symbolic":"class"}},{"symbol":{"__symbol":2,"members":[]},"metadata":{"__symbolic":"class","extends":{"__symbol":3,"members":[]},"members":{"offText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]}}]}],"onText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]}}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]}}]}],"size":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]}}]}],"change":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":5,"members":[]}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbol":6,"members":[]},{"__symbol":7,"members":[]}]}],"emitChangeEvent":[{"__symbolic":"method"}]},"statics":{"toggleCount":0}},"type":{"summaryKind":1,"type":{"reference":{"__symbol":2,"members":[]},"diDeps":[{"isAttribute":false,"isHost":false,"isSelf":false,"isSkipSelf":false,"isOptional":false,"token":{"identifier":{"reference":{"__symbol":6,"members":[]}}}},{"isAttribute":false,"isHost":false,"isSelf":false,"isSkipSelf":false,"isOptional":false,"token":{"identifier":{"reference":{"__symbol":8,"members":[]}}}}],"lifecycleHooks":[6]},"isComponent":true,"selector":"ibm-toggle","exportAs":null,"inputs":{"size":"size","nested":"nested","inline":"inline","disabled":"disabled","skeleton":"skeleton","name":"name","id":"id","required":"required","value":"value","ariaLabel":"aria-label","ariaLabelledby":"aria-labelledby","indeterminate":"indeterminate","checked":"checked","offText":"offText","onText":"onText","label":"label"},"outputs":{"change":"change","indeterminateChange":"indeterminateChange"},"hostListeners":{},"hostProperties":{"class.bx--checkbox-wrapper":"checkboxWrapperClass","class.bx--form-item":"formItemClass"},"hostAttributes":{},"providers":[{"token":{"identifier":{"reference":{"__symbol":9,"members":[]}}},"useClass":null,"useFactory":null,"useExisting":{"identifier":{"reference":{"__symbol":2,"members":[]}}},"multi":true}],"viewProviders":[],"queries":[],"guards":{},"viewQueries":[{"selectors":[{"value":"inputCheckbox"}],"first":true,"descendants":true,"propertyName":"inputCheckbox","read":null}],"entryComponents":[],"changeDetection":1,"template":{"ngContentSelectors":[],"encapsulation":2},"componentViewType":{"__symbol":10,"members":[]},"rendererType":{"__symbol":11,"members":[]},"componentFactory":{"__symbol":12,"members":[]}}}],"symbols":[{"__symbol":0,"name":"ToggleState","filePath":"./toggle.component"},{"__symbol":1,"name":"ToggleChange","filePath":"./toggle.component"},{"__symbol":2,"name":"Toggle","filePath":"./toggle.component"},{"__symbol":3,"name":"Checkbox","filePath":"../checkbox/checkbox.component"},{"__symbol":4,"name":"Input","filePath":"@angular/core"},{"__symbol":5,"name":"Output","filePath":"@angular/core"},{"__symbol":6,"name":"ChangeDetectorRef","filePath":"@angular/core"},{"__symbol":7,"name":"I18n","filePath":"../i18n/i18n.module"},{"__symbol":8,"name":"I18n","filePath":"../i18n/i18n.service"},{"__symbol":9,"name":"NG_VALUE_ACCESSOR","filePath":"@angular/forms"},{"__symbol":10,"name":"View_Toggle_0","filePath":"./toggle.component.ngfactory"},{"__symbol":11,"name":"RenderType_Toggle","filePath":"./toggle.component.ngfactory"},{"__symbol":12,"name":"ToggleNgFactory","filePath":"./toggle.component.ngfactory"}]}
1
+ {"moduleName":null,"summaries":[{"symbol":{"__symbol":0,"members":[]},"metadata":{"Init":0,"Indeterminate":1,"Checked":2,"Unchecked":3}},{"symbol":{"__symbol":1,"members":[]},"metadata":{"__symbolic":"class"}},{"symbol":{"__symbol":2,"members":[]},"metadata":{"__symbolic":"class","extends":{"__symbol":3,"members":[]},"members":{"offText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]}}]}],"onText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]}}]}],"label":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]}}]}],"size":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]}}]}],"skeleton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":4,"members":[]}}]}],"change":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbol":5,"members":[]}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbol":6,"members":[]},{"__symbol":7,"members":[]}]}],"emitChangeEvent":[{"__symbolic":"method"}],"isTemplate":[{"__symbolic":"method"}]},"statics":{"toggleCount":0}},"type":{"summaryKind":1,"type":{"reference":{"__symbol":2,"members":[]},"diDeps":[{"isAttribute":false,"isHost":false,"isSelf":false,"isSkipSelf":false,"isOptional":false,"token":{"identifier":{"reference":{"__symbol":6,"members":[]}}}},{"isAttribute":false,"isHost":false,"isSelf":false,"isSkipSelf":false,"isOptional":false,"token":{"identifier":{"reference":{"__symbol":8,"members":[]}}}}],"lifecycleHooks":[6]},"isComponent":true,"selector":"ibm-toggle","exportAs":null,"inputs":{"size":"size","nested":"nested","inline":"inline","disabled":"disabled","skeleton":"skeleton","hideLabel":"hideLabel","name":"name","id":"id","required":"required","value":"value","ariaLabel":"aria-label","ariaLabelledby":"aria-labelledby","indeterminate":"indeterminate","checked":"checked","offText":"offText","onText":"onText","label":"label"},"outputs":{"change":"change","indeterminateChange":"indeterminateChange"},"hostListeners":{},"hostProperties":{"class.bx--checkbox-wrapper":"checkboxWrapperClass","class.bx--form-item":"formItemClass"},"hostAttributes":{},"providers":[{"token":{"identifier":{"reference":{"__symbol":9,"members":[]}}},"useClass":null,"useFactory":null,"useExisting":{"identifier":{"reference":{"__symbol":2,"members":[]}}},"multi":true}],"viewProviders":[],"queries":[],"guards":{},"viewQueries":[{"selectors":[{"value":"inputCheckbox"}],"first":true,"descendants":true,"propertyName":"inputCheckbox","read":null}],"entryComponents":[],"changeDetection":1,"template":{"ngContentSelectors":[],"encapsulation":2},"componentViewType":{"__symbol":10,"members":[]},"rendererType":{"__symbol":11,"members":[]},"componentFactory":{"__symbol":12,"members":[]}}}],"symbols":[{"__symbol":0,"name":"ToggleState","filePath":"./toggle.component"},{"__symbol":1,"name":"ToggleChange","filePath":"./toggle.component"},{"__symbol":2,"name":"Toggle","filePath":"./toggle.component"},{"__symbol":3,"name":"Checkbox","filePath":"../checkbox/checkbox.component"},{"__symbol":4,"name":"Input","filePath":"@angular/core"},{"__symbol":5,"name":"Output","filePath":"@angular/core"},{"__symbol":6,"name":"ChangeDetectorRef","filePath":"@angular/core"},{"__symbol":7,"name":"I18n","filePath":"../i18n/i18n.module"},{"__symbol":8,"name":"I18n","filePath":"../i18n/i18n.service"},{"__symbol":9,"name":"NG_VALUE_ACCESSOR","filePath":"@angular/forms"},{"__symbol":10,"name":"View_Toggle_0","filePath":"./toggle.component.ngfactory"},{"__symbol":11,"name":"RenderType_Toggle","filePath":"./toggle.component.ngfactory"},{"__symbol":12,"name":"ToggleNgFactory","filePath":"./toggle.component.ngfactory"}]}
@@ -21,7 +21,7 @@
21
21
  import { Component, Input } from "@angular/core";
22
22
  var HeaderItem = /** @class */ (function () {
23
23
  function HeaderItem() {
24
- this.href = "#";
24
+ this.href = "javascript:void(0)";
25
25
  }
26
26
  HeaderItem.decorators = [
27
27
  { type: Component, args: [{
@@ -1 +1 @@
1
- {"version":3,"file":"header-item.component.js","sourceRoot":"","sources":["../../src/ui-shell/header/header-item.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAEjD;IAAA;QAWU,SAAI,GAAG,GAAG,CAAC;IACrB,CAAC;;gBAZA,SAAS,SAAC;oBACV,QAAQ,EAAE,iBAAiB;oBAC3B,QAAQ,EAAE,6LAMT;iBACD;;;uBAEC,KAAK;;IACP,iBAAC;CAAA,AAZD,IAYC;SAFY,UAAU","sourcesContent":["import { Component, Input } from \"@angular/core\";\n\n@Component({\n\tselector: \"ibm-header-item\",\n\ttemplate: `\n\t\t<li style=\"height: 100%\">\n\t\t\t<a class=\"bx--header__menu-item\" [href]=\"href\" role=\"menuitem\" tabindex=\"0\">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</a>\n\t\t</li>\n\t`\n})\nexport class HeaderItem {\n\t@Input() href = \"#\";\n}\n"]}
1
+ {"version":3,"file":"header-item.component.js","sourceRoot":"","sources":["../../src/ui-shell/header/header-item.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAEjD;IAAA;QAWU,SAAI,GAAG,oBAAoB,CAAC;IACtC,CAAC;;gBAZA,SAAS,SAAC;oBACV,QAAQ,EAAE,iBAAiB;oBAC3B,QAAQ,EAAE,6LAMT;iBACD;;;uBAEC,KAAK;;IACP,iBAAC;CAAA,AAZD,IAYC;SAFY,UAAU","sourcesContent":["import { Component, Input } from \"@angular/core\";\n\n@Component({\n\tselector: \"ibm-header-item\",\n\ttemplate: `\n\t\t<li style=\"height: 100%\">\n\t\t\t<a class=\"bx--header__menu-item\" [href]=\"href\" role=\"menuitem\" tabindex=\"0\">\n\t\t\t\t<ng-content></ng-content>\n\t\t\t</a>\n\t\t</li>\n\t`\n})\nexport class HeaderItem {\n\t@Input() href = \"javascript:void(0)\";\n}\n"]}