lookbook 1.0.3 → 1.0.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.
- checksums.yaml +4 -4
- data/app/assets/lookbook/js/app.js +1 -0
- data/app/assets/lookbook/js/lib/socket.js +9 -5
- data/app/components/lookbook/base_component.rb +10 -2
- data/app/components/lookbook/copy_button/component.rb +1 -1
- data/app/components/lookbook/dimensions_display/component.rb +1 -4
- data/app/components/lookbook/embed/component.rb +1 -1
- data/app/components/lookbook/icon/component.rb +1 -5
- data/app/components/lookbook/nav/component.html.erb +1 -1
- data/app/components/lookbook/nav/item/component.rb +2 -2
- data/app/components/lookbook/params_editor/field/component.rb +1 -1
- data/app/components/lookbook/tabs/component.js +2 -2
- data/app/controllers/lookbook/application_controller.rb +10 -1
- data/app/controllers/lookbook/pages_controller.rb +0 -1
- data/app/controllers/lookbook/previews_controller.rb +9 -6
- data/app/helpers/lookbook/component_helper.rb +2 -1
- data/app/views/layouts/lookbook/application.html.erb +6 -36
- data/app/views/lookbook/index.html.erb +2 -2
- data/app/views/lookbook/previews/show.html.erb +1 -1
- data/config/routes.rb +1 -1
- data/lib/lookbook/config.rb +7 -3
- data/lib/lookbook/data.rb +2 -2
- data/lib/lookbook/engine.rb +34 -50
- data/lib/lookbook/parser.rb +19 -11
- data/lib/lookbook/preview.rb +22 -76
- data/lib/lookbook/preview_controller.rb +19 -1
- data/lib/lookbook/preview_example.rb +12 -5
- data/lib/lookbook/source_inspector.rb +2 -2
- data/lib/lookbook/store.rb +2 -2
- data/lib/lookbook/version.rb +1 -1
- data/lib/tasks/lookbook_tasks.rake +1 -2
- data/public/lookbook-assets/css/lookbook.css +8 -34
- data/public/lookbook-assets/css/lookbook.css.map +1 -1
- data/public/lookbook-assets/js/lookbook.js +174 -120
- data/public/lookbook-assets/js/lookbook.js.map +1 -1
- metadata +2 -2
@@ -7496,65 +7496,116 @@ var $7d6b1fa982d8364d$exports = {};
|
|
7496
7496
|
});
|
7497
7497
|
|
7498
7498
|
|
7499
|
-
|
7500
|
-
|
7501
|
-
*
|
7502
|
-
* be triggered. The function will be called after it stops being called for
|
7503
|
-
* N milliseconds. If `immediate` is passed, trigger the function on the
|
7504
|
-
* leading edge, instead of the trailing. The function also has a property 'clear'
|
7505
|
-
* that is a function which will clear the timer to prevent previously scheduled executions.
|
7499
|
+
/* eslint-disable no-undefined,no-param-reassign,no-shadow */ /**
|
7500
|
+
* Throttle execution of a function. Especially useful for rate limiting
|
7501
|
+
* execution of handlers on events like resize and scroll.
|
7506
7502
|
*
|
7507
|
-
* @
|
7508
|
-
*
|
7509
|
-
* @param {Function} function to
|
7510
|
-
*
|
7511
|
-
* @param {
|
7512
|
-
* @
|
7513
|
-
|
7514
|
-
|
7515
|
-
|
7516
|
-
|
7517
|
-
|
7518
|
-
|
7519
|
-
|
7520
|
-
|
7521
|
-
|
7522
|
-
|
7523
|
-
|
7524
|
-
|
7525
|
-
|
7503
|
+
* @param {number} delay - A zero-or-greater delay in milliseconds. For event callbacks, values around 100 or 250 (or even higher)
|
7504
|
+
* are most useful.
|
7505
|
+
* @param {Function} callback - A function to be executed after delay milliseconds. The `this` context and all arguments are passed through,
|
7506
|
+
* as-is, to `callback` when the throttled-function is executed.
|
7507
|
+
* @param {object} [options] - An object to configure options.
|
7508
|
+
* @param {boolean} [options.noTrailing] - Optional, defaults to false. If noTrailing is true, callback will only execute every `delay` milliseconds
|
7509
|
+
* while the throttled-function is being called. If noTrailing is false or unspecified, callback will be executed
|
7510
|
+
* one final time after the last throttled-function call. (After the throttled-function has not been called for
|
7511
|
+
* `delay` milliseconds, the internal counter is reset).
|
7512
|
+
* @param {boolean} [options.noLeading] - Optional, defaults to false. If noLeading is false, the first throttled-function call will execute callback
|
7513
|
+
* immediately. If noLeading is true, the first the callback execution will be skipped. It should be noted that
|
7514
|
+
* callback will never executed if both noLeading = true and noTrailing = true.
|
7515
|
+
* @param {boolean} [options.debounceMode] - If `debounceMode` is true (at begin), schedule `clear` to execute after `delay` ms. If `debounceMode` is
|
7516
|
+
* false (at end), schedule `callback` to execute after `delay` ms.
|
7517
|
+
*
|
7518
|
+
* @returns {Function} A new, throttled, function.
|
7519
|
+
*/ function $c5d017602d25d050$export$de363e709c412c8a(delay, callback, options1) {
|
7520
|
+
var _ref = options1 || {}, _ref$noTrailing = _ref.noTrailing, noTrailing = _ref$noTrailing === void 0 ? false : _ref$noTrailing, _ref$noLeading = _ref.noLeading, noLeading = _ref$noLeading === void 0 ? false : _ref$noLeading, _ref$debounceMode = _ref.debounceMode, debounceMode = _ref$debounceMode === void 0 ? undefined : _ref$debounceMode;
|
7521
|
+
/*
|
7522
|
+
* After wrapper has stopped being called, this timeout ensures that
|
7523
|
+
* `callback` is executed at the proper times in `throttle` and `end`
|
7524
|
+
* debounce modes.
|
7525
|
+
*/ var timeoutID;
|
7526
|
+
var cancelled = false; // Keep track of the last time `callback` was executed.
|
7527
|
+
var lastExec = 0; // Function to clear existing timeout
|
7528
|
+
function clearExistingTimeout() {
|
7529
|
+
if (timeoutID) clearTimeout(timeoutID);
|
7530
|
+
} // Function to cancel next exec
|
7531
|
+
function cancel(options) {
|
7532
|
+
var _ref2 = options || {}, _ref2$upcomingOnly = _ref2.upcomingOnly, upcomingOnly = _ref2$upcomingOnly === void 0 ? false : _ref2$upcomingOnly;
|
7533
|
+
clearExistingTimeout();
|
7534
|
+
cancelled = !upcomingOnly;
|
7526
7535
|
}
|
7527
|
-
|
7528
|
-
|
7529
|
-
|
7530
|
-
|
7531
|
-
|
7532
|
-
|
7533
|
-
|
7534
|
-
|
7535
|
-
|
7536
|
-
|
7537
|
-
|
7538
|
-
|
7539
|
-
|
7540
|
-
if (timeout) {
|
7541
|
-
clearTimeout(timeout);
|
7542
|
-
timeout = null;
|
7543
|
-
}
|
7544
|
-
};
|
7545
|
-
debounced.flush = function() {
|
7546
|
-
if (timeout) {
|
7547
|
-
result = func.apply(context, args);
|
7548
|
-
context = args = null;
|
7549
|
-
clearTimeout(timeout);
|
7550
|
-
timeout = null;
|
7536
|
+
/*
|
7537
|
+
* The `wrapper` function encapsulates all of the throttling / debouncing
|
7538
|
+
* functionality and when executed will limit the rate at which `callback`
|
7539
|
+
* is executed.
|
7540
|
+
*/ function wrapper() {
|
7541
|
+
for(var _len = arguments.length, arguments_ = new Array(_len), _key = 0; _key < _len; _key++)arguments_[_key] = arguments[_key];
|
7542
|
+
var self = this;
|
7543
|
+
var elapsed = Date.now() - lastExec;
|
7544
|
+
if (cancelled) return;
|
7545
|
+
// Execute `callback` and update the `lastExec` timestamp.
|
7546
|
+
function exec() {
|
7547
|
+
lastExec = Date.now();
|
7548
|
+
callback.apply(self, arguments_);
|
7551
7549
|
}
|
7552
|
-
|
7553
|
-
|
7550
|
+
/*
|
7551
|
+
* If `debounceMode` is true (at begin) this is used to clear the flag
|
7552
|
+
* to allow future `callback` executions.
|
7553
|
+
*/ function clear() {
|
7554
|
+
timeoutID = undefined;
|
7555
|
+
}
|
7556
|
+
if (!noLeading && debounceMode && !timeoutID) /*
|
7557
|
+
* Since `wrapper` is being called for the first time and
|
7558
|
+
* `debounceMode` is true (at begin), execute `callback`
|
7559
|
+
* and noLeading != true.
|
7560
|
+
*/ exec();
|
7561
|
+
clearExistingTimeout();
|
7562
|
+
if (debounceMode === undefined && elapsed > delay) {
|
7563
|
+
if (noLeading) {
|
7564
|
+
/*
|
7565
|
+
* In throttle mode with noLeading, if `delay` time has
|
7566
|
+
* been exceeded, update `lastExec` and schedule `callback`
|
7567
|
+
* to execute after `delay` ms.
|
7568
|
+
*/ lastExec = Date.now();
|
7569
|
+
if (!noTrailing) timeoutID = setTimeout(debounceMode ? clear : exec, delay);
|
7570
|
+
} else /*
|
7571
|
+
* In throttle mode without noLeading, if `delay` time has been exceeded, execute
|
7572
|
+
* `callback`.
|
7573
|
+
*/ exec();
|
7574
|
+
} else if (noTrailing !== true) /*
|
7575
|
+
* In trailing throttle mode, since `delay` time has not been
|
7576
|
+
* exceeded, schedule `callback` to execute `delay` ms after most
|
7577
|
+
* recent execution.
|
7578
|
+
*
|
7579
|
+
* If `debounceMode` is true (at begin), schedule `clear` to execute
|
7580
|
+
* after `delay` ms.
|
7581
|
+
*
|
7582
|
+
* If `debounceMode` is false (at end), schedule `callback` to
|
7583
|
+
* execute after `delay` ms.
|
7584
|
+
*/ timeoutID = setTimeout(debounceMode ? clear : exec, debounceMode === undefined ? delay - elapsed : delay);
|
7585
|
+
}
|
7586
|
+
wrapper.cancel = cancel; // Return the wrapper function.
|
7587
|
+
return wrapper;
|
7588
|
+
}
|
7589
|
+
/* eslint-disable no-undefined */ /**
|
7590
|
+
* Debounce execution of a function. Debouncing, unlike throttling,
|
7591
|
+
* guarantees that a function is only executed a single time, either at the
|
7592
|
+
* very beginning of a series of calls, or at the very end.
|
7593
|
+
*
|
7594
|
+
* @param {number} delay - A zero-or-greater delay in milliseconds. For event callbacks, values around 100 or 250 (or even higher) are most useful.
|
7595
|
+
* @param {Function} callback - A function to be executed after delay milliseconds. The `this` context and all arguments are passed through, as-is,
|
7596
|
+
* to `callback` when the debounced-function is executed.
|
7597
|
+
* @param {object} [options] - An object to configure options.
|
7598
|
+
* @param {boolean} [options.atBegin] - Optional, defaults to false. If atBegin is false or unspecified, callback will only be executed `delay` milliseconds
|
7599
|
+
* after the last debounced-function call. If atBegin is true, callback will be executed only at the first debounced-function call.
|
7600
|
+
* (After the throttled-function has not been called for `delay` milliseconds, the internal counter is reset).
|
7601
|
+
*
|
7602
|
+
* @returns {Function} A new, debounced function.
|
7603
|
+
*/ function $c5d017602d25d050$export$61fc7d43ac8f84b0(delay, callback, options) {
|
7604
|
+
var _ref = options || {}, _ref$atBegin = _ref.atBegin, atBegin = _ref$atBegin === void 0 ? false : _ref$atBegin;
|
7605
|
+
return $c5d017602d25d050$export$de363e709c412c8a(delay, callback, {
|
7606
|
+
debounceMode: atBegin !== false
|
7607
|
+
});
|
7554
7608
|
}
|
7555
|
-
// Adds compatibility for ES modules
|
7556
|
-
$d3ec6a576bb30dc9$var$debounce.debounce = $d3ec6a576bb30dc9$var$debounce;
|
7557
|
-
$d3ec6a576bb30dc9$exports = $d3ec6a576bb30dc9$var$debounce;
|
7558
7609
|
|
7559
7610
|
|
7560
7611
|
|
@@ -7564,10 +7615,12 @@ function $ccd45e92e751836d$export$2e2bcd8739ae039(endpoint) {
|
|
7564
7615
|
return {
|
7565
7616
|
addListener (channel, callback) {
|
7566
7617
|
consumer.subscriptions.create(channel, {
|
7567
|
-
received: (0,
|
7618
|
+
received: (0, $c5d017602d25d050$export$61fc7d43ac8f84b0)(200, (data)=>{
|
7568
7619
|
(0, (/*@__PURE__*/$parcel$interopDefault($5267f0d63de538ba$exports))).debug("Lookbook files changed");
|
7569
7620
|
callback(data);
|
7570
|
-
},
|
7621
|
+
}, {
|
7622
|
+
atBegin: true
|
7623
|
+
}),
|
7571
7624
|
connected () {
|
7572
7625
|
(0, (/*@__PURE__*/$parcel$interopDefault($5267f0d63de538ba$exports))).info("Lookbook websocket connected");
|
7573
7626
|
},
|
@@ -7629,6 +7682,7 @@ function $d709d0f4027033b2$export$2e2bcd8739ae039() {
|
|
7629
7682
|
location: window.location,
|
7630
7683
|
init () {
|
7631
7684
|
if (window.SOCKET_PATH) {
|
7685
|
+
console.log("SOCKET CREATED");
|
7632
7686
|
const socket = (0, $ccd45e92e751836d$export$2e2bcd8739ae039)(window.SOCKET_PATH);
|
7633
7687
|
socket.addListener("Lookbook::ReloadChannel", ()=>this.updateDOM());
|
7634
7688
|
}
|
@@ -7701,7 +7755,7 @@ function $5439cede634b2921$var$toCamel(s) {
|
|
7701
7755
|
}
|
7702
7756
|
|
7703
7757
|
|
7704
|
-
var $
|
7758
|
+
var $5a1160331e703b26$exports = {};
|
7705
7759
|
var $cbd28b10fa9798c7$exports = {};
|
7706
7760
|
|
7707
7761
|
$parcel$defineInteropFlag($cbd28b10fa9798c7$exports);
|
@@ -11420,6 +11474,64 @@ function $47a1c62621be0c54$export$2e2bcd8739ae039() {
|
|
11420
11474
|
}
|
11421
11475
|
|
11422
11476
|
|
11477
|
+
var $e398acaded942bbe$exports = {};
|
11478
|
+
|
11479
|
+
$parcel$defineInteropFlag($e398acaded942bbe$exports);
|
11480
|
+
|
11481
|
+
$parcel$export($e398acaded942bbe$exports, "default", () => $e398acaded942bbe$export$2e2bcd8739ae039);
|
11482
|
+
|
11483
|
+
function $e398acaded942bbe$export$2e2bcd8739ae039(targetSelector) {
|
11484
|
+
return {
|
11485
|
+
width: 0,
|
11486
|
+
height: 0,
|
11487
|
+
resizing: false,
|
11488
|
+
target: null,
|
11489
|
+
init () {
|
11490
|
+
this.target = document.querySelector(targetSelector);
|
11491
|
+
if (this.target) {
|
11492
|
+
this.width = Math.round(this.target.clientWidth);
|
11493
|
+
this.height = Math.round(this.target.clientHeight);
|
11494
|
+
this.createObserver();
|
11495
|
+
}
|
11496
|
+
},
|
11497
|
+
createObserver () {
|
11498
|
+
if (this.target) this.observer = (0, $9930d46698775b42$export$a2214cc2adb2dc44)(document.querySelector(targetSelector), ({ width: width , height: height })=>{
|
11499
|
+
this.width = width;
|
11500
|
+
this.height = height;
|
11501
|
+
});
|
11502
|
+
},
|
11503
|
+
tearDown () {
|
11504
|
+
if (this.observer) this.observer.disconnect();
|
11505
|
+
}
|
11506
|
+
};
|
11507
|
+
}
|
11508
|
+
|
11509
|
+
|
11510
|
+
var $e9904a14dabf652d$exports = {};
|
11511
|
+
|
11512
|
+
$parcel$defineInteropFlag($e9904a14dabf652d$exports);
|
11513
|
+
|
11514
|
+
$parcel$export($e9904a14dabf652d$exports, "default", () => $e9904a14dabf652d$export$2e2bcd8739ae039);
|
11515
|
+
function $e9904a14dabf652d$export$2e2bcd8739ae039(store) {
|
11516
|
+
return {
|
11517
|
+
focussed: false,
|
11518
|
+
get active () {
|
11519
|
+
return store.active;
|
11520
|
+
},
|
11521
|
+
get text () {
|
11522
|
+
return store.text;
|
11523
|
+
},
|
11524
|
+
clear () {
|
11525
|
+
if (store.raw === "") this.$refs.input.blur();
|
11526
|
+
else store.raw = "";
|
11527
|
+
},
|
11528
|
+
focus () {
|
11529
|
+
this.$refs.input.focus();
|
11530
|
+
}
|
11531
|
+
};
|
11532
|
+
}
|
11533
|
+
|
11534
|
+
|
11423
11535
|
var $e1f51f020443edd4$exports = {};
|
11424
11536
|
|
11425
11537
|
$parcel$defineInteropFlag($e1f51f020443edd4$exports);
|
@@ -12285,64 +12397,6 @@ function $e1f51f020443edd4$export$2e2bcd8739ae039(id, embedStore) {
|
|
12285
12397
|
}
|
12286
12398
|
|
12287
12399
|
|
12288
|
-
var $e398acaded942bbe$exports = {};
|
12289
|
-
|
12290
|
-
$parcel$defineInteropFlag($e398acaded942bbe$exports);
|
12291
|
-
|
12292
|
-
$parcel$export($e398acaded942bbe$exports, "default", () => $e398acaded942bbe$export$2e2bcd8739ae039);
|
12293
|
-
|
12294
|
-
function $e398acaded942bbe$export$2e2bcd8739ae039(targetSelector) {
|
12295
|
-
return {
|
12296
|
-
width: 0,
|
12297
|
-
height: 0,
|
12298
|
-
resizing: false,
|
12299
|
-
target: null,
|
12300
|
-
init () {
|
12301
|
-
this.target = document.querySelector(targetSelector);
|
12302
|
-
if (this.target) {
|
12303
|
-
this.width = Math.round(this.target.clientWidth);
|
12304
|
-
this.height = Math.round(this.target.clientHeight);
|
12305
|
-
this.createObserver();
|
12306
|
-
}
|
12307
|
-
},
|
12308
|
-
createObserver () {
|
12309
|
-
if (this.target) this.observer = (0, $9930d46698775b42$export$a2214cc2adb2dc44)(document.querySelector(targetSelector), ({ width: width , height: height })=>{
|
12310
|
-
this.width = width;
|
12311
|
-
this.height = height;
|
12312
|
-
});
|
12313
|
-
},
|
12314
|
-
tearDown () {
|
12315
|
-
if (this.observer) this.observer.disconnect();
|
12316
|
-
}
|
12317
|
-
};
|
12318
|
-
}
|
12319
|
-
|
12320
|
-
|
12321
|
-
var $e9904a14dabf652d$exports = {};
|
12322
|
-
|
12323
|
-
$parcel$defineInteropFlag($e9904a14dabf652d$exports);
|
12324
|
-
|
12325
|
-
$parcel$export($e9904a14dabf652d$exports, "default", () => $e9904a14dabf652d$export$2e2bcd8739ae039);
|
12326
|
-
function $e9904a14dabf652d$export$2e2bcd8739ae039(store) {
|
12327
|
-
return {
|
12328
|
-
focussed: false,
|
12329
|
-
get active () {
|
12330
|
-
return store.active;
|
12331
|
-
},
|
12332
|
-
get text () {
|
12333
|
-
return store.text;
|
12334
|
-
},
|
12335
|
-
clear () {
|
12336
|
-
if (store.raw === "") this.$refs.input.blur();
|
12337
|
-
else store.raw = "";
|
12338
|
-
},
|
12339
|
-
focus () {
|
12340
|
-
this.$refs.input.focus();
|
12341
|
-
}
|
12342
|
-
};
|
12343
|
-
}
|
12344
|
-
|
12345
|
-
|
12346
12400
|
var $36506012e0c6e9e3$exports = {};
|
12347
12401
|
|
12348
12402
|
$parcel$defineInteropFlag($36506012e0c6e9e3$exports);
|
@@ -13032,7 +13086,7 @@ function $0db07828cadc68e0$export$2e2bcd8739ae039(store) {
|
|
13032
13086
|
});
|
13033
13087
|
const initialTab = initial1 ? this.tabs.find((t)=>this._getRef(t) === initial1) : this.tabs[0];
|
13034
13088
|
this.selectTab(initialTab, true);
|
13035
|
-
this.parentObserver = (0, $9930d46698775b42$export$a2214cc2adb2dc44)(this.$root.parentElement, (0,
|
13089
|
+
this.parentObserver = (0, $9930d46698775b42$export$a2214cc2adb2dc44)(this.$root.parentElement, (0, $c5d017602d25d050$export$61fc7d43ac8f84b0)(10, this.handleResize.bind(this)));
|
13036
13090
|
this.$watch("visibleTabsCount", (value)=>{
|
13037
13091
|
this.debug(`'#${this.$root.id}' visible tabs count:`, value);
|
13038
13092
|
});
|
@@ -13210,13 +13264,13 @@ function $6d64716f0b34fdf4$export$2e2bcd8739ae039(store) {
|
|
13210
13264
|
}
|
13211
13265
|
|
13212
13266
|
|
13213
|
-
$
|
13267
|
+
$5a1160331e703b26$exports = {
|
13214
13268
|
"button": $cbd28b10fa9798c7$exports,
|
13215
13269
|
"code": $99486586f6691564$exports,
|
13216
13270
|
"copy_button": $47a1c62621be0c54$exports,
|
13217
|
-
"embed": $e1f51f020443edd4$exports,
|
13218
13271
|
"dimensions_display": $e398acaded942bbe$exports,
|
13219
13272
|
"filter": $e9904a14dabf652d$exports,
|
13273
|
+
"embed": $e1f51f020443edd4$exports,
|
13220
13274
|
"icon": $36506012e0c6e9e3$exports,
|
13221
13275
|
"nav": $d92d9d5253f84566$exports,
|
13222
13276
|
"params_editor": $b63b9c6d236b3f65$exports,
|
@@ -13367,7 +13421,7 @@ const $d73574cc5e9b9e72$var$prefix = window.APP_NAME;
|
|
13367
13421
|
// Components
|
13368
13422
|
(0, $caa9439642c6336c$export$2e2bcd8739ae039).data("app", (0, $d709d0f4027033b2$export$2e2bcd8739ae039));
|
13369
13423
|
[
|
13370
|
-
$
|
13424
|
+
$5a1160331e703b26$exports,
|
13371
13425
|
$e4eab7529959b73b$exports,
|
13372
13426
|
$4979d2d897a1c01f$exports
|
13373
13427
|
].forEach((scripts)=>{
|