Skip to content

Commit 3230864

Browse files
committed
Fix *Playground* allowed components list check.
1 parent ef42467 commit 3230864

7 files changed

Lines changed: 49 additions & 49 deletions

File tree

docs/feed/rss.xml

Lines changed: 23 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@
77
<description></description>
88
<language></language>
99
<copyright></copyright>
10-
<lastBuildDate>Sun, 12 Apr 2026 19:58:40 +0200</lastBuildDate>
11-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
10+
<lastBuildDate>Sun, 12 Apr 2026 20:30:27 +0200</lastBuildDate>
11+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
1212
<image>
1313
<title>&lt;code&gt;zKit&lt;/code&gt; components</title>
1414
<url>https://zuixjs.github.io/zkit/images/icons/icon-152x152.png</url>
@@ -19,7 +19,7 @@
1919
<link>https://zuixjs.github.io/zkit/</link>
2020
<guid isPermaLink="true">https://zuixjs.github.io/zkit/</guid>
2121
<description>A collection of example web components made with love and zuix.js! =)</description>
22-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
22+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
2323
<atom:link href="https://zuixjs.github.io/zkit/" rel="self" />
2424
<dc:creator></dc:creator>
2525
</item>
@@ -28,7 +28,7 @@
2828
<link>https://zuixjs.github.io/zkit/search/</link>
2929
<guid isPermaLink="true">https://zuixjs.github.io/zkit/search/</guid>
3030
<description>Search this website</description>
31-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
31+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
3232
<atom:link href="https://zuixjs.github.io/zkit/search/" rel="self" />
3333
<dc:creator></dc:creator>
3434
</item>
@@ -37,7 +37,7 @@
3737
<link>https://zuixjs.github.io/zkit/content/components/zx-playground/</link>
3838
<guid isPermaLink="true">https://zuixjs.github.io/zkit/content/components/zx-playground/</guid>
3939
<description>Client-side web component editor with live preview and download functionality.</description>
40-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
40+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
4141
<atom:link href="https://zuixjs.github.io/zkit/content/components/zx-playground/" rel="self" />
4242
<dc:creator></dc:creator>
4343
</item>
@@ -46,7 +46,7 @@
4646
<link>https://zuixjs.github.io/zkit/content/components/</link>
4747
<guid isPermaLink="true">https://zuixjs.github.io/zkit/content/components/</guid>
4848
<description>zKit Components</description>
49-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
49+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
5050
<atom:link href="https://zuixjs.github.io/zkit/content/components/" rel="self" />
5151
<dc:creator></dc:creator>
5252
</item>
@@ -55,7 +55,7 @@
5555
<link>https://zuixjs.github.io/zkit/content/components/menu-overlay/</link>
5656
<guid isPermaLink="true">https://zuixjs.github.io/zkit/content/components/menu-overlay/</guid>
5757
<description>A classic floating action button activated menu for page-contextual operations.</description>
58-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
58+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
5959
<atom:link href="https://zuixjs.github.io/zkit/content/components/menu-overlay/" rel="self" />
6060
<dc:creator></dc:creator>
6161
</item>
@@ -64,7 +64,7 @@
6464
<link>https://zuixjs.github.io/zkit/content/components/media-browser/</link>
6565
<guid isPermaLink="true">https://zuixjs.github.io/zkit/content/components/media-browser/</guid>
6666
<description>A gestures enabled media browser supporting image, videos and text.</description>
67-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
67+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
6868
<atom:link href="https://zuixjs.github.io/zkit/content/components/media-browser/" rel="self" />
6969
<dc:creator></dc:creator>
7070
</item>
@@ -73,7 +73,7 @@
7373
<link>https://zuixjs.github.io/zkit/content/components/context-menu/</link>
7474
<guid isPermaLink="true">https://zuixjs.github.io/zkit/content/components/context-menu/</guid>
7575
<description>A bottom popping context menu, like the one commonly used on mobile devices.</description>
76-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
76+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
7777
<atom:link href="https://zuixjs.github.io/zkit/content/components/context-menu/" rel="self" />
7878
<dc:creator></dc:creator>
7979
</item>
@@ -82,7 +82,7 @@
8282
<link>https://zuixjs.github.io/zkit/content/controllers/</link>
8383
<guid isPermaLink="true">https://zuixjs.github.io/zkit/content/controllers/</guid>
8484
<description>zKit Controllers</description>
85-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
85+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
8686
<atom:link href="https://zuixjs.github.io/zkit/content/controllers/" rel="self" />
8787
<dc:creator></dc:creator>
8888
</item>
@@ -91,7 +91,7 @@
9191
<link>https://zuixjs.github.io/zkit/content/controllers/list-view/</link>
9292
<guid isPermaLink="true">https://zuixjs.github.io/zkit/content/controllers/list-view/</guid>
9393
<description>List View with lazy-loaded elements</description>
94-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
94+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
9595
<atom:link href="https://zuixjs.github.io/zkit/content/controllers/list-view/" rel="self" />
9696
<dc:creator></dc:creator>
9797
</item>
@@ -100,7 +100,7 @@
100100
<link>https://zuixjs.github.io/zkit/content/controllers/list-view/test-1.html</link>
101101
<guid isPermaLink="true">https://zuixjs.github.io/zkit/content/controllers/list-view/test-1.html</guid>
102102
<description>List View with lazy-loaded elements</description>
103-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
103+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
104104
<atom:link href="https://zuixjs.github.io/zkit/content/controllers/list-view/test-1.html" rel="self" />
105105
<dc:creator></dc:creator>
106106
</item>
@@ -109,7 +109,7 @@
109109
<link>https://zuixjs.github.io/zkit/content/controllers/list-view/test-2.html</link>
110110
<guid isPermaLink="true">https://zuixjs.github.io/zkit/content/controllers/list-view/test-2.html</guid>
111111
<description>List View with lazy-loaded elements</description>
112-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
112+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
113113
<atom:link href="https://zuixjs.github.io/zkit/content/controllers/list-view/test-2.html" rel="self" />
114114
<dc:creator></dc:creator>
115115
</item>
@@ -118,7 +118,7 @@
118118
<link>https://zuixjs.github.io/zkit/content/controllers/list-view/test-data.json</link>
119119
<guid isPermaLink="true">https://zuixjs.github.io/zkit/content/controllers/list-view/test-data.json</guid>
120120
<description></description>
121-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
121+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
122122
<atom:link href="https://zuixjs.github.io/zkit/content/controllers/list-view/test-data.json" rel="self" />
123123
<dc:creator></dc:creator>
124124
</item>
@@ -127,7 +127,7 @@
127127
<link>https://zuixjs.github.io/zkit/content/controllers/shadow-view/</link>
128128
<guid isPermaLink="true">https://zuixjs.github.io/zkit/content/controllers/shadow-view/</guid>
129129
<description>Declarative shadow DOM view component</description>
130-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
130+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
131131
<atom:link href="https://zuixjs.github.io/zkit/content/controllers/shadow-view/" rel="self" />
132132
<dc:creator></dc:creator>
133133
</item>
@@ -136,7 +136,7 @@
136136
<link>https://zuixjs.github.io/zkit/content/controllers/view-pager/</link>
137137
<guid isPermaLink="true">https://zuixjs.github.io/zkit/content/controllers/view-pager/</guid>
138138
<description>View Pager component for implementing carousel, gallery, tab-views. Gesture enabled, for desktop and mobile.</description>
139-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
139+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
140140
<atom:link href="https://zuixjs.github.io/zkit/content/controllers/view-pager/" rel="self" />
141141
<dc:creator></dc:creator>
142142
</item>
@@ -145,7 +145,7 @@
145145
<link>https://zuixjs.github.io/zkit/content/controllers/header-auto-hide/</link>
146146
<guid isPermaLink="true">https://zuixjs.github.io/zkit/content/controllers/header-auto-hide/</guid>
147147
<description>Automatically hides/reveals header on scroll.</description>
148-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
148+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
149149
<atom:link href="https://zuixjs.github.io/zkit/content/controllers/header-auto-hide/" rel="self" />
150150
<dc:creator></dc:creator>
151151
</item>
@@ -154,7 +154,7 @@
154154
<link>https://zuixjs.github.io/zkit/content/controllers/drawer-layout/</link>
155155
<guid isPermaLink="true">https://zuixjs.github.io/zkit/content/controllers/drawer-layout/</guid>
156156
<description>An adaptive drawer layout for both mobile and desktop displays, gestures enabled.</description>
157-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
157+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
158158
<atom:link href="https://zuixjs.github.io/zkit/content/controllers/drawer-layout/" rel="self" />
159159
<dc:creator></dc:creator>
160160
</item>
@@ -163,7 +163,7 @@
163163
<link>https://zuixjs.github.io/zkit/content/controllers/gesture-helper/</link>
164164
<guid isPermaLink="true">https://zuixjs.github.io/zkit/content/controllers/gesture-helper/</guid>
165165
<description>Helper class for detecting common touch gestures.</description>
166-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
166+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
167167
<atom:link href="https://zuixjs.github.io/zkit/content/controllers/gesture-helper/" rel="self" />
168168
<dc:creator></dc:creator>
169169
</item>
@@ -172,7 +172,7 @@
172172
<link>https://zuixjs.github.io/zkit/content/controllers/scroll-helper/</link>
173173
<guid isPermaLink="true">https://zuixjs.github.io/zkit/content/controllers/scroll-helper/</guid>
174174
<description>Scroll helper to improve page scrolling handling, watching elements and get notified when they scroll into view.</description>
175-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
175+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
176176
<atom:link href="https://zuixjs.github.io/zkit/content/controllers/scroll-helper/" rel="self" />
177177
<dc:creator></dc:creator>
178178
</item>
@@ -181,7 +181,7 @@
181181
<link>https://zuixjs.github.io/zkit/content/test/</link>
182182
<guid isPermaLink="true">https://zuixjs.github.io/zkit/content/test/</guid>
183183
<description></description>
184-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
184+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
185185
<atom:link href="https://zuixjs.github.io/zkit/content/test/" rel="self" />
186186
<dc:creator></dc:creator>
187187
</item>
@@ -190,7 +190,7 @@
190190
<link>https://zuixjs.github.io/zkit/home/</link>
191191
<guid isPermaLink="true">https://zuixjs.github.io/zkit/home/</guid>
192192
<description>zKit, a collection of framework-agnostic components for the web</description>
193-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
193+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
194194
<atom:link href="https://zuixjs.github.io/zkit/home/" rel="self" />
195195
<dc:creator></dc:creator>
196196
</item>
@@ -199,7 +199,7 @@
199199
<link>https://zuixjs.github.io/zkit/content/controllers/transpose-fx/</link>
200200
<guid isPermaLink="true">https://zuixjs.github.io/zkit/content/controllers/transpose-fx/</guid>
201201
<description>Transpose effect to transition a component between two views</description>
202-
<pubDate>Sun, 12 Apr 2026 19:58:40 +0200</pubDate>
202+
<pubDate>Sun, 12 Apr 2026 20:30:27 +0200</pubDate>
203203
<atom:link href="https://zuixjs.github.io/zkit/content/controllers/transpose-fx/" rel="self" />
204204
<dc:creator></dc:creator>
205205
</item>

