1 | (function (global, factory) {
|
2 | if (typeof define === "function" && define.amd) {
|
3 | define(["exports", "../../globals/js/settings", "../../globals/js/misc/mixin", "../../globals/js/mixins/create-component", "../../globals/js/mixins/init-component-by-search", "../../globals/js/mixins/handles", "../../globals/js/misc/on"], factory);
|
4 | } else if (typeof exports !== "undefined") {
|
5 | factory(exports, require("../../globals/js/settings"), require("../../globals/js/misc/mixin"), require("../../globals/js/mixins/create-component"), require("../../globals/js/mixins/init-component-by-search"), require("../../globals/js/mixins/handles"), require("../../globals/js/misc/on"));
|
6 | } else {
|
7 | var mod = {
|
8 | exports: {}
|
9 | };
|
10 | factory(mod.exports, global.settings, global.mixin, global.createComponent, global.initComponentBySearch, global.handles, global.on);
|
11 | global.checkbox = mod.exports;
|
12 | }
|
13 | })(this, function (_exports, _settings, _mixin2, _createComponent, _initComponentBySearch, _handles, _on) {
|
14 | "use strict";
|
15 |
|
16 | Object.defineProperty(_exports, "__esModule", {
|
17 | value: true
|
18 | });
|
19 | _exports.default = void 0;
|
20 | _settings = _interopRequireDefault(_settings);
|
21 | _mixin2 = _interopRequireDefault(_mixin2);
|
22 | _createComponent = _interopRequireDefault(_createComponent);
|
23 | _initComponentBySearch = _interopRequireDefault(_initComponentBySearch);
|
24 | _handles = _interopRequireDefault(_handles);
|
25 | _on = _interopRequireDefault(_on);
|
26 |
|
27 | function _interopRequireDefault(obj) {
|
28 | return obj && obj.__esModule ? obj : {
|
29 | default: obj
|
30 | };
|
31 | }
|
32 |
|
33 | function _typeof(obj) {
|
34 | if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") {
|
35 | _typeof = function _typeof(obj) {
|
36 | return typeof obj;
|
37 | };
|
38 | } else {
|
39 | _typeof = function _typeof(obj) {
|
40 | return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
|
41 | };
|
42 | }
|
43 |
|
44 | return _typeof(obj);
|
45 | }
|
46 |
|
47 | function _classCallCheck(instance, Constructor) {
|
48 | if (!(instance instanceof Constructor)) {
|
49 | throw new TypeError("Cannot call a class as a function");
|
50 | }
|
51 | }
|
52 |
|
53 | function _defineProperties(target, props) {
|
54 | for (var i = 0; i < props.length; i++) {
|
55 | var descriptor = props[i];
|
56 | descriptor.enumerable = descriptor.enumerable || false;
|
57 | descriptor.configurable = true;
|
58 | if ("value" in descriptor) descriptor.writable = true;
|
59 | Object.defineProperty(target, descriptor.key, descriptor);
|
60 | }
|
61 | }
|
62 |
|
63 | function _createClass(Constructor, protoProps, staticProps) {
|
64 | if (protoProps) _defineProperties(Constructor.prototype, protoProps);
|
65 | if (staticProps) _defineProperties(Constructor, staticProps);
|
66 | return Constructor;
|
67 | }
|
68 |
|
69 | function _possibleConstructorReturn(self, call) {
|
70 | if (call && (_typeof(call) === "object" || typeof call === "function")) {
|
71 | return call;
|
72 | }
|
73 |
|
74 | return _assertThisInitialized(self);
|
75 | }
|
76 |
|
77 | function _assertThisInitialized(self) {
|
78 | if (self === void 0) {
|
79 | throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
|
80 | }
|
81 |
|
82 | return self;
|
83 | }
|
84 |
|
85 | function _getPrototypeOf(o) {
|
86 | _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
|
87 | return o.__proto__ || Object.getPrototypeOf(o);
|
88 | };
|
89 | return _getPrototypeOf(o);
|
90 | }
|
91 |
|
92 | function _inherits(subClass, superClass) {
|
93 | if (typeof superClass !== "function" && superClass !== null) {
|
94 | throw new TypeError("Super expression must either be null or a function");
|
95 | }
|
96 |
|
97 | subClass.prototype = Object.create(superClass && superClass.prototype, {
|
98 | constructor: {
|
99 | value: subClass,
|
100 | writable: true,
|
101 | configurable: true
|
102 | }
|
103 | });
|
104 | if (superClass) _setPrototypeOf(subClass, superClass);
|
105 | }
|
106 |
|
107 | function _setPrototypeOf(o, p) {
|
108 | _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
|
109 | o.__proto__ = p;
|
110 | return o;
|
111 | };
|
112 |
|
113 | return _setPrototypeOf(o, p);
|
114 | }
|
115 |
|
116 | var stateChangeTypes = {
|
117 | true: 'true',
|
118 | false: 'false',
|
119 | mixed: 'mixed'
|
120 | };
|
121 |
|
122 | var Checkbox =
|
123 |
|
124 | function (_mixin) {
|
125 | _inherits(Checkbox, _mixin);
|
126 | |
127 |
|
128 |
|
129 |
|
130 |
|
131 |
|
132 |
|
133 |
|
134 |
|
135 | function Checkbox(element, options) {
|
136 | var _this;
|
137 |
|
138 | _classCallCheck(this, Checkbox);
|
139 |
|
140 | _this = _possibleConstructorReturn(this, _getPrototypeOf(Checkbox).call(this, element, options));
|
141 |
|
142 | _this.manage((0, _on.default)(_this.element, 'click', function (event) {
|
143 | _this._handleClick(event);
|
144 | }));
|
145 |
|
146 | _this.manage((0, _on.default)(_this.element, 'focus', function (event) {
|
147 | _this._handleFocus(event);
|
148 | }));
|
149 |
|
150 | _this.manage((0, _on.default)(_this.element, 'blur', function (event) {
|
151 | _this._handleBlur(event);
|
152 | }));
|
153 |
|
154 | _this._indeterminateCheckbox();
|
155 |
|
156 | _this._initCheckbox();
|
157 |
|
158 | return _this;
|
159 | }
|
160 |
|
161 | _createClass(Checkbox, [{
|
162 | key: "_handleClick",
|
163 | value: function _handleClick() {
|
164 | if (this.element.checked === true) {
|
165 | this.element.setAttribute('checked', '');
|
166 | this.element.setAttribute('aria-checked', 'true');
|
167 | this.element.checked = true;
|
168 |
|
169 | if (this.element.parentElement.classList.contains(this.options.classLabel)) {
|
170 | this.element.parentElement.setAttribute(this.options.attribContainedCheckboxState, 'true');
|
171 | }
|
172 | } else if (this.element.checked === false) {
|
173 | this.element.removeAttribute('checked');
|
174 | this.element.setAttribute('aria-checked', 'false');
|
175 | this.element.checked = false;
|
176 |
|
177 | if (this.element.parentElement.classList.contains(this.options.classLabel)) {
|
178 | this.element.parentElement.setAttribute(this.options.attribContainedCheckboxState, 'false');
|
179 | }
|
180 | }
|
181 | }
|
182 | }, {
|
183 | key: "_handleFocus",
|
184 | value: function _handleFocus() {
|
185 | if (this.element.parentElement.classList.contains(this.options.classLabel)) {
|
186 | this.element.parentElement.classList.add(this.options.classLabelFocused);
|
187 | }
|
188 | }
|
189 | }, {
|
190 | key: "_handleBlur",
|
191 | value: function _handleBlur() {
|
192 | if (this.element.parentElement.classList.contains(this.options.classLabel)) {
|
193 | this.element.parentElement.classList.remove(this.options.classLabelFocused);
|
194 | }
|
195 | }
|
196 | |
197 |
|
198 |
|
199 |
|
200 |
|
201 |
|
202 |
|
203 | }, {
|
204 | key: "setState",
|
205 | value: function setState(state) {
|
206 | if (state === undefined || stateChangeTypes[state] === undefined) {
|
207 | throw new TypeError('setState expects a value of true, false or mixed.');
|
208 | }
|
209 |
|
210 | this.element.setAttribute('aria-checked', state);
|
211 | this.element.indeterminate = state === stateChangeTypes.mixed;
|
212 | this.element.checked = state === stateChangeTypes.true;
|
213 | var container = this.element.closest(this.options.selectorContainedCheckboxState);
|
214 |
|
215 | if (container) {
|
216 | container.setAttribute(this.options.attribContainedCheckboxState, state);
|
217 | }
|
218 | }
|
219 | }, {
|
220 | key: "setDisabled",
|
221 | value: function setDisabled(value) {
|
222 | if (value === undefined) {
|
223 | throw new TypeError('setDisabled expects a boolean value of true or false');
|
224 | }
|
225 |
|
226 | if (value === true) {
|
227 | this.element.setAttribute('disabled', true);
|
228 | } else if (value === false) {
|
229 | this.element.removeAttribute('disabled');
|
230 | }
|
231 |
|
232 | var container = this.element.closest(this.options.selectorContainedCheckboxDisabled);
|
233 |
|
234 | if (container) {
|
235 | container.setAttribute(this.options.attribContainedCheckboxDisabled, value);
|
236 | }
|
237 | }
|
238 | }, {
|
239 | key: "_indeterminateCheckbox",
|
240 | value: function _indeterminateCheckbox() {
|
241 | if (this.element.getAttribute('aria-checked') === 'mixed') {
|
242 | this.element.indeterminate = true;
|
243 | }
|
244 |
|
245 | if (this.element.indeterminate === true) {
|
246 | this.element.setAttribute('aria-checked', 'mixed');
|
247 | }
|
248 |
|
249 | if (this.element.parentElement.classList.contains(this.options.classLabel) && this.element.indeterminate === true) {
|
250 | this.element.parentElement.setAttribute(this.options.attribContainedCheckboxState, 'mixed');
|
251 | }
|
252 | }
|
253 | }, {
|
254 | key: "_initCheckbox",
|
255 | value: function _initCheckbox() {
|
256 | if (this.element.checked === true) {
|
257 | this.element.setAttribute('aria-checked', 'true');
|
258 | }
|
259 |
|
260 | if (this.element.parentElement.classList.contains(this.options.classLabel) && this.element.checked) {
|
261 | this.element.parentElement.setAttribute(this.options.attribContainedCheckboxState, 'true');
|
262 | }
|
263 |
|
264 | if (this.element.parentElement.classList.contains(this.options.classLabel)) {
|
265 | this.element.parentElement.setAttribute(this.options.attribContainedCheckboxDisabled, 'false');
|
266 | }
|
267 |
|
268 | if (this.element.parentElement.classList.contains(this.options.classLabel) && this.element.disabled) {
|
269 | this.element.parentElement.setAttribute(this.options.attribContainedCheckboxDisabled, 'true');
|
270 | }
|
271 | }
|
272 | |
273 |
|
274 |
|
275 |
|
276 |
|
277 |
|
278 | }], [{
|
279 | key: "options",
|
280 |
|
281 | |
282 |
|
283 |
|
284 |
|
285 |
|
286 |
|
287 |
|
288 |
|
289 |
|
290 |
|
291 |
|
292 |
|
293 |
|
294 |
|
295 |
|
296 | get: function get() {
|
297 | var prefix = _settings.default.prefix;
|
298 | return {
|
299 | selectorInit: ".".concat(prefix, "--checkbox"),
|
300 | selectorContainedCheckboxState: '[data-contained-checkbox-state]',
|
301 | selectorContainedCheckboxDisabled: '[data-contained-checkbox-disabled]',
|
302 | classLabel: "".concat(prefix, "--checkbox-label"),
|
303 | classLabelFocused: "".concat(prefix, "--checkbox-label__focus"),
|
304 | attribContainedCheckboxState: 'data-contained-checkbox-state',
|
305 | attribContainedCheckboxDisabled: 'data-contained-checkbox-disabled'
|
306 | };
|
307 | }
|
308 | }]);
|
309 |
|
310 | Checkbox.components = new WeakMap();
|
311 | Checkbox.stateChangeTypes = stateChangeTypes;
|
312 | return Checkbox;
|
313 | }((0, _mixin2.default)(_createComponent.default, _initComponentBySearch.default, _handles.default));
|
314 |
|
315 | var _default = Checkbox;
|
316 | _exports.default = _default;
|
317 | }); |
\ | No newline at end of file |