UNPKG

8.92 kBJavaScriptView Raw
1/**
2 * @license
3 * Copyright 2018 Google Inc.
4 *
5 * Permission is hereby granted, free of charge, to any person obtaining a copy
6 * of this software and associated documentation files (the "Software"), to deal
7 * in the Software without restriction, including without limitation the rights
8 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 * copies of the Software, and to permit persons to whom the Software is
10 * furnished to do so, subject to the following conditions:
11 *
12 * The above copyright notice and this permission notice shall be included in
13 * all copies or substantial portions of the Software.
14 *
15 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21 * THE SOFTWARE.
22 */
23import { __extends, __read, __values } from "tslib";
24import { MDCComponent } from '@material/base/component';
25import { MDCChipAction } from '../action/component';
26import { MDCChipActionEvents } from '../action/constants';
27import { MDCChipFoundation } from './foundation';
28/**
29 * MDCChip provides component encapsulation of the foundation implementation.
30 */
31var MDCChip = /** @class */ (function (_super) {
32 __extends(MDCChip, _super);
33 function MDCChip() {
34 var _this = _super !== null && _super.apply(this, arguments) || this;
35 _this.rootHTML = _this.root;
36 return _this;
37 }
38 MDCChip.attachTo = function (root) {
39 return new MDCChip(root);
40 };
41 MDCChip.prototype.initialize = function (actionFactory) {
42 if (actionFactory === void 0) { actionFactory = function (el) { return new MDCChipAction(el); }; }
43 this.actions = new Map();
44 var actionEls = this.root.querySelectorAll('.mdc-evolution-chip__action');
45 for (var i = 0; i < actionEls.length; i++) {
46 var action = actionFactory(actionEls[i]);
47 this.actions.set(action.actionType(), action);
48 }
49 };
50 MDCChip.prototype.initialSyncWithDOM = function () {
51 var _this = this;
52 this.handleActionInteraction = function (event) {
53 _this.foundation.handleActionInteraction(event);
54 };
55 this.handleActionNavigation = function (event) {
56 _this.foundation.handleActionNavigation(event);
57 };
58 this.listen(MDCChipActionEvents.INTERACTION, this.handleActionInteraction);
59 this.listen(MDCChipActionEvents.NAVIGATION, this.handleActionNavigation);
60 };
61 MDCChip.prototype.destroy = function () {
62 this.unlisten(MDCChipActionEvents.INTERACTION, this.handleActionInteraction);
63 this.unlisten(MDCChipActionEvents.NAVIGATION, this.handleActionNavigation);
64 _super.prototype.destroy.call(this);
65 };
66 MDCChip.prototype.getDefaultFoundation = function () {
67 var _this = this;
68 // DO NOT INLINE this variable. For backward compatibility, foundations take
69 // a Partial<MDCFooAdapter>. To ensure we don't accidentally omit any
70 // methods, we need a separate, strongly typed adapter variable.
71 var adapter = {
72 addClass: function (className) {
73 _this.root.classList.add(className);
74 },
75 emitEvent: function (eventName, eventDetail) {
76 _this.emit(eventName, eventDetail, true /* shouldBubble */);
77 },
78 getActions: function () {
79 var e_1, _a;
80 var actions = [];
81 try {
82 for (var _b = __values(_this.actions), _c = _b.next(); !_c.done; _c = _b.next()) {
83 var _d = __read(_c.value, 1), key = _d[0];
84 actions.push(key);
85 }
86 }
87 catch (e_1_1) { e_1 = { error: e_1_1 }; }
88 finally {
89 try {
90 if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
91 }
92 finally { if (e_1) throw e_1.error; }
93 }
94 return actions;
95 },
96 getAttribute: function (attrName) { return _this.root.getAttribute(attrName); },
97 getElementID: function () { return _this.rootHTML.id; },
98 getOffsetWidth: function () {
99 return _this.rootHTML.offsetWidth;
100 },
101 hasClass: function (className) { return _this.root.classList.contains(className); },
102 isActionSelectable: function (actionType) {
103 var action = _this.actions.get(actionType);
104 if (action) {
105 return action.isSelectable();
106 }
107 return false;
108 },
109 isActionSelected: function (actionType) {
110 var action = _this.actions.get(actionType);
111 if (action) {
112 return action.isSelected();
113 }
114 return false;
115 },
116 isActionFocusable: function (actionType) {
117 var action = _this.actions.get(actionType);
118 if (action) {
119 return action.isFocusable();
120 }
121 return false;
122 },
123 isActionDisabled: function (actionType) {
124 var action = _this.actions.get(actionType);
125 if (action) {
126 return action.isDisabled();
127 }
128 return false;
129 },
130 isRTL: function () { return window.getComputedStyle(_this.root).getPropertyValue('direction') === 'rtl'; },
131 removeClass: function (className) {
132 _this.root.classList.remove(className);
133 },
134 setActionDisabled: function (actionType, isDisabled) {
135 var action = _this.actions.get(actionType);
136 if (action) {
137 action.setDisabled(isDisabled);
138 }
139 },
140 setActionFocus: function (actionType, behavior) {
141 var action = _this.actions.get(actionType);
142 if (action) {
143 action.setFocus(behavior);
144 }
145 },
146 setActionSelected: function (actionType, isSelected) {
147 var action = _this.actions.get(actionType);
148 if (action) {
149 action.setSelected(isSelected);
150 }
151 },
152 setStyleProperty: function (prop, value) {
153 _this.rootHTML.style.setProperty(prop, value);
154 },
155 };
156 // Default to the primary foundation
157 return new MDCChipFoundation(adapter);
158 };
159 /** Exposed to be called by the parent chip set. */
160 MDCChip.prototype.remove = function () {
161 var parent = this.root.parentNode;
162 if (parent !== null) {
163 parent.removeChild(this.root);
164 }
165 };
166 /** Returns the MDCChipActionTypes for the encapsulated actions. */
167 MDCChip.prototype.getActions = function () {
168 return this.foundation.getActions();
169 };
170 /** Returns the ID of the root element. */
171 MDCChip.prototype.getElementID = function () {
172 return this.foundation.getElementID();
173 };
174 MDCChip.prototype.isDisabled = function () {
175 return this.foundation.isDisabled();
176 };
177 MDCChip.prototype.setDisabled = function (isDisabled) {
178 this.foundation.setDisabled(isDisabled);
179 };
180 /** Returns the focusability of the action. */
181 MDCChip.prototype.isActionFocusable = function (action) {
182 return this.foundation.isActionFocusable(action);
183 };
184 /** Returns the selectability of the action. */
185 MDCChip.prototype.isActionSelectable = function (action) {
186 return this.foundation.isActionSelectable(action);
187 };
188 /** Returns the selected state of the action. */
189 MDCChip.prototype.isActionSelected = function (action) {
190 return this.foundation.isActionSelected(action);
191 };
192 /** Sets the focus behavior of the action. */
193 MDCChip.prototype.setActionFocus = function (action, focus) {
194 this.foundation.setActionFocus(action, focus);
195 };
196 /** Sets the selected state of the action. */
197 MDCChip.prototype.setActionSelected = function (action, isSelected) {
198 this.foundation.setActionSelected(action, isSelected);
199 };
200 /** Starts the animation on the chip. */
201 MDCChip.prototype.startAnimation = function (animation) {
202 this.foundation.startAnimation(animation);
203 };
204 return MDCChip;
205}(MDCComponent));
206export { MDCChip };
207//# sourceMappingURL=component.js.map
\No newline at end of file