docs/lib/1.2/components/zx-playground.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@
3939

4040
.toolbar {
4141
display: flex;
42-
place-content: space-between;
42+
place-content: stretch;
4343
align-items: center;
4444
padding-left: 1px;
4545
padding-right: 1px;

docs/lib/1.2/components/zx-playground.html

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -28,26 +28,26 @@
2828

2929
</div>
3030

31-
<mdl-menu z-lazy="false"
32-
(download)="download()" (load)="load(event)" (new)="editNew()"
31+
<div style="flex-grow: 1">&nbsp;</div>
32+
33+
<mdl-button #menu-button :type="'icon'" :class="'accent'">
34+
menu
35+
</mdl-button>
36+
37+
<mdl-menu z-lazy="false" (load)="load(event)" (new)="editNew()"
3338
:forel="menuButton"
3439
:behavior="menuButtonBehavior" class="visible-on-ready menu-button">
3540
<!-- the menu is defined as a simple UL list -->
3641
<ul>
37-
<li (click)="trigger('download')">
38-
<i class="material-icons">download</i>
39-
<span>Download component</span>
40-
</li>
4142
<template #item-template>
4243
<li><a href="{link}">{description}</a></li>
4344
</template>
4445
</ul>
45-
4646
</mdl-menu>
4747

4848
<!-- the menu's FAB button -->
49-
<mdl-button #menu-button :type="'icon'" :class="'accent'">
50-
menu
49+
<mdl-button :type="'icon'" (click)="download()">
50+
download
5151
</mdl-button>
5252

5353
</div>

docs/lib/1.2/components/zx-playground.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -30,10 +30,10 @@ class ZxPlayground extends ControllerInstance {
3030
const locationHash = window.location.hash.substring(1);
3131
const cid = locationHash || this.componentId;
3232
let allowed = this.options().menuItems || [];
33-
allowed = allowed.find((item) => item.link.substring(1) === cid);
33+
allowed = allowed.find((item) => item.link === cid);
3434
if (cid !== this.componentId && allowed) {
35-
this.componentId = cid;
3635
this.loadWidgetFiles(cid, () => {
36+
this.componentId = cid;
3737
// TODO: ..
3838
});
3939
return true;
@@ -130,7 +130,6 @@ class ZxPlayground extends ControllerInstance {
130130
});
131131

132132
// get component id from location hash (if any) or via the `load` option
133-
this._hashChangeListener();
134133
this.componentId = this.options().load || this.componentId;
135134
}
136135

@@ -238,6 +237,7 @@ class ZxPlayground extends ControllerInstance {
238237
});
239238

