cleek 1.1.4 → 1.1.8

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.
package/dist/cleek.ssr.js DELETED
@@ -1,283 +0,0 @@
1
- 'use strict';var vue=require('vue');function _slicedToArray(arr, i) {
2
- return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
3
- }
4
-
5
- function _arrayWithHoles(arr) {
6
- if (Array.isArray(arr)) return arr;
7
- }
8
-
9
- function _iterableToArrayLimit(arr, i) {
10
- var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
11
-
12
- if (_i == null) return;
13
- var _arr = [];
14
- var _n = true;
15
- var _d = false;
16
-
17
- var _s, _e;
18
-
19
- try {
20
- for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
21
- _arr.push(_s.value);
22
-
23
- if (i && _arr.length === i) break;
24
- }
25
- } catch (err) {
26
- _d = true;
27
- _e = err;
28
- } finally {
29
- try {
30
- if (!_n && _i["return"] != null) _i["return"]();
31
- } finally {
32
- if (_d) throw _e;
33
- }
34
- }
35
-
36
- return _arr;
37
- }
38
-
39
- function _unsupportedIterableToArray(o, minLen) {
40
- if (!o) return;
41
- if (typeof o === "string") return _arrayLikeToArray(o, minLen);
42
- var n = Object.prototype.toString.call(o).slice(8, -1);
43
- if (n === "Object" && o.constructor) n = o.constructor.name;
44
- if (n === "Map" || n === "Set") return Array.from(o);
45
- if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
46
- }
47
-
48
- function _arrayLikeToArray(arr, len) {
49
- if (len == null || len > arr.length) len = arr.length;
50
-
51
- for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
52
-
53
- return arr2;
54
- }
55
-
56
- function _nonIterableRest() {
57
- throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
58
- }var script$1 = /*#__PURE__*/vue.defineComponent({
59
- name: 'CleekSample',
60
- // vue component name
61
- data: function data() {
62
- return {
63
- counter: 5,
64
- initCounter: 5,
65
- message: {
66
- action: null,
67
- amount: null
68
- }
69
- };
70
- },
71
- computed: {
72
- changedBy: function changedBy() {
73
- var _ref = this,
74
- message = _ref.message;
75
-
76
- if (!message.action) return 'initialized';
77
- return "".concat(message.action, " ").concat(message.amount || '').trim();
78
- }
79
- },
80
- methods: {
81
- increment: function increment(arg) {
82
- var amount = typeof arg !== 'number' ? 1 : arg;
83
- this.counter += amount;
84
- this.message.action = 'incremented by';
85
- this.message.amount = amount;
86
- },
87
- decrement: function decrement(arg) {
88
- var amount = typeof arg !== 'number' ? 1 : arg;
89
- this.counter -= amount;
90
- this.message.action = 'decremented by';
91
- this.message.amount = amount;
92
- },
93
- reset: function reset() {
94
- this.counter = this.initCounter;
95
- this.message.action = 'reset';
96
- this.message.amount = null;
97
- }
98
- }
99
- });var _hoisted_1$1 = {
100
- class: "cleek-sample"
101
- };
102
-
103
- var _hoisted_2 = /*#__PURE__*/vue.createTextVNode(".");
104
-
105
- function render$1(_ctx, _cache, $props, $setup, $data, $options) {
106
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$1, [vue.createElementVNode("p", null, [vue.createTextVNode("The counter was " + vue.toDisplayString(_ctx.changedBy) + " to ", 1), vue.createElementVNode("b", null, vue.toDisplayString(_ctx.counter), 1), _hoisted_2]), vue.createElementVNode("button", {
107
- onClick: _cache[0] || (_cache[0] = function () {
108
- return _ctx.increment && _ctx.increment.apply(_ctx, arguments);
109
- })
110
- }, " Click +1 "), vue.createElementVNode("button", {
111
- onClick: _cache[1] || (_cache[1] = function () {
112
- return _ctx.decrement && _ctx.decrement.apply(_ctx, arguments);
113
- })
114
- }, " Click -1 "), vue.createElementVNode("button", {
115
- onClick: _cache[2] || (_cache[2] = function ($event) {
116
- return _ctx.increment(5);
117
- })
118
- }, " Click +5 "), vue.createElementVNode("button", {
119
- onClick: _cache[3] || (_cache[3] = function ($event) {
120
- return _ctx.decrement(5);
121
- })
122
- }, " Click -5 "), vue.createElementVNode("button", {
123
- onClick: _cache[4] || (_cache[4] = function () {
124
- return _ctx.reset && _ctx.reset.apply(_ctx, arguments);
125
- })
126
- }, " Reset ")]);
127
- }function styleInject(css, ref) {
128
- if ( ref === void 0 ) ref = {};
129
- var insertAt = ref.insertAt;
130
-
131
- if (!css || typeof document === 'undefined') { return; }
132
-
133
- var head = document.head || document.getElementsByTagName('head')[0];
134
- var style = document.createElement('style');
135
- style.type = 'text/css';
136
-
137
- if (insertAt === 'top') {
138
- if (head.firstChild) {
139
- head.insertBefore(style, head.firstChild);
140
- } else {
141
- head.appendChild(style);
142
- }
143
- } else {
144
- head.appendChild(style);
145
- }
146
-
147
- if (style.styleSheet) {
148
- style.styleSheet.cssText = css;
149
- } else {
150
- style.appendChild(document.createTextNode(css));
151
- }
152
- }var css_248z$1 = "\n.cleek-sample[data-v-0917b8aa] {\n display: block;\n width: 400px;\n margin: 25px auto;\n border: 1px solid #ccc;\n background: #eaeaea;\n text-align: center;\n padding: 25px;\n}\n.cleek-sample p[data-v-0917b8aa] {\n margin: 0 0 1em;\n}\n";
153
- styleInject(css_248z$1);script$1.render = render$1;
154
- script$1.__scopeId = "data-v-0917b8aa";var functions = {
155
- getGroupClass: function getGroupClass() {
156
- var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
157
- _ref$group = _ref.group,
158
- group = _ref$group === void 0 ? '' : _ref$group,
159
- _ref$groupVertical = _ref.groupVertical,
160
- groupVertical = _ref$groupVertical === void 0 ? '' : _ref$groupVertical,
161
- _ref$groupBreak = _ref.groupBreak,
162
- groupBreak = _ref$groupBreak === void 0 ? '' : _ref$groupBreak;
163
-
164
- var _screenSize = '';
165
- if (groupBreak && groupBreak === _screenSize) return [];
166
- var classList = []; // group
167
-
168
- if (group) classList.push("ck-component__group--".concat(group)); // groupVertical
169
-
170
- if (groupVertical) classList.push("ck-component__group-vertical--".concat(groupVertical));
171
- return classList;
172
- }
173
- };var script = {
174
- props: {
175
- type: {
176
- type: String,
177
- default: ''
178
- },
179
- // outlined || filled
180
- color: {
181
- type: String,
182
- default: ''
183
- },
184
- // icon
185
- icon: {
186
- type: [String, Array],
187
- default: ''
188
- },
189
- 'icon-package': {
190
- type: String,
191
- default: ''
192
- },
193
- 'icon-right': {
194
- type: String,
195
- default: ''
196
- },
197
- // label
198
- label: {
199
- type: String,
200
- default: ''
201
- },
202
- 'label-align': {
203
- type: String,
204
- default: ''
205
- },
206
- // group
207
- group: {
208
- type: String,
209
- default: ''
210
- },
211
- groupBreak: {
212
- type: String,
213
- default: 's'
214
- },
215
- groupVertical: {
216
- type: String,
217
- default: ''
218
- }
219
- },
220
- computed: {
221
- computedClass: function computedClass() {
222
- var classList = []; // group
223
-
224
- classList.push(functions.getGroupClass(this)); // color
225
-
226
- if (this.color) {
227
- if (this.type === 'filled') {
228
- classList.push("ck-component__bg-color--".concat(this.color));
229
- } else {
230
- classList.push("ck-component__border-color--".concat(this.color));
231
- }
232
- } // // size
233
- // if (this.size) classList.push(`rs-component-size__${this.size}`);
234
-
235
-
236
- return classList;
237
- }
238
- } // computed
239
-
240
- }; // export default
241
- var _hoisted_1 = {
242
- class: "ck-button"
243
- };
244
- function render(_ctx, _cache, $props, $setup, $data, $options) {
245
- return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [vue.createElementVNode("button", {
246
- class: vue.normalizeClass($options.computedClass),
247
- onClick: _cache[0] || (_cache[0] = function ($event) {
248
- return _ctx.$emit('click', $event);
249
- })
250
- }, [vue.renderSlot(_ctx.$slots, "default")], 2)]);
251
- }var css_248z = "\n@import url('../../dist/styles/ck-button.css');\r\n";
252
- styleInject(css_248z);script.render = render;
253
- script.__scopeId = "data-v-e00f6d2c";/* eslint-disable import/prefer-default-export */
254
- // export { default as CkInputText } from './ck-input-text.vue';
255
- // export { default as CkLabel } from './ck-label.vue';
256
- // export { default as CkTextarea } from './ck-textarea.vue';
257
- // export { default as CkSelect } from './ck-select.vue';
258
- var components$1=/*#__PURE__*/Object.freeze({__proto__:null,CleekSample:script$1,CkButton:script});var install = function installCleek(app, options) {
259
- console.log('arranco paquete');
260
- console.log('options', options); // vue components
261
-
262
- Object.entries(components$1).forEach(function (_ref) {
263
- var _ref2 = _slicedToArray(_ref, 2),
264
- componentName = _ref2[0],
265
- component = _ref2[1];
266
-
267
- app.component(componentName, component);
268
- });
269
- }; // Create module definition for Vue.use()
270
- var components=/*#__PURE__*/Object.freeze({__proto__:null,'default':install,CleekSample:script$1,CkButton:script});// only expose one global var, with component exports exposed as properties of
271
- // that global var (eg. plugin.component)
272
-
273
- Object.entries(components).forEach(function (_ref) {
274
- var _ref2 = _slicedToArray(_ref, 2),
275
- componentName = _ref2[0],
276
- component = _ref2[1];
277
-
278
- if (componentName !== 'default') {
279
- var key = componentName;
280
- var val = component;
281
- install[key] = val;
282
- }
283
- });module.exports=install;
@@ -1,132 +0,0 @@
1
- .ck-button {
2
- display: inline-flex;
3
- }
4
- .ck-button > button {
5
- width: 100%;
6
- font-family: inherit;
7
- cursor: pointer;
8
- padding: 0.7rem 1.4rem;
9
- font-size: 1rem;
10
- border-radius: 0.4rem;
11
- background-color: #fff;
12
- border: 1px solid #000;
13
- color: #000;
14
- display: inline-block;
15
- min-height: 40px;
16
- }
17
- .ck-button > button > .ck-button--icon-left {
18
- padding-right: 0.5rem;
19
- }
20
- .ck-button > button > .ck-button--icon-right {
21
- padding-left: 0.5rem;
22
- }
23
- .ck-component__group--left {
24
- border-top-right-radius: 0 !important;
25
- border-bottom-right-radius: 0 !important;
26
- border-right: 0 !important;
27
- }
28
- .ck-component__group--right {
29
- border-top-left-radius: 0 !important;
30
- border-bottom-left-radius: 0 !important;
31
- }
32
- .ck-component__group--center {
33
- border-radius: 0 !important;
34
- border-right: 0 !important;
35
- }
36
- .ck-component__group-vertical--top {
37
- border-bottom: 0 !important;
38
- border-bottom-left-radius: 0 !important;
39
- border-bottom-right-radius: 0 !important;
40
- }
41
- .ck-component__group-vertical--bottom {
42
- border-top-left-radius: 0 !important;
43
- border-top-right-radius: 0 !important;
44
- }
45
- .ck-component__group-vertical--center {
46
- border-radius: 0 !important;
47
- border-bottom: 0 !important;
48
- }
49
- .ck-component__bg-color--primary {
50
- background-color: #000 !important;
51
- border-color: #000 !important;
52
- color: #fff !important;
53
- }
54
- .ck-component__bg-color--primary-light {
55
- background-color: rgba(0,0,0,0.15) !important;
56
- border-color: rgba(0,0,0,0.15) !important;
57
- color: #000 !important;
58
- font-weight: 600 !important;
59
- }
60
- .ck-component__bg-color--secondary {
61
- background-color: #999 !important;
62
- border-color: #999 !important;
63
- color: #fff !important;
64
- }
65
- .ck-component__bg-color--secondary-light {
66
- background-color: rgba(153,153,153,0.15) !important;
67
- border-color: rgba(153,153,153,0.15) !important;
68
- color: #999 !important;
69
- font-weight: 600 !important;
70
- }
71
- .ck-component__bg-color--success {
72
- background-color: #95cd41 !important;
73
- border-color: #95cd41 !important;
74
- color: rgba(255,255,255,0.9) !important;
75
- }
76
- .ck-component__bg-color--danger {
77
- background-color: #ff5959 !important;
78
- border-color: #ff5959 !important;
79
- color: rgba(255,255,255,0.9) !important;
80
- }
81
- .ck-component__bg-color--warning {
82
- background-color: #ffbd35 !important;
83
- border-color: #ffbd35 !important;
84
- color: rgba(255,255,255,0.9) !important;
85
- }
86
- .ck-component__bg-color--dark {
87
- background-color: #1e1e1e !important;
88
- border-color: #1e1e1e !important;
89
- color: rgba(255,255,255,0.9) !important;
90
- }
91
- .ck-component__bg-color--light {
92
- background-color: #f0f0f0 !important;
93
- border-color: #f0f0f0 !important;
94
- }
95
- .ck-component__border-color--primary {
96
- color: #000 !important;
97
- border-color: #000 !important;
98
- }
99
- .ck-component__border-color--primary-light {
100
- color: rgba(0,0,0,0.15) !important;
101
- border-color: rgba(0,0,0,0.15) !important;
102
- font-weight: 600 !important;
103
- }
104
- .ck-component__border-color--secondary {
105
- color: #999 !important;
106
- border-color: #999 !important;
107
- }
108
- .ck-component__border-color--secondary-light {
109
- color: rgba(153,153,153,0.15) !important;
110
- border-color: rgba(153,153,153,0.15) !important;
111
- font-weight: 600 !important;
112
- }
113
- .ck-component__border-color--success {
114
- color: #95cd41 !important;
115
- border-color: #95cd41 !important;
116
- }
117
- .ck-component__border-color--danger {
118
- color: #ff5959 !important;
119
- border-color: #ff5959 !important;
120
- }
121
- .ck-component__border-color--warning {
122
- color: #ffbd35 !important;
123
- border-color: #ffbd35 !important;
124
- }
125
- .ck-component__border-color--dark {
126
- color: #1e1e1e !important;
127
- border-color: #1e1e1e !important;
128
- }
129
- .ck-component__border-color--light {
130
- color: #f0f0f0 !important;
131
- border-color: #f0f0f0 !important;
132
- }
@@ -1,110 +0,0 @@
1
- .ck-component__group--left {
2
- border-top-right-radius: 0 !important;
3
- border-bottom-right-radius: 0 !important;
4
- border-right: 0 !important;
5
- }
6
- .ck-component__group--right {
7
- border-top-left-radius: 0 !important;
8
- border-bottom-left-radius: 0 !important;
9
- }
10
- .ck-component__group--center {
11
- border-radius: 0 !important;
12
- border-right: 0 !important;
13
- }
14
- .ck-component__group-vertical--top {
15
- border-bottom: 0 !important;
16
- border-bottom-left-radius: 0 !important;
17
- border-bottom-right-radius: 0 !important;
18
- }
19
- .ck-component__group-vertical--bottom {
20
- border-top-left-radius: 0 !important;
21
- border-top-right-radius: 0 !important;
22
- }
23
- .ck-component__group-vertical--center {
24
- border-radius: 0 !important;
25
- border-bottom: 0 !important;
26
- }
27
- .ck-component__bg-color--primary {
28
- background-color: #000 !important;
29
- border-color: #000 !important;
30
- color: #fff !important;
31
- }
32
- .ck-component__bg-color--primary-light {
33
- background-color: rgba(0,0,0,0.15) !important;
34
- border-color: rgba(0,0,0,0.15) !important;
35
- color: #000 !important;
36
- font-weight: 600 !important;
37
- }
38
- .ck-component__bg-color--secondary {
39
- background-color: #999 !important;
40
- border-color: #999 !important;
41
- color: #fff !important;
42
- }
43
- .ck-component__bg-color--secondary-light {
44
- background-color: rgba(153,153,153,0.15) !important;
45
- border-color: rgba(153,153,153,0.15) !important;
46
- color: #999 !important;
47
- font-weight: 600 !important;
48
- }
49
- .ck-component__bg-color--success {
50
- background-color: #95cd41 !important;
51
- border-color: #95cd41 !important;
52
- color: rgba(255,255,255,0.9) !important;
53
- }
54
- .ck-component__bg-color--danger {
55
- background-color: #ff5959 !important;
56
- border-color: #ff5959 !important;
57
- color: rgba(255,255,255,0.9) !important;
58
- }
59
- .ck-component__bg-color--warning {
60
- background-color: #ffbd35 !important;
61
- border-color: #ffbd35 !important;
62
- color: rgba(255,255,255,0.9) !important;
63
- }
64
- .ck-component__bg-color--dark {
65
- background-color: #1e1e1e !important;
66
- border-color: #1e1e1e !important;
67
- color: rgba(255,255,255,0.9) !important;
68
- }
69
- .ck-component__bg-color--light {
70
- background-color: #f0f0f0 !important;
71
- border-color: #f0f0f0 !important;
72
- }
73
- .ck-component__border-color--primary {
74
- color: #000 !important;
75
- border-color: #000 !important;
76
- }
77
- .ck-component__border-color--primary-light {
78
- color: rgba(0,0,0,0.15) !important;
79
- border-color: rgba(0,0,0,0.15) !important;
80
- font-weight: 600 !important;
81
- }
82
- .ck-component__border-color--secondary {
83
- color: #999 !important;
84
- border-color: #999 !important;
85
- }
86
- .ck-component__border-color--secondary-light {
87
- color: rgba(153,153,153,0.15) !important;
88
- border-color: rgba(153,153,153,0.15) !important;
89
- font-weight: 600 !important;
90
- }
91
- .ck-component__border-color--success {
92
- color: #95cd41 !important;
93
- border-color: #95cd41 !important;
94
- }
95
- .ck-component__border-color--danger {
96
- color: #ff5959 !important;
97
- border-color: #ff5959 !important;
98
- }
99
- .ck-component__border-color--warning {
100
- color: #ffbd35 !important;
101
- border-color: #ffbd35 !important;
102
- }
103
- .ck-component__border-color--dark {
104
- color: #1e1e1e !important;
105
- border-color: #1e1e1e !important;
106
- }
107
- .ck-component__border-color--light {
108
- color: #f0f0f0 !important;
109
- border-color: #f0f0f0 !important;
110
- }
File without changes
@@ -1,3 +0,0 @@
1
- * {
2
- background-color: #00f;
3
- }
@@ -1,4 +0,0 @@
1
- import { Plugin } from 'vue';
2
- declare const install: Exclude<Plugin['install'], undefined>;
3
- export default install;
4
- export * from "./lib-components/index";
@@ -1,16 +0,0 @@
1
- interface SampleData {
2
- counter: number;
3
- initCounter: number;
4
- message: {
5
- action: string | null;
6
- amount: number | null;
7
- };
8
- }
9
- declare const _default: import("vue").DefineComponent<{}, {}, SampleData, {
10
- changedBy(): string;
11
- }, {
12
- increment(arg: Event | number): void;
13
- decrement(arg: Event | number): void;
14
- reset(): void;
15
- }, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{} & {} & {}>, {}>;
16
- export default _default;
@@ -1,8 +0,0 @@
1
- declare const _default: {
2
- getGroupClass({ group, groupVertical, groupBreak }?: {
3
- group?: string | undefined;
4
- groupVertical?: string | undefined;
5
- groupBreak?: string | undefined;
6
- }): string[];
7
- };
8
- export default _default;
@@ -1,2 +0,0 @@
1
- export { default as CleekSample } from './cleek-sample.vue';
2
- export { default as CkButton } from './ck-button.vue';
@@ -1,66 +0,0 @@
1
- <template lang="pug">
2
- .ck-button
3
- //- ck-label(v-if="label" label-align="labelAlign") {{ label }}
4
- button(
5
- :class="computedClass"
6
- @click="$emit('click', $event)"
7
- )
8
- //- icon left
9
- //- ck-icon.ck-button--icon-left(
10
- //- v-if="icon"
11
- //- :icon="icon"
12
- //- :icon-package="iconPackage"
13
- //- )
14
- //- slot
15
- slot
16
- //- icon right
17
- //- ck-icon.ck-button--icon-right(
18
- //- v-if="iconRight"
19
- //- :icon="iconRight"
20
- //- :icon-package="iconPackage"
21
- //- )
22
- </template>
23
-
24
- <script>
25
- import functions from './functions.ts';
26
-
27
- export default {
28
- props: {
29
- type: { type: String, default: '' }, // outlined || filled
30
- color: { type: String, default: '' },
31
- // icon
32
- icon: { type: [String, Array], default: '' },
33
- 'icon-package': { type: String, default: '' },
34
- 'icon-right': { type: String, default: '' },
35
- // label
36
- label: { type: String, default: '' },
37
- 'label-align': { type: String, default: '' },
38
- // group
39
- group: { type: String, default: '' },
40
- groupBreak: { type: String, default: 's' },
41
- groupVertical: { type: String, default: '' },
42
- },
43
- computed: {
44
- computedClass() {
45
- const classList = [];
46
- // group
47
- classList.push(functions.getGroupClass(this));
48
- // color
49
- if (this.color) {
50
- if (this.type === 'filled') {
51
- classList.push(`ck-component__bg-color--${this.color}`);
52
- } else {
53
- classList.push(`ck-component__border-color--${this.color}`);
54
- }
55
- }
56
- // // size
57
- // if (this.size) classList.push(`rs-component-size__${this.size}`);
58
- return classList;
59
- },
60
- }, // computed
61
- }; // export default
62
- </script>
63
-
64
- <style scoped>
65
- @import url('../../dist/styles/ck-button.css');
66
- </style>
@@ -1,61 +0,0 @@
1
- <template lang="pug">
2
- .ck-icon
3
- font-awesome-icon(
4
- v-if="computedIconPackage === 'font-awesome'"
5
- :icon="icon"
6
- :size="size"
7
- :rotation="rotation"
8
- :flip="flip"
9
- :pull="pull"
10
- :spin="spin"
11
- :pulse="pulse"
12
- :inverse="inverse"
13
- :fixed-width="fixedWidth"
14
- :swap-opacity="swapOpacity"
15
- )
16
- </template>
17
-
18
- <script>
19
- import { library } from '@fortawesome/fontawesome-svg-core';
20
- import { fas } from '@fortawesome/free-solid-svg-icons';
21
- import { far } from '@fortawesome/free-regular-svg-icons';
22
- import { fab } from '@fortawesome/free-brands-svg-icons';
23
- import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
24
-
25
- export default {
26
- components: {
27
- FontAwesomeIcon,
28
- },
29
- created() {
30
- library.add(fas);
31
- library.add(far);
32
- library.add(fab);
33
- },
34
- props: {
35
- icon: { type: [String, Array], default: '' },
36
- 'icon-package': { type: String, default: '' },
37
- size: { type: String, default: null }, // xs || lg || 6x
38
- rotation: { type: String, default: null }, // 90 || 180 || 270
39
- flip: { type: String, default: null }, // horizontal || vertical || both
40
- pull: { type: String, default: null }, // left || right
41
- spin: { type: Boolean, default: false }, // true actives animation
42
- pulse: { type: Boolean, default: false }, // true actives animation
43
- inverse: { type: Boolean, default: false },
44
- 'fixed-width': { type: Boolean, default: false },
45
- 'swap-opacity': { type: Boolean, default: false },
46
- },
47
- computed: {
48
- computedIconPackage() {
49
- const defaultPackage = 'font-awesome';
50
- if (this.iconPackage === '') return defaultPackage;
51
- if (this.iconPackage === 'feather') return this.iconPackage;
52
- return defaultPackage;
53
- },
54
- }, // computed
55
- }; // export default
56
- </script>
57
-
58
- <style lang="stylus" scoped>
59
- .ck-icon
60
- display inline-flex
61
- </style>