geico_design_kit 0.0.1-security.1 → 15.1.0
Sign up to get free protection for your applications and to get access to all the features.
Potentially problematic release.
This version of geico_design_kit might be problematic. Click here for more details.
- package/.babelrc +5 -0
- package/LICENSE +0 -0
- package/alt.json +33 -0
- package/dist/analytics.js +119 -0
- package/dist/appState.js +56 -0
- package/dist/baseComponent.js +110 -0
- package/dist/components/Accordion.js +312 -0
- package/dist/components/AddressAutoComplete.js +220 -0
- package/dist/components/Alert.js +145 -0
- package/dist/components/BackgroundPattern.js +99 -0
- package/dist/components/BackgroundPatternPortfolio.js +242 -0
- package/dist/components/ButtonSwitch.js +236 -0
- package/dist/components/CardSelections.js +230 -0
- package/dist/components/CommonQuestionsSquares.js +169 -0
- package/dist/components/Confirmation.js +156 -0
- package/dist/components/ConsolidatedSummary.js +489 -0
- package/dist/components/CoverageGraph.js +201 -0
- package/dist/components/CreditCard.js +591 -0
- package/dist/components/CurrencyInput.js +302 -0
- package/dist/components/DatePicker.js +468 -0
- package/dist/components/DockedMessage.js +146 -0
- package/dist/components/DotNavigation.js +200 -0
- package/dist/components/EditComponent.js +128 -0
- package/dist/components/EditableTable.js +113 -0
- package/dist/components/InPageNavigation.js +360 -0
- package/dist/components/Loader.js +232 -0
- package/dist/components/MakePayment.js +361 -0
- package/dist/components/Modal.js +254 -0
- package/dist/components/MoreInfoButton.js +227 -0
- package/dist/components/MultipleSelectBox.js +217 -0
- package/dist/components/NavigationalBox.js +161 -0
- package/dist/components/Navigator.js +294 -0
- package/dist/components/PasswordMeter.js +201 -0
- package/dist/components/PayPlans.js +534 -0
- package/dist/components/SegmentedControl.js +327 -0
- package/dist/components/SortableTable.js +166 -0
- package/dist/components/Tabs.js +1 -0
- package/dist/components/TextAreaCountdown.js +219 -0
- package/dist/components/Timeline.js +498 -0
- package/dist/components/TimelineFilter.js +492 -0
- package/dist/components/ToTopArrow.js +153 -0
- package/dist/components/Tooltip.js +329 -0
- package/dist/components/Upsell.js +168 -0
- package/dist/components/VIN.js +271 -0
- package/dist/components/ValidateForm.js +938 -0
- package/dist/components/ViewMoreLess.js +191 -0
- package/dist/components/ZipCode.js +191 -0
- package/dist/components/portfolio.js +99 -0
- package/dist/geico-design-kit.js +141 -0
- package/dist/global/components.js +98 -0
- package/dist/global/footer.js +26 -0
- package/dist/global/nav.js +1257 -0
- package/dist/services/CharacterTypeService.js +106 -0
- package/dist/services/UserAgentService.js +73 -0
- package/dist/utils.js +79 -0
- package/package.json +29 -3
- package/src/analytics.js +82 -0
- package/src/appState.js +56 -0
- package/src/baseComponent.js +156 -0
- package/src/components/Accordion.js +336 -0
- package/src/components/AddressAutoComplete.js +236 -0
- package/src/components/Alert.js +135 -0
- package/src/components/BackgroundPattern.js +96 -0
- package/src/components/BackgroundPatternPortfolio.js +284 -0
- package/src/components/ButtonSwitch.js +241 -0
- package/src/components/CardSelections.js +240 -0
- package/src/components/CommonQuestionsSquares.js +179 -0
- package/src/components/Confirmation.js +160 -0
- package/src/components/ConsolidatedSummary.js +505 -0
- package/src/components/CoverageGraph.js +203 -0
- package/src/components/CreditCard.js +595 -0
- package/src/components/CurrencyInput.js +321 -0
- package/src/components/DatePicker.js +487 -0
- package/src/components/DockedMessage.js +142 -0
- package/src/components/DotNavigation.js +206 -0
- package/src/components/EditComponent.js +130 -0
- package/src/components/EditableTable.js +106 -0
- package/src/components/InPageNavigation.js +391 -0
- package/src/components/Loader.js +272 -0
- package/src/components/MakePayment.js +397 -0
- package/src/components/Modal.js +279 -0
- package/src/components/MoreInfoButton.js +243 -0
- package/src/components/MultipleSelectBox.js +211 -0
- package/src/components/NavigationalBox.js +163 -0
- package/src/components/Navigator.js +338 -0
- package/src/components/PasswordMeter.js +209 -0
- package/src/components/PayPlans.js +604 -0
- package/src/components/SegmentedControl.js +365 -0
- package/src/components/SortableTable.js +176 -0
- package/src/components/Tabs.js +0 -0
- package/src/components/TextAreaCountdown.js +231 -0
- package/src/components/Timeline.js +532 -0
- package/src/components/TimelineFilter.js +533 -0
- package/src/components/ToTopArrow.js +153 -0
- package/src/components/Tooltip.js +344 -0
- package/src/components/Upsell.js +196 -0
- package/src/components/VIN.js +289 -0
- package/src/components/ValidateForm.js +1030 -0
- package/src/components/ViewMoreLess.js +193 -0
- package/src/components/ZipCode.js +193 -0
- package/src/components/portfolio.js +106 -0
- package/src/geico-design-kit.js +144 -0
- package/src/global/components.js +92 -0
- package/src/global/footer.js +25 -0
- package/src/global/nav.js +1457 -0
- package/src/services/CharacterTypeService.js +107 -0
- package/src/services/UserAgentService.js +59 -0
- package/src/utils.js +82 -0
- package/README.md +0 -5
@@ -0,0 +1,227 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports["default"] = void 0;
|
7
|
+
var utils = _interopRequireWildcard(require("../../src/utils"));
|
8
|
+
var _baseComponent = _interopRequireDefault(require("../../src/baseComponent"));
|
9
|
+
var _UserAgentService = _interopRequireDefault(require("../../src/services/UserAgentService"));
|
10
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
11
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
|
12
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
|
13
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
14
|
+
function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
|
15
|
+
function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
|
16
|
+
function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
|
17
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
18
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
19
|
+
var validateSettings = [{
|
20
|
+
setting: "content",
|
21
|
+
isRequired: true,
|
22
|
+
validate: "type",
|
23
|
+
possibleValues: ["string", "object"],
|
24
|
+
errorMessage: ["GDK MoreInfoButton : Content must be defined and set to a DOM selector or Node"]
|
25
|
+
}];
|
26
|
+
var MoreInfoButton = /*#__PURE__*/function () {
|
27
|
+
/**
|
28
|
+
* These are settings for the instantiation. Refer to the design kit section of this component for JS setting examples.
|
29
|
+
* @param {string|Object} content
|
30
|
+
* A reference to the html More Info Button node
|
31
|
+
*/
|
32
|
+
function MoreInfoButton(options) {
|
33
|
+
_classCallCheck(this, MoreInfoButton);
|
34
|
+
console.log('MoreInfoButton initialized');
|
35
|
+
this._internalVars = {
|
36
|
+
node: null,
|
37
|
+
//used for current node
|
38
|
+
button: null,
|
39
|
+
ul: null,
|
40
|
+
wrapperElementId: "wrapper",
|
41
|
+
wrapper: null
|
42
|
+
};
|
43
|
+
|
44
|
+
//options with defaults set
|
45
|
+
this._defaults = {};
|
46
|
+
|
47
|
+
// Create options by extending defaults with the passed in arugments
|
48
|
+
if (options && _typeof(options) === "object") {
|
49
|
+
this._options = _baseComponent["default"].extendDefaults(this._defaults, options);
|
50
|
+
}
|
51
|
+
|
52
|
+
//if the required options are valid set up the environment
|
53
|
+
if (_baseComponent["default"].validateSettings(this._options, validateSettings)) {
|
54
|
+
this._internalVars.contentType = _baseComponent["default"].getContentType(this);
|
55
|
+
setLocalVars.call(this);
|
56
|
+
setEvents.call(this);
|
57
|
+
this._internalVars.button.setAttribute('aria-expanded', 'false');
|
58
|
+
this._internalVars.button.setAttribute('role', 'button');
|
59
|
+
}
|
60
|
+
}
|
61
|
+
|
62
|
+
/**
|
63
|
+
* destroy()
|
64
|
+
* removes the node from the dom and any events attached
|
65
|
+
*/
|
66
|
+
return _createClass(MoreInfoButton, [{
|
67
|
+
key: "destroy",
|
68
|
+
value: function destroy() {
|
69
|
+
removeEvents.call(this);
|
70
|
+
this._internalVars.node.parentNode.removeChild(this._internalVars.node);
|
71
|
+
|
72
|
+
//a little garbage collection
|
73
|
+
for (var variableKey in this) {
|
74
|
+
if (this.hasOwnProperty(variableKey)) {
|
75
|
+
delete this[variableKey];
|
76
|
+
}
|
77
|
+
}
|
78
|
+
}
|
79
|
+
}]);
|
80
|
+
}(); // Private Methods
|
81
|
+
/**
|
82
|
+
* setEvents()
|
83
|
+
* Sets all the events needed for the component
|
84
|
+
*/
|
85
|
+
function setEvents() {
|
86
|
+
var eventName = _UserAgentService["default"]._clickEventName();
|
87
|
+
this._internalVars.node.addEventListener('mouseleave', this._internalVars.menuHandler);
|
88
|
+
this._internalVars.button.addEventListener("pointerdown", this._internalVars.checkTouchHandler);
|
89
|
+
this._internalVars.button.addEventListener(eventName, this._internalVars.toggleHandler);
|
90
|
+
this._internalVars.button.addEventListener("keydown", this._internalVars.keyHandler);
|
91
|
+
}
|
92
|
+
|
93
|
+
/**
|
94
|
+
* removeEvents()
|
95
|
+
* removes all events from the component
|
96
|
+
*/
|
97
|
+
function removeEvents() {
|
98
|
+
var eventName = _UserAgentService["default"]._clickEventName();
|
99
|
+
this._internalVars.node.removeEventListener('mouseleave', this._internalVars.menuHandler);
|
100
|
+
this._internalVars.button.removeEventListener("pointerdown", this._internalVars.checkTouchHandler);
|
101
|
+
this._internalVars.button.removeEventListener(eventName, this._internalVars.toggleHandler);
|
102
|
+
this._internalVars.button.removeEventListener("keydown", this._internalVars.keyHandler);
|
103
|
+
}
|
104
|
+
function closeMenu() {
|
105
|
+
var _this = this;
|
106
|
+
this._internalVars.ul.classList.remove("options-in");
|
107
|
+
this._internalVars.ul.classList.add("options-out");
|
108
|
+
this._internalVars.button.setAttribute('aria-expanded', 'false');
|
109
|
+
setTimeout(function () {
|
110
|
+
_this._internalVars.ul.style.display = "none";
|
111
|
+
}, 300);
|
112
|
+
}
|
113
|
+
function checkForTouch(el) {
|
114
|
+
console.log(el.pointerType);
|
115
|
+
if (el.pointerType == 'touch') {
|
116
|
+
this._internalVars.node.removeEventListener('mouseleave', this._internalVars.menuHandler);
|
117
|
+
} else {
|
118
|
+
this._internalVars.node.addEventListener('mouseleave', this._internalVars.menuHandler);
|
119
|
+
}
|
120
|
+
}
|
121
|
+
|
122
|
+
/**
|
123
|
+
* toggleOptions()
|
124
|
+
* toggles the options view
|
125
|
+
*/
|
126
|
+
function toggleOptions() {
|
127
|
+
var _this2 = this;
|
128
|
+
if (utils.hasClass(this._internalVars.ul, "options-in")) {
|
129
|
+
this._internalVars.ul.classList.remove("options-in");
|
130
|
+
this._internalVars.ul.classList.add("options-out");
|
131
|
+
this._internalVars.button.setAttribute('aria-expanded', 'false');
|
132
|
+
setTimeout(function () {
|
133
|
+
_this2._internalVars.ul.style.display = "none";
|
134
|
+
}, 300);
|
135
|
+
} else {
|
136
|
+
this._internalVars.ul.style.display = "block";
|
137
|
+
this._internalVars.ul.classList.remove("options-out");
|
138
|
+
this._internalVars.ul.classList.add("options-in");
|
139
|
+
this._internalVars.button.setAttribute('aria-expanded', 'true');
|
140
|
+
checkUlPosistion.call(this);
|
141
|
+
}
|
142
|
+
}
|
143
|
+
function keyOptions(e) {
|
144
|
+
if ((e.type == 'keydown' || e.type == 'keypress') && (e.keyCode || e.which) != 13) {
|
145
|
+
return;
|
146
|
+
} else {
|
147
|
+
if (utils.hasClass(this._internalVars.ul, "options-out")) {
|
148
|
+
this._internalVars.ul.style.display = "block";
|
149
|
+
this._internalVars.ul.classList.remove("options-out");
|
150
|
+
this._internalVars.ul.classList.add("options-in");
|
151
|
+
this._internalVars.button.setAttribute('aria-expanded', 'true');
|
152
|
+
var allA = this._internalVars.ul.querySelectorAll('a');
|
153
|
+
allA[0].focus();
|
154
|
+
checkUlPosistion.call(this);
|
155
|
+
}
|
156
|
+
}
|
157
|
+
}
|
158
|
+
|
159
|
+
/**
|
160
|
+
* toggleOptions()
|
161
|
+
* detect if there is enough space to see the whole menu when opened
|
162
|
+
* if not we need to scroll the body so there is enough space
|
163
|
+
*/
|
164
|
+
function checkUlPosistion() {
|
165
|
+
if (this._internalVars.ul.getBoundingClientRect().top + this._internalVars.ul.offsetHeight > window.innerHeight) {
|
166
|
+
var windowHeight = window.innerHeight;
|
167
|
+
var moreInfoHeight = this._internalVars.ul.getBoundingClientRect().top + this._internalVars.ul.offsetHeight;
|
168
|
+
var neededSpace = moreInfoHeight - windowHeight;
|
169
|
+
var currentScrollOffset = window.scrollY || window.pageYOffset;
|
170
|
+
var newScrollOffset = Math.round(currentScrollOffset + neededSpace);
|
171
|
+
scrollTo(newScrollOffset, 200);
|
172
|
+
}
|
173
|
+
}
|
174
|
+
|
175
|
+
/**
|
176
|
+
* scrollTo()
|
177
|
+
* Scrolls to a specific point
|
178
|
+
* @param to
|
179
|
+
* @param duration
|
180
|
+
*/
|
181
|
+
function scrollTo(to, duration) {
|
182
|
+
var start = document.documentElement.scrollTop || document.body.scrollTop,
|
183
|
+
change = to - start,
|
184
|
+
currentTime = 0,
|
185
|
+
increment = 20;
|
186
|
+
var animateScroll = function animateScroll() {
|
187
|
+
currentTime += increment;
|
188
|
+
var val = easeInOutQuad(currentTime, start, change, duration);
|
189
|
+
document.documentElement.scrollTop = val;
|
190
|
+
document.body.scrollTop = val;
|
191
|
+
if (currentTime < duration) {
|
192
|
+
setTimeout(animateScroll, increment);
|
193
|
+
}
|
194
|
+
};
|
195
|
+
animateScroll();
|
196
|
+
}
|
197
|
+
|
198
|
+
/**
|
199
|
+
* easeInQuad()
|
200
|
+
* Quadratic easing
|
201
|
+
*/
|
202
|
+
function easeInOutQuad(t, b, c, d) {
|
203
|
+
t /= d / 2;
|
204
|
+
if (t < 1) return c / 2 * t * t + b;
|
205
|
+
t--;
|
206
|
+
return -c / 2 * (t * (t - 2) - 1) + b;
|
207
|
+
}
|
208
|
+
|
209
|
+
/**
|
210
|
+
* setLocalVars()
|
211
|
+
* set local vars to the ones passed in options
|
212
|
+
*/
|
213
|
+
function setLocalVars() {
|
214
|
+
if (this._internalVars.contentType === 'string') {
|
215
|
+
this._internalVars.node = document.querySelector(this._options.content);
|
216
|
+
} else if (this._internalVars.contentType === 'domNode') {
|
217
|
+
this._internalVars.node = this._options.content;
|
218
|
+
}
|
219
|
+
this._internalVars.button = this._internalVars.node.querySelector(".more-info-button");
|
220
|
+
this._internalVars.ul = this._internalVars.node.querySelector("ul");
|
221
|
+
this._internalVars.wrapper = document.querySelector("#" + this._internalVars.wrapperElementId);
|
222
|
+
this._internalVars.menuHandler = closeMenu.bind(this);
|
223
|
+
this._internalVars.toggleHandler = toggleOptions.bind(this);
|
224
|
+
this._internalVars.keyHandler = keyOptions.bind(this);
|
225
|
+
this._internalVars.checkTouchHandler = checkForTouch.bind(this);
|
226
|
+
}
|
227
|
+
var _default = exports["default"] = MoreInfoButton;
|
@@ -0,0 +1,217 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports["default"] = void 0;
|
7
|
+
var _baseComponent = _interopRequireDefault(require("../../src/baseComponent"));
|
8
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
9
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
10
|
+
function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
|
11
|
+
function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
|
12
|
+
function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
|
13
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
14
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
15
|
+
var validateSettings = [{
|
16
|
+
setting: "content",
|
17
|
+
isRequired: true,
|
18
|
+
validate: "type",
|
19
|
+
possibleValues: ["string", "object"],
|
20
|
+
errorMessage: ["GDK MultipleSelectBox : Content must be defined and set to a DOM selector or Node"]
|
21
|
+
}, {
|
22
|
+
setting: "config",
|
23
|
+
isRequired: false,
|
24
|
+
validate: "type",
|
25
|
+
possibleValues: ["object"],
|
26
|
+
errorMessage: ["GDK MultipleSelectBox : config may be defined and set as an object"]
|
27
|
+
}, {
|
28
|
+
setting: "initialOptions",
|
29
|
+
isRequired: false,
|
30
|
+
validate: "type",
|
31
|
+
possibleValues: ["object", "string"],
|
32
|
+
errorMessage: ["GDK MultipleSelectBox : initialOptions may be defined and set as an array"]
|
33
|
+
}, {
|
34
|
+
setting: "multiSelectChange",
|
35
|
+
isRequired: false,
|
36
|
+
validate: "type",
|
37
|
+
possibleValues: ["function"],
|
38
|
+
errorMessage: ["GDK MultipleSelectBox : multiSelectChange may be defined and set as a function"]
|
39
|
+
}];
|
40
|
+
|
41
|
+
/**
|
42
|
+
* MultipleSelectBox class
|
43
|
+
*/
|
44
|
+
var MultipleSelectBox = /*#__PURE__*/function () {
|
45
|
+
/**
|
46
|
+
* These are settings for the instantiation. Refer to the design kit section of this component for JS setting examples.
|
47
|
+
* @param {string|Object} content
|
48
|
+
* A reference to the multiple select box node
|
49
|
+
*
|
50
|
+
* @param {Object} [initialOptions]
|
51
|
+
* An array containing strings corresponding to 'value' attributes or numbers referencing the index of the select options
|
52
|
+
*
|
53
|
+
* @param {function} [multiSelectChange]
|
54
|
+
* A callback function that is triggered when an option is added or removed from the Multi-Select Box
|
55
|
+
*/
|
56
|
+
function MultipleSelectBox(options) {
|
57
|
+
_classCallCheck(this, MultipleSelectBox);
|
58
|
+
this._internalVars = {
|
59
|
+
node: null,
|
60
|
+
//used for current node
|
61
|
+
closeBtn: null
|
62
|
+
};
|
63
|
+
|
64
|
+
//options with defaults set
|
65
|
+
this._defaults = {
|
66
|
+
autoShow: false,
|
67
|
+
overlayShouldCloseModal: true,
|
68
|
+
hideCloseButton: false,
|
69
|
+
config: {
|
70
|
+
'.chosen-select': {},
|
71
|
+
'.chosen-select-deselect': {
|
72
|
+
allow_single_deselect: true
|
73
|
+
},
|
74
|
+
'.chosen-select-no-single': {
|
75
|
+
disable_search_threshold: 10
|
76
|
+
},
|
77
|
+
'.chosen-select-no-results': {
|
78
|
+
no_results_text: 'Oops, nothing found!'
|
79
|
+
},
|
80
|
+
'.chosen-select-width': {
|
81
|
+
width: "auto"
|
82
|
+
}
|
83
|
+
}
|
84
|
+
};
|
85
|
+
|
86
|
+
// Create options by extending defaults with the passed in arugments
|
87
|
+
if (options && _typeof(options) === "object") {
|
88
|
+
this._options = _baseComponent["default"].extendDefaults(this._defaults, options);
|
89
|
+
}
|
90
|
+
|
91
|
+
//if the required options are valid set up the environment
|
92
|
+
if (_baseComponent["default"].validateSettings(this._options, validateSettings)) {
|
93
|
+
this._internalVars.contentType = _baseComponent["default"].getContentType(this);
|
94
|
+
setLocalVars.call(this);
|
95
|
+
init.call(this);
|
96
|
+
setEvents.call(this);
|
97
|
+
}
|
98
|
+
}
|
99
|
+
|
100
|
+
//Public Methods
|
101
|
+
|
102
|
+
/**
|
103
|
+
* sets the initial selected options
|
104
|
+
* @param {Object} array Array containing the index or option text of the items to be pre-selected
|
105
|
+
*/
|
106
|
+
return _createClass(MultipleSelectBox, [{
|
107
|
+
key: "setInitialSelectionOptions",
|
108
|
+
value: function setInitialSelectionOptions(array) {
|
109
|
+
setInitialSelections.call(this, array);
|
110
|
+
}
|
111
|
+
|
112
|
+
/**
|
113
|
+
* Returns the current selected options
|
114
|
+
* @returns {Array} containing the selected options
|
115
|
+
*/
|
116
|
+
}, {
|
117
|
+
key: "activeSelections",
|
118
|
+
value: function activeSelections() {
|
119
|
+
return this._internalVars.selectedItems;
|
120
|
+
}
|
121
|
+
|
122
|
+
/**
|
123
|
+
* removes the node from the dom and any events attached
|
124
|
+
*/
|
125
|
+
}, {
|
126
|
+
key: "destroy",
|
127
|
+
value: function destroy() {
|
128
|
+
this._internalVars.node.parentNode.removeChild(this._internalVars.node);
|
129
|
+
|
130
|
+
//a little garbage collection
|
131
|
+
for (var variableKey in this) {
|
132
|
+
if (this.hasOwnProperty(variableKey)) {
|
133
|
+
delete this[variableKey];
|
134
|
+
}
|
135
|
+
}
|
136
|
+
}
|
137
|
+
}]);
|
138
|
+
}();
|
139
|
+
function init() {
|
140
|
+
if (this._options.initialOptions) {
|
141
|
+
var array = this._options.initialOptions;
|
142
|
+
setInitialSelections.call(this, array);
|
143
|
+
}
|
144
|
+
for (var selector in this._options.config) {
|
145
|
+
$(selector).chosen(this._options.config[selector]);
|
146
|
+
}
|
147
|
+
}
|
148
|
+
function setEvents() {
|
149
|
+
$('#' + this._internalVars.node.id).chosen().on('change', updateValues.bind(this));
|
150
|
+
}
|
151
|
+
|
152
|
+
/**
|
153
|
+
* Sets the initial values pragmatically
|
154
|
+
* @param {array} array Array containing numbers or strings referencing options to be set by default
|
155
|
+
*/
|
156
|
+
function setInitialSelections(array) {
|
157
|
+
var _this = this;
|
158
|
+
var initialValues = [];
|
159
|
+
Array.prototype.forEach.call(array, function (item) {
|
160
|
+
if (typeof item === "string") {
|
161
|
+
Array.prototype.forEach.call(_this._internalVars.node.options, function (ele) {
|
162
|
+
if (item === ele.value) {
|
163
|
+
initialValues.push(item);
|
164
|
+
}
|
165
|
+
});
|
166
|
+
} else if (typeof item === "number") {
|
167
|
+
if (item >= 0 && item <= _this._internalVars.node.options.length) {
|
168
|
+
if (item - Math.floor(item) === 0) {
|
169
|
+
var value = _this._internalVars.node.options[item].value;
|
170
|
+
initialValues.push(value);
|
171
|
+
}
|
172
|
+
}
|
173
|
+
}
|
174
|
+
});
|
175
|
+
$('#' + this._internalVars.node.id).val(initialValues).trigger('chosen:updated');
|
176
|
+
updateValues.call(this);
|
177
|
+
}
|
178
|
+
|
179
|
+
/**
|
180
|
+
* creates an array of the chosen values
|
181
|
+
*/
|
182
|
+
function updateValues() {
|
183
|
+
var _this2 = this;
|
184
|
+
var selectBox = $('#' + this._internalVars.node.id),
|
185
|
+
empty;
|
186
|
+
this._internalVars.selectedItems = [];
|
187
|
+
if (selectBox.val() !== null) {
|
188
|
+
Array.prototype.forEach.call(selectBox.val(), function (element) {
|
189
|
+
Array.prototype.forEach.call(_this2._internalVars.node.options, function (el) {
|
190
|
+
if (element === el.value) {
|
191
|
+
_this2._internalVars.selectedItems.push(el);
|
192
|
+
}
|
193
|
+
});
|
194
|
+
});
|
195
|
+
empty = false;
|
196
|
+
} else {
|
197
|
+
empty = true;
|
198
|
+
}
|
199
|
+
if (this._options.multiSelectChange) {
|
200
|
+
this._options.multiSelectChange(this._internalVars.selectedItems, empty);
|
201
|
+
}
|
202
|
+
}
|
203
|
+
|
204
|
+
/**
|
205
|
+
* setLocalVars()
|
206
|
+
* set all the local vars to passed in options
|
207
|
+
*/
|
208
|
+
function setLocalVars() {
|
209
|
+
//determine the type of content passed in
|
210
|
+
if (this._internalVars.contentType === 'string') {
|
211
|
+
this._internalVars.node = document.querySelector(this._options.content);
|
212
|
+
} else if (this._internalVars.contentType === 'domNode') {
|
213
|
+
this._internalVars.node = this._options.content;
|
214
|
+
}
|
215
|
+
this._internalVars.nodeParent = this._internalVars.node.parentNode;
|
216
|
+
}
|
217
|
+
var _default = exports["default"] = MultipleSelectBox;
|
@@ -0,0 +1,161 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports["default"] = void 0;
|
7
|
+
var _appState = _interopRequireDefault(require("../../src/appState"));
|
8
|
+
var _baseComponent = _interopRequireDefault(require("../../src/baseComponent"));
|
9
|
+
var _UserAgentService = _interopRequireDefault(require("../../src/services/UserAgentService"));
|
10
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
11
|
+
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
|
12
|
+
function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
|
13
|
+
function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
|
14
|
+
function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
|
15
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
|
16
|
+
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
17
|
+
var validateSettings = [{
|
18
|
+
setting: "content",
|
19
|
+
isRequired: true,
|
20
|
+
validate: "type",
|
21
|
+
possibleValues: ["string", "object"],
|
22
|
+
errorMessage: ["GDK NavigationalBox : Content must be defined and set to a DOM selector or Node"]
|
23
|
+
}, {
|
24
|
+
setting: "urlSetting",
|
25
|
+
isRequired: true,
|
26
|
+
validate: "type",
|
27
|
+
possibleValues: ["string"],
|
28
|
+
errorMessage: ["GDK NavigationalBox : urlSetting must be defined and set to a URL string"]
|
29
|
+
}, {
|
30
|
+
setting: "targetSetting",
|
31
|
+
isRequired: false,
|
32
|
+
validate: "value",
|
33
|
+
possibleValues: ["_self", "_blank"],
|
34
|
+
errorMessage: ["GDK NavigationalBox : targetSetting must be defined and set to '_self' or '_blank'"]
|
35
|
+
}];
|
36
|
+
var NavigationalBox = /*#__PURE__*/function () {
|
37
|
+
/**
|
38
|
+
* Refer to the design kit section of this component for JS examples and setting details.
|
39
|
+
* @param {string, Object} content
|
40
|
+
* A reference to the navigational box
|
41
|
+
*
|
42
|
+
* @param {string} urlSetting
|
43
|
+
* Used to set the initial URL for the navigational box
|
44
|
+
*
|
45
|
+
* @param {string} [targetSetting="_self"]
|
46
|
+
* Used to set URL target to open in same page or in a new window/tab
|
47
|
+
*/
|
48
|
+
function NavigationalBox(options) {
|
49
|
+
_classCallCheck(this, NavigationalBox);
|
50
|
+
this._internalVars = {
|
51
|
+
node: null //used for content item
|
52
|
+
};
|
53
|
+
|
54
|
+
//options with defaults set
|
55
|
+
this._defaults = {
|
56
|
+
targetSetting: "_self"
|
57
|
+
};
|
58
|
+
|
59
|
+
// Create options by extending defaults with the passed in arugments
|
60
|
+
if (options && _typeof(options) === "object") {
|
61
|
+
this._options = _baseComponent["default"].extendDefaults(this._defaults, options);
|
62
|
+
}
|
63
|
+
|
64
|
+
//if the required options are valid set up the environment
|
65
|
+
if (_baseComponent["default"].validateSettings(this._options, validateSettings)) {
|
66
|
+
this._internalVars.contentType = _baseComponent["default"].getContentType(this);
|
67
|
+
setLocalVars.call(this);
|
68
|
+
setEvents.call(this);
|
69
|
+
if (!this._internalVars.node.getAttribute('tabindex')) this._internalVars.node.setAttribute('tabindex', '0');
|
70
|
+
this._internalVars.node.setAttribute('role', 'link');
|
71
|
+
}
|
72
|
+
}
|
73
|
+
|
74
|
+
//Public Methods
|
75
|
+
/**
|
76
|
+
* @param {string} [url]
|
77
|
+
* url is new URL string to set to component
|
78
|
+
*/
|
79
|
+
return _createClass(NavigationalBox, [{
|
80
|
+
key: "setURL",
|
81
|
+
value: function setURL(url) {
|
82
|
+
this._options.urlSetting = url;
|
83
|
+
}
|
84
|
+
|
85
|
+
/**
|
86
|
+
* @param {string} [target="_self"]
|
87
|
+
* target is new target string to set to component with '_self' or '_blank'
|
88
|
+
*/
|
89
|
+
}, {
|
90
|
+
key: "setTarget",
|
91
|
+
value: function setTarget(target) {
|
92
|
+
this._options.targetSetting = target;
|
93
|
+
}
|
94
|
+
|
95
|
+
/**
|
96
|
+
* destroy()
|
97
|
+
* removes the node from the dom and any events attached
|
98
|
+
*/
|
99
|
+
}, {
|
100
|
+
key: "destroy",
|
101
|
+
value: function destroy() {
|
102
|
+
removeEvents.call(this);
|
103
|
+
this._internalVars.node.parentNode.removeChild(this._internalVars.node);
|
104
|
+
|
105
|
+
//a little garbage collection
|
106
|
+
for (var variableKey in this) {
|
107
|
+
if (this.hasOwnProperty(variableKey)) {
|
108
|
+
delete this[variableKey];
|
109
|
+
}
|
110
|
+
}
|
111
|
+
}
|
112
|
+
}]);
|
113
|
+
}(); // Private Methods
|
114
|
+
/**
|
115
|
+
* setEvents()
|
116
|
+
* Sets all the events needed for the component
|
117
|
+
*/
|
118
|
+
function setEvents() {
|
119
|
+
var eventName = _UserAgentService["default"]._clickEventName();
|
120
|
+
if (_appState["default"].mode == 'mobile' && _appState["default"].isTouchDevice === true && screen.width <= 480) {
|
121
|
+
this._internalVars.node.addEventListener("click", this._internalVars.handler);
|
122
|
+
} else {
|
123
|
+
this._internalVars.node.addEventListener(eventName, this._internalVars.handler);
|
124
|
+
this._internalVars.node.addEventListener("keyup", this._internalVars.handler);
|
125
|
+
}
|
126
|
+
}
|
127
|
+
|
128
|
+
/**
|
129
|
+
* removeEvents()
|
130
|
+
* removes all events from the component
|
131
|
+
*/
|
132
|
+
function removeEvents() {
|
133
|
+
var eventName = _UserAgentService["default"]._clickEventName();
|
134
|
+
this._internalVars.node.removeEventListener(eventName, this._internalVars.handler);
|
135
|
+
this._internalVars.node.removeEventListener("keyup", this._internalVars.handler);
|
136
|
+
}
|
137
|
+
|
138
|
+
/**
|
139
|
+
* setLocalVars()
|
140
|
+
* set all the local vars to passed in options
|
141
|
+
*/
|
142
|
+
function setLocalVars() {
|
143
|
+
//determine the type of content passed in
|
144
|
+
if (this._internalVars.contentType === 'string') {
|
145
|
+
this._internalVars.node = document.querySelector(this._options.content);
|
146
|
+
} else if (this._internalVars.contentType === 'domNode') {
|
147
|
+
this._internalVars.node = this._options.content;
|
148
|
+
}
|
149
|
+
this._internalVars.handler = redirectionToURL.bind(this);
|
150
|
+
}
|
151
|
+
function redirectionToURL(el) {
|
152
|
+
if (el.type == 'keypress' || el.type == 'keyup' && (el.keyCode || el.which) != 13) {
|
153
|
+
return;
|
154
|
+
}
|
155
|
+
if (_appState["default"].mode == 'desktop') {
|
156
|
+
window.open(this._options.urlSetting, this._options.targetSetting);
|
157
|
+
} else if (_appState["default"].mode == 'mobile') {
|
158
|
+
window.open(this._options.urlSetting, '_self');
|
159
|
+
}
|
160
|
+
}
|
161
|
+
var _default = exports["default"] = NavigationalBox;
|