240239
this.view().one('monaco:loaded', () => {
240+
this._hashChangeListener();
241241
// set event listeners
242242
this._editorHtml.getModel().onDidChangeContent((event) => {
243243
this.componentData.html = this._editorHtml.getValue();

source/lib/1.2/components/zx-playground.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@
3939

4040
.toolbar {
4141
display: flex;
42-
place-content: space-between;
42+
place-content: stretch;
4343
align-items: center;
4444
padding-left: 1px;
4545
padding-right: 1px;

source/lib/1.2/components/zx-playground.html

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -28,26 +28,26 @@
2828

2929
</div>
3030

31-
<mdl-menu z-lazy="false"
32-
(download)="download()" (load)="load(event)" (new)="editNew()"
31+
<div style="flex-grow: 1">&nbsp;</div>
32+
33+
<mdl-button #menu-button :type="'icon'" :class="'accent'">
34+
menu
35+
</mdl-button>
36+
37+
<mdl-menu z-lazy="false" (load)="load(event)" (new)="editNew()"
3338
:forel="menuButton"
3439
:behavior="menuButtonBehavior" class="visible-on-ready menu-button">
3540
<!-- the menu is defined as a simple UL list -->
3641
<ul>
37-
<li (click)="trigger('download')">
38-
<i class="material-icons">download</i>
39-
<span>Download component</span>
40-
</li>
4142
<template #item-template>
4243
<li><a href="{link}">{description}</a></li>
4344
</template>
4445
</ul>
45-
4646
</mdl-menu>
4747

4848
<!-- the menu's FAB button -->
49-
<mdl-button #menu-button :type="'icon'" :class="'accent'">
50-
menu
49+
<mdl-button :type="'icon'" (click)="download()">
50+
download
5151
</mdl-button>
5252

5353
</div>

source/lib/1.2/components/zx-playground.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -30,10 +30,10 @@ class ZxPlayground extends ControllerInstance {
3030
const locationHash = window.location.hash.substring(1);
3131
const cid = locationHash || this.componentId;
3232
let allowed = this.options().menuItems || [];
33-
allowed = allowed.find((item) => item.link.substring(1) === cid);
33+
allowed = allowed.find((item) => item.link === cid);
3434
if (cid !== this.componentId && allowed) {
35-
this.componentId = cid;
3635
this.loadWidgetFiles(cid, () => {
36+
this.componentId = cid;
3737
// TODO: ..
3838
});
3939
return true;
@@ -130,7 +130,6 @@ class ZxPlayground extends ControllerInstance {
130130
});
131131

132132
// get component id from location hash (if any) or via the `load` option
133-
this._hashChangeListener();
134133
this.componentId = this.options().load || this.componentId;
135134
}
136135

@@ -238,6 +237,7 @@ class ZxPlayground extends ControllerInstance {
238237
});
239238

240239
this.view().one('monaco:loaded', () => {
240+
this._hashChangeListener();
241241
// set event listeners
242242
this._editorHtml.getModel().onDidChangeContent((event) => {
243243
this.componentData.html = this._editorHtml.getValue();

0 commit comments

Comments
 (0)