lookbook 2.0.0.beta.7 → 2.0.0.beta.9
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +7 -0
- data/app/components/lookbook/page_tabs/component.html.erb +2 -2
- data/app/components/lookbook/params/field/component.rb +1 -1
- data/app/components/lookbook/prose/component.css +3 -1
- data/app/components/lookbook/prose/component.html.erb +1 -0
- data/app/components/lookbook/split_layout/component.html.erb +3 -3
- data/app/controllers/concerns/lookbook/targetable_concern.rb +1 -1
- data/app/helpers/lookbook/application_helper.rb +1 -1
- data/app/views/lookbook/errors/default.html.erb +1 -1
- data/app/views/lookbook/inspector/panels/_preview.html.erb +1 -1
- data/app/views/lookbook/inspector/show.html.erb +1 -0
- data/app/views/lookbook/pages/show.html.erb +65 -58
- data/assets/css/lookbook.css +5 -1
- data/assets/css/themes/blue.css +3 -0
- data/assets/css/themes/green.css +3 -0
- data/assets/css/themes/indigo.css +3 -0
- data/assets/css/themes/rose.css +3 -0
- data/assets/css/themes/zinc.css +3 -0
- data/config/tags.yml +4 -0
- data/lib/lookbook/engine.rb +16 -2
- data/lib/lookbook/entities/preview_entity.rb +6 -1
- data/lib/lookbook/entities/scenario_entity.rb +5 -0
- data/lib/lookbook/preview.rb +1 -0
- data/lib/lookbook/preview_after_render.rb +13 -0
- data/lib/lookbook/preview_controller_actions.rb +18 -3
- data/lib/lookbook/tags/after_render_tag.rb +7 -0
- data/lib/lookbook/tags/param_tag.rb +1 -1
- data/lib/lookbook/version.rb +1 -1
- data/public/lookbook-assets/css/lookbook.css +85 -11
- data/public/lookbook-assets/css/lookbook.css.map +1 -1
- data/public/lookbook-assets/css/themes/blue.css +3 -0
- data/public/lookbook-assets/css/themes/blue.css.map +1 -1
- data/public/lookbook-assets/css/themes/green.css +3 -0
- data/public/lookbook-assets/css/themes/green.css.map +1 -1
- data/public/lookbook-assets/css/themes/indigo.css +3 -0
- data/public/lookbook-assets/css/themes/indigo.css.map +1 -1
- data/public/lookbook-assets/css/themes/rose.css +3 -0
- data/public/lookbook-assets/css/themes/rose.css.map +1 -1
- data/public/lookbook-assets/css/themes/zinc.css +3 -0
- data/public/lookbook-assets/css/themes/zinc.css.map +1 -1
- data/public/lookbook-assets/js/index.js +143 -143
- data/public/lookbook-assets/js/index.js.map +1 -1
- metadata +4 -2
@@ -7815,17 +7815,7 @@ function $12b7aa006b8a97e1$var$toCamel(s) {
|
|
7815
7815
|
}
|
7816
7816
|
|
7817
7817
|
|
7818
|
-
var $
|
7819
|
-
var $99486586f6691564$exports = {};
|
7820
|
-
|
7821
|
-
$parcel$defineInteropFlag($99486586f6691564$exports);
|
7822
|
-
|
7823
|
-
$parcel$export($99486586f6691564$exports, "default", () => $99486586f6691564$export$2e2bcd8739ae039);
|
7824
|
-
function $99486586f6691564$export$2e2bcd8739ae039() {
|
7825
|
-
return {};
|
7826
|
-
}
|
7827
|
-
|
7828
|
-
|
7818
|
+
var $d9c79682b7f8e136$exports = {};
|
7829
7819
|
var $cbd28b10fa9798c7$exports = {};
|
7830
7820
|
|
7831
7821
|
$parcel$defineInteropFlag($cbd28b10fa9798c7$exports);
|
@@ -11356,6 +11346,49 @@ function $cbd28b10fa9798c7$export$2e2bcd8739ae039() {
|
|
11356
11346
|
}
|
11357
11347
|
|
11358
11348
|
|
11349
|
+
var $99486586f6691564$exports = {};
|
11350
|
+
|
11351
|
+
$parcel$defineInteropFlag($99486586f6691564$exports);
|
11352
|
+
|
11353
|
+
$parcel$export($99486586f6691564$exports, "default", () => $99486586f6691564$export$2e2bcd8739ae039);
|
11354
|
+
function $99486586f6691564$export$2e2bcd8739ae039() {
|
11355
|
+
return {};
|
11356
|
+
}
|
11357
|
+
|
11358
|
+
|
11359
|
+
var $e398acaded942bbe$exports = {};
|
11360
|
+
|
11361
|
+
$parcel$defineInteropFlag($e398acaded942bbe$exports);
|
11362
|
+
|
11363
|
+
$parcel$export($e398acaded942bbe$exports, "default", () => $e398acaded942bbe$export$2e2bcd8739ae039);
|
11364
|
+
|
11365
|
+
function $e398acaded942bbe$export$2e2bcd8739ae039(targetSelector) {
|
11366
|
+
return {
|
11367
|
+
width: 0,
|
11368
|
+
height: 0,
|
11369
|
+
resizing: false,
|
11370
|
+
target: null,
|
11371
|
+
init () {
|
11372
|
+
this.target = document.querySelector(targetSelector);
|
11373
|
+
if (this.target) {
|
11374
|
+
this.width = Math.round(this.target.clientWidth);
|
11375
|
+
this.height = Math.round(this.target.clientHeight);
|
11376
|
+
this.createObserver();
|
11377
|
+
}
|
11378
|
+
},
|
11379
|
+
createObserver () {
|
11380
|
+
if (this.target) this.observer = (0, $7ecd1fc3a6b35e5c$export$a2214cc2adb2dc44)(this.target, ({ width: width , height: height })=>{
|
11381
|
+
this.width = width;
|
11382
|
+
this.height = height;
|
11383
|
+
});
|
11384
|
+
},
|
11385
|
+
tearDown () {
|
11386
|
+
if (this.observer) this.observer.disconnect();
|
11387
|
+
}
|
11388
|
+
};
|
11389
|
+
}
|
11390
|
+
|
11391
|
+
|
11359
11392
|
var $47a1c62621be0c54$exports = {};
|
11360
11393
|
|
11361
11394
|
$parcel$defineInteropFlag($47a1c62621be0c54$exports);
|
@@ -11412,39 +11445,6 @@ function $47a1c62621be0c54$export$2e2bcd8739ae039() {
|
|
11412
11445
|
}
|
11413
11446
|
|
11414
11447
|
|
11415
|
-
var $e398acaded942bbe$exports = {};
|
11416
|
-
|
11417
|
-
$parcel$defineInteropFlag($e398acaded942bbe$exports);
|
11418
|
-
|
11419
|
-
$parcel$export($e398acaded942bbe$exports, "default", () => $e398acaded942bbe$export$2e2bcd8739ae039);
|
11420
|
-
|
11421
|
-
function $e398acaded942bbe$export$2e2bcd8739ae039(targetSelector) {
|
11422
|
-
return {
|
11423
|
-
width: 0,
|
11424
|
-
height: 0,
|
11425
|
-
resizing: false,
|
11426
|
-
target: null,
|
11427
|
-
init () {
|
11428
|
-
this.target = document.querySelector(targetSelector);
|
11429
|
-
if (this.target) {
|
11430
|
-
this.width = Math.round(this.target.clientWidth);
|
11431
|
-
this.height = Math.round(this.target.clientHeight);
|
11432
|
-
this.createObserver();
|
11433
|
-
}
|
11434
|
-
},
|
11435
|
-
createObserver () {
|
11436
|
-
if (this.target) this.observer = (0, $7ecd1fc3a6b35e5c$export$a2214cc2adb2dc44)(this.target, ({ width: width , height: height })=>{
|
11437
|
-
this.width = width;
|
11438
|
-
this.height = height;
|
11439
|
-
});
|
11440
|
-
},
|
11441
|
-
tearDown () {
|
11442
|
-
if (this.observer) this.observer.disconnect();
|
11443
|
-
}
|
11444
|
-
};
|
11445
|
-
}
|
11446
|
-
|
11447
|
-
|
11448
11448
|
var $216ef7001f59f21d$exports = {};
|
11449
11449
|
|
11450
11450
|
$parcel$defineInteropFlag($216ef7001f59f21d$exports);
|
@@ -12116,99 +12116,6 @@ function $a87dacf5139b5e2f$export$2e2bcd8739ae039(store) {
|
|
12116
12116
|
}
|
12117
12117
|
|
12118
12118
|
|
12119
|
-
var $0db07828cadc68e0$exports = {};
|
12120
|
-
|
12121
|
-
$parcel$defineInteropFlag($0db07828cadc68e0$exports);
|
12122
|
-
|
12123
|
-
$parcel$export($0db07828cadc68e0$exports, "default", () => $0db07828cadc68e0$export$2e2bcd8739ae039);
|
12124
|
-
|
12125
|
-
|
12126
|
-
|
12127
|
-
|
12128
|
-
function $0db07828cadc68e0$export$2e2bcd8739ae039(store) {
|
12129
|
-
const initial = store ? store.activeTab : null;
|
12130
|
-
let dropdown = null;
|
12131
|
-
return {
|
12132
|
-
visibleTabsCount: 0,
|
12133
|
-
triggerLeft: 0,
|
12134
|
-
get store () {
|
12135
|
-
return store || this;
|
12136
|
-
},
|
12137
|
-
get tabs () {
|
12138
|
-
return this.$refs.tabs ? Array.from(this.$refs.tabs.children) : [];
|
12139
|
-
},
|
12140
|
-
get dropdownTabs () {
|
12141
|
-
return Array.from(this.$refs.tabsDropdown ? this.$refs.tabsDropdown.children : []);
|
12142
|
-
},
|
12143
|
-
get tabWidths () {
|
12144
|
-
return this.tabs.map((tab)=>(0, $490552754c23ef6f$export$bdf7e699b242f476)(tab, {
|
12145
|
-
includeMargins: true
|
12146
|
-
}).width);
|
12147
|
-
},
|
12148
|
-
init () {
|
12149
|
-
this.$nextTick(()=>{
|
12150
|
-
if (this.$root.parentElement.offsetWidth === this.$root.offsetWidth) this.visibleTabsCount = this.tabs.length;
|
12151
|
-
dropdown = (0, $789b7d27a7c715a6$export$2e2bcd8739ae039)(this.$refs.dropdownTrigger, {
|
12152
|
-
content: this.$refs.tabsDropdown,
|
12153
|
-
theme: "menu",
|
12154
|
-
interactive: true,
|
12155
|
-
trigger: "click",
|
12156
|
-
placement: "bottom",
|
12157
|
-
appendTo: this.$root
|
12158
|
-
});
|
12159
|
-
const initialTab = initial ? this.tabs.find((t)=>this._getRef(t) === initial) : this.tabs[0];
|
12160
|
-
this.selectTab(initialTab || this.tabs[0], true);
|
12161
|
-
this.parentObserver = (0, $7ecd1fc3a6b35e5c$export$a2214cc2adb2dc44)(this.$root.parentElement, (0, $c5d017602d25d050$export$61fc7d43ac8f84b0)(10, this.handleResize.bind(this)));
|
12162
|
-
this.$watch("visibleTabsCount", (value)=>{
|
12163
|
-
this.debug(`'#${this.$root.id}' visible tabs count:`, value);
|
12164
|
-
});
|
12165
|
-
});
|
12166
|
-
},
|
12167
|
-
handleResize ({ width: width }) {
|
12168
|
-
if (width === this._lastMeasuredWidth) return;
|
12169
|
-
if (width === this.$root.offsetWidth) {
|
12170
|
-
this.visibleTabsCount = this.tabs.length;
|
12171
|
-
return;
|
12172
|
-
}
|
12173
|
-
let sumTabWidths = 60;
|
12174
|
-
let triggerLeft = 20;
|
12175
|
-
let visibleTabsCount = 0;
|
12176
|
-
this.tabWidths.forEach((tabWidth)=>{
|
12177
|
-
sumTabWidths += tabWidth;
|
12178
|
-
if (sumTabWidths < width) {
|
12179
|
-
triggerLeft += tabWidth;
|
12180
|
-
visibleTabsCount++;
|
12181
|
-
}
|
12182
|
-
});
|
12183
|
-
this.visibleTabsCount = visibleTabsCount;
|
12184
|
-
this.triggerLeft = triggerLeft;
|
12185
|
-
this._lastMeasuredWidth = width;
|
12186
|
-
},
|
12187
|
-
selectTab (el, initial = false) {
|
12188
|
-
this.store.activeTab = this._getRef(el);
|
12189
|
-
dropdown.hide();
|
12190
|
-
if (!initial) this.$dispatch("tabs:change", {
|
12191
|
-
tabs: this
|
12192
|
-
});
|
12193
|
-
},
|
12194
|
-
isSelected (el) {
|
12195
|
-
return this.store.activeTab === this._getRef(el);
|
12196
|
-
},
|
12197
|
-
isDisabled (el) {
|
12198
|
-
return el.getAttribute("data-disabled") == "true";
|
12199
|
-
},
|
12200
|
-
hasHiddenTabs () {
|
12201
|
-
return this.visibleTabsCount < this.tabs.length;
|
12202
|
-
},
|
12203
|
-
// protected
|
12204
|
-
_lastMeasuredWidth: 0,
|
12205
|
-
_getRef (el) {
|
12206
|
-
return el ? el.getAttribute("x-ref").replace("dropdown-", "") : null;
|
12207
|
-
}
|
12208
|
-
};
|
12209
|
-
}
|
12210
|
-
|
12211
|
-
|
12212
12119
|
var $6d64716f0b34fdf4$exports = {};
|
12213
12120
|
|
12214
12121
|
$parcel$defineInteropFlag($6d64716f0b34fdf4$exports);
|
@@ -12336,18 +12243,111 @@ function $6d64716f0b34fdf4$export$2e2bcd8739ae039(store) {
|
|
12336
12243
|
}
|
12337
12244
|
|
12338
12245
|
|
12339
|
-
$
|
12340
|
-
|
12246
|
+
var $0db07828cadc68e0$exports = {};
|
12247
|
+
|
12248
|
+
$parcel$defineInteropFlag($0db07828cadc68e0$exports);
|
12249
|
+
|
12250
|
+
$parcel$export($0db07828cadc68e0$exports, "default", () => $0db07828cadc68e0$export$2e2bcd8739ae039);
|
12251
|
+
|
12252
|
+
|
12253
|
+
|
12254
|
+
|
12255
|
+
function $0db07828cadc68e0$export$2e2bcd8739ae039(store) {
|
12256
|
+
const initial = store ? store.activeTab : null;
|
12257
|
+
let dropdown = null;
|
12258
|
+
return {
|
12259
|
+
visibleTabsCount: 0,
|
12260
|
+
triggerLeft: 0,
|
12261
|
+
get store () {
|
12262
|
+
return store || this;
|
12263
|
+
},
|
12264
|
+
get tabs () {
|
12265
|
+
return this.$refs.tabs ? Array.from(this.$refs.tabs.children) : [];
|
12266
|
+
},
|
12267
|
+
get dropdownTabs () {
|
12268
|
+
return Array.from(this.$refs.tabsDropdown ? this.$refs.tabsDropdown.children : []);
|
12269
|
+
},
|
12270
|
+
get tabWidths () {
|
12271
|
+
return this.tabs.map((tab)=>(0, $490552754c23ef6f$export$bdf7e699b242f476)(tab, {
|
12272
|
+
includeMargins: true
|
12273
|
+
}).width);
|
12274
|
+
},
|
12275
|
+
init () {
|
12276
|
+
this.$nextTick(()=>{
|
12277
|
+
if (this.$root.parentElement.offsetWidth === this.$root.offsetWidth) this.visibleTabsCount = this.tabs.length;
|
12278
|
+
dropdown = (0, $789b7d27a7c715a6$export$2e2bcd8739ae039)(this.$refs.dropdownTrigger, {
|
12279
|
+
content: this.$refs.tabsDropdown,
|
12280
|
+
theme: "menu",
|
12281
|
+
interactive: true,
|
12282
|
+
trigger: "click",
|
12283
|
+
placement: "bottom",
|
12284
|
+
appendTo: this.$root
|
12285
|
+
});
|
12286
|
+
const initialTab = initial ? this.tabs.find((t)=>this._getRef(t) === initial) : this.tabs[0];
|
12287
|
+
this.selectTab(initialTab || this.tabs[0], true);
|
12288
|
+
this.parentObserver = (0, $7ecd1fc3a6b35e5c$export$a2214cc2adb2dc44)(this.$root.parentElement, (0, $c5d017602d25d050$export$61fc7d43ac8f84b0)(10, this.handleResize.bind(this)));
|
12289
|
+
this.$watch("visibleTabsCount", (value)=>{
|
12290
|
+
this.debug(`'#${this.$root.id}' visible tabs count:`, value);
|
12291
|
+
});
|
12292
|
+
});
|
12293
|
+
},
|
12294
|
+
handleResize ({ width: width }) {
|
12295
|
+
if (width === this._lastMeasuredWidth) return;
|
12296
|
+
if (width === this.$root.offsetWidth) {
|
12297
|
+
this.visibleTabsCount = this.tabs.length;
|
12298
|
+
return;
|
12299
|
+
}
|
12300
|
+
let sumTabWidths = 60;
|
12301
|
+
let triggerLeft = 20;
|
12302
|
+
let visibleTabsCount = 0;
|
12303
|
+
this.tabWidths.forEach((tabWidth)=>{
|
12304
|
+
sumTabWidths += tabWidth;
|
12305
|
+
if (sumTabWidths < width) {
|
12306
|
+
triggerLeft += tabWidth;
|
12307
|
+
visibleTabsCount++;
|
12308
|
+
}
|
12309
|
+
});
|
12310
|
+
this.visibleTabsCount = visibleTabsCount;
|
12311
|
+
this.triggerLeft = triggerLeft;
|
12312
|
+
this._lastMeasuredWidth = width;
|
12313
|
+
},
|
12314
|
+
selectTab (el, initial = false) {
|
12315
|
+
this.store.activeTab = this._getRef(el);
|
12316
|
+
dropdown.hide();
|
12317
|
+
if (!initial) this.$dispatch("tabs:change", {
|
12318
|
+
tabs: this
|
12319
|
+
});
|
12320
|
+
},
|
12321
|
+
isSelected (el) {
|
12322
|
+
return this.store.activeTab === this._getRef(el);
|
12323
|
+
},
|
12324
|
+
isDisabled (el) {
|
12325
|
+
return el.getAttribute("data-disabled") == "true";
|
12326
|
+
},
|
12327
|
+
hasHiddenTabs () {
|
12328
|
+
return this.visibleTabsCount < this.tabs.length;
|
12329
|
+
},
|
12330
|
+
// protected
|
12331
|
+
_lastMeasuredWidth: 0,
|
12332
|
+
_getRef (el) {
|
12333
|
+
return el ? el.getAttribute("x-ref").replace("dropdown-", "") : null;
|
12334
|
+
}
|
12335
|
+
};
|
12336
|
+
}
|
12337
|
+
|
12338
|
+
|
12339
|
+
$d9c79682b7f8e136$exports = {
|
12341
12340
|
"button": $cbd28b10fa9798c7$exports,
|
12342
|
-
"
|
12341
|
+
"code": $99486586f6691564$exports,
|
12343
12342
|
"dimensions_display": $e398acaded942bbe$exports,
|
12343
|
+
"copy_button": $47a1c62621be0c54$exports,
|
12344
12344
|
"embed_code_dropdown": $216ef7001f59f21d$exports,
|
12345
12345
|
"filter": $e9904a14dabf652d$exports,
|
12346
12346
|
"nav": $d92d9d5253f84566$exports,
|
12347
12347
|
"split_layout": $506dabb2bf255b38$exports,
|
12348
12348
|
"tab_panels": $a87dacf5139b5e2f$exports,
|
12349
|
-
"
|
12350
|
-
"
|
12349
|
+
"viewport": $6d64716f0b34fdf4$exports,
|
12350
|
+
"tabs": $0db07828cadc68e0$exports
|
12351
12351
|
};
|
12352
12352
|
|
12353
12353
|
|
@@ -13521,7 +13521,7 @@ const $22969b543678f572$var$prefix = window.APP_NAME;
|
|
13521
13521
|
// Components
|
13522
13522
|
(0, $caa9439642c6336c$export$2e2bcd8739ae039).data("app", (0, $5792afa4170ed552$export$2e2bcd8739ae039));
|
13523
13523
|
[
|
13524
|
-
$
|
13524
|
+
$d9c79682b7f8e136$exports,
|
13525
13525
|
$f3e1e32f4a1bd6da$exports,
|
13526
13526
|
$338da9a25bc5c332$exports
|
13527
13527
|
].forEach((scripts)=>{
|