@e280/shiny 0.1.0-14 → 0.1.0-15

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@e280/shiny",
3
- "version": "0.1.0-14",
3
+ "version": "0.1.0-15",
4
4
  "description": "✨ web ui components",
5
5
  "license": "MIT",
6
6
  "type": "module",
@@ -14,16 +14,16 @@
14
14
  "s"
15
15
  ],
16
16
  "peerDependencies": {
17
- "@e280/sly": "^0.2.0-26",
17
+ "@e280/sly": "^0.2.0-28",
18
18
  "lit": "^3.3.1"
19
19
  },
20
20
  "dependencies": {
21
- "@e280/strata": "^0.2.0-14",
22
- "@e280/stz": "^0.2.9"
21
+ "@e280/strata": "^0.2.0",
22
+ "@e280/stz": "^0.2.10"
23
23
  },
24
24
  "devDependencies": {
25
25
  "@e280/science": "^0.1.2",
26
- "@e280/scute": "^0.1.0",
26
+ "@e280/scute": "^0.1.1",
27
27
  "http-server": "^14.1.1",
28
28
  "npm-run-all": "^4.1.5",
29
29
  "typescript": "^5.9.3"
@@ -24,7 +24,7 @@ export class ShinyDrawer extends (
24
24
  const button = options.button ?? use.attrs.booleans.button
25
25
  const side = options.side ?? (use.attrs.strings.side === "right" ? "right" : "left")
26
26
  const control = use.once(() => (options.control ?? new DrawerControl()))
27
- states.assign(side)
27
+ states.assign(side, control.isOpen ? "opened" : "closed")
28
28
 
29
29
  use.mount(() => dom.events(window, {keydown: (event: KeyboardEvent) => {
30
30
  if (event.code === "Escape")
@@ -35,7 +35,7 @@ export class ShinyDrawer extends (
35
35
 
36
36
  function renderButton() {
37
37
  return html`
38
- <button @click="${control.toggle}">
38
+ <button part=button @click="${control.toggle}">
39
39
  ${control.isOpen
40
40
  ? html`
41
41
  <slot name=button-x>
@@ -24,6 +24,19 @@ const cssSnippet = `
24
24
  color-mix(in oklab, var(--calm), #222 50%),
25
25
  color-mix(in oklab, var(--calm), #888 50%)
26
26
  );
27
+
28
+ &:state(opened) {}
29
+ &:state(closed) {}
30
+
31
+ &:state(left) {}
32
+ &:state(right) {}
33
+
34
+ &::part(tray) {}
35
+ &::part(blanket) {}
36
+ &::part(button) {}
37
+ &::part(slate) {}
38
+
39
+ &::part(plate) {}
27
40
  }
28
41
  `
29
42
 
@@ -16,6 +16,7 @@ export default css`@layer view {
16
16
  .meta {
17
17
  display: flex;
18
18
  flex-direction: column;
19
+ justify-content: space-between;
19
20
  gap: 1em;
20
21
  }
21
22
 
@@ -25,6 +26,7 @@ export default css`@layer view {
25
26
  flex-direction: column;
26
27
  gap: 0.5em;
27
28
  padding: 0.5em;
29
+ max-height: 20em;
28
30
 
29
31
  background: #0002;
30
32
  box-shadow: inset 0.2em 0.3em 2em #0004;
@@ -44,6 +46,7 @@ export default css`@layer view {
44
46
  }
45
47
 
46
48
  > code {
49
+ flex: 1 1 auto;
47
50
  display: block;
48
51
 
49
52
  white-space: pre;
@@ -14,7 +14,7 @@ export class ShinyDrawer extends (view(use => (context, options) => {
14
14
  const button = options.button ?? use.attrs.booleans.button;
15
15
  const side = options.side ?? (use.attrs.strings.side === "right" ? "right" : "left");
16
16
  const control = use.once(() => (options.control ?? new DrawerControl()));
17
- states.assign(side);
17
+ states.assign(side, control.isOpen ? "opened" : "closed");
18
18
  use.mount(() => dom.events(window, { keydown: (event) => {
19
19
  if (event.code === "Escape")
20
20
  control.close();
@@ -22,7 +22,7 @@ export class ShinyDrawer extends (view(use => (context, options) => {
22
22
  dom.attrs(use.element).booleans.open = control.isOpen;
23
23
  function renderButton() {
24
24
  return html `
25
- <button @click="${control.toggle}">
25
+ <button part=button @click="${control.toggle}">
26
26
  ${control.isOpen
27
27
  ? html `
28
28
  <slot name=button-x>
@@ -1 +1 @@
1
- {"version":3,"file":"component.js","sourceRoot":"","sources":["../../../s/components/drawer/component.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAA;AACxB,OAAO,EAAC,GAAG,EAAE,IAAI,EAAC,MAAM,WAAW,CAAA;AAEnC,OAAO,QAAQ,MAAM,gBAAgB,CAAA;AACrC,OAAO,EAAC,aAAa,EAAC,MAAM,cAAc,CAAA;AAC1C,OAAO,EAAC,MAAM,EAAC,MAAM,uBAAuB,CAAA;AAC5C,OAAO,IAAI,MAAM,6BAA6B,CAAA;AAC9C,OAAO,EAAC,aAAa,EAAC,MAAM,sBAAsB,CAAA;AAClD,OAAO,QAAQ,MAAM,kCAAkC,CAAA;AACvD,OAAO,EAAe,YAAY,EAAC,MAAM,iBAAiB,CAAA;AAE1D,MAAM,OAAO,WAAY,SAAQ,CAChC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,OAAqB,EAAE,OAIlC,EAAE,EAAE;IAEL,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC,CAAA;IACxB,GAAG,CAAC,MAAM,CAAC,aAAa,EAAE,OAAO,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAA;IAClD,MAAM,MAAM,GAAG,GAAG,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAA;IAEtD,MAAM,MAAM,GAAG,OAAO,CAAC,MAAM,IAAI,GAAG,CAAC,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAA;IAC1D,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAA;IACpF,MAAM,OAAO,GAAG,GAAG,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC,OAAO,CAAC,OAAO,IAAI,IAAI,aAAa,EAAE,CAAC,CAAC,CAAA;IACxE,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,CAAA;IAEnB,GAAG,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC,GAAG,CAAC,MAAM,CAAC,MAAM,EAAE,EAAC,OAAO,EAAE,CAAC,KAAoB,EAAE,EAAE;YACrE,IAAI,KAAK,CAAC,IAAI,KAAK,QAAQ;gBAC1B,OAAO,CAAC,KAAK,EAAE,CAAA;QACjB,CAAC,EAAC,CAAC,CAAC,CAAA;IAEJ,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC,IAAI,GAAG,OAAO,CAAC,MAAM,CAAA;IAErD,SAAS,YAAY;QACpB,OAAO,IAAI,CAAA;sBACQ,OAAO,CAAC,MAAM;OAC7B,OAAO,CAAC,MAAM;YACf,CAAC,CAAC,IAAI,CAAA;;UAEF,IAAI;;OAEP;YACD,CAAC,CAAC,IAAI,CAAA;;UAEF,QAAQ;;OAEX;;IAEH,CAAA;IACF,CAAC;IAED,OAAO,IAAI,CAAA;kCACqB,OAAO,CAAC,MAAM,gBAAgB,IAAI;+BACrC,OAAO,CAAC,MAAM;;;iCAGZ,OAAO,CAAC,KAAK,aAAa,CAAC,OAAO,CAAC,MAAM;;;iCAGzC,CAAC,OAAO,CAAC,MAAM;QACxC,MAAM,CAAC,CAAC,CAAA,YAAY,EAAE,CAAC,CAAC,CAAA,IAAI;;;;GAIjC,CAAA;AACF,CAAC,CAAC;KACD,SAAS,CAAC,KAAM,SAAQ,YAAY;IACpC,MAAM,GAAG,GAAG,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC;QAC7B,IAAI,EAAE,OAAO;QACb,MAAM,EAAE,OAAO;QACf,IAAI,EAAE,MAAM;KACZ,CAAC,CAAA;IAEF,IAAI,MAAM,KAAK,OAAO,IAAI,CAAC,MAAM,CAAC,MAAM,CAAA,CAAC,CAAC;IAC1C,IAAI,MAAM,CAAC,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAA,CAAC,CAAC;IAExC,IAAI,IAAI,KAAK,OAAO,IAAI,CAAC,MAAM,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAA,CAAC,CAAC;IACrE,IAAI,IAAI,CAAC,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC,IAAI,GAAG,CAAC,CAAA,CAAC,CAAC;IAEpC,OAAO,GAAG,IAAI,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAA;IAC7C,IAAI,MAAM,KAAK,OAAO,IAAI,CAAC,OAAO,CAAC,MAAM,CAAA,CAAC,CAAC;IAC3C,IAAI,MAAM,KAAK,OAAO,IAAI,CAAC,OAAO,CAAC,MAAM,CAAA,CAAC,CAAC;IAC3C,IAAI,IAAI,KAAK,OAAO,IAAI,CAAC,OAAO,CAAC,IAAI,CAAA,CAAC,CAAC;IACvC,IAAI,KAAK,KAAK,OAAO,IAAI,CAAC,OAAO,CAAC,KAAK,CAAA,CAAC,CAAC;CACzC,CAAC;KACD,KAAK,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,OAAO,EAAE,EAAC,OAAO,EAAE,EAAE,CAAC,OAAO,EAAC,CAAU,CAAC,CAC1D;CAAG"}
1
+ {"version":3,"file":"component.js","sourceRoot":"","sources":["../../../s/components/drawer/component.ts"],"names":[],"mappings":"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"}
@@ -20,6 +20,19 @@ const cssSnippet = `
20
20
  color-mix(in oklab, var(--calm), #222 50%),
21
21
  color-mix(in oklab, var(--calm), #888 50%)
22
22
  );
23
+
24
+ &:state(opened) {}
25
+ &:state(closed) {}
26
+
27
+ &:state(left) {}
28
+ &:state(right) {}
29
+
30
+ &::part(tray) {}
31
+ &::part(blanket) {}
32
+ &::part(button) {}
33
+ &::part(slate) {}
34
+
35
+ &::part(plate) {}
23
36
  }
24
37
  `;
25
38
  const makeExhibit = (side) => ({
@@ -1 +1 @@
1
- {"version":3,"file":"showcase.js","sourceRoot":"","sources":["../../../s/components/drawer/showcase.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAE,IAAI,EAAC,MAAM,KAAK,CAAA;AAC7B,OAAO,EAAC,MAAM,EAAC,MAAM,sBAAsB,CAAA;AAC3C,OAAO,EAAC,QAAQ,EAAC,MAAM,mCAAmC,CAAA;AAG1D,MAAM,IAAI,GAAG,MAAM,EAAE,CAAA;AACrB,MAAM,IAAI,GAAG,MAAM,EAAE,CAAA;AACrB,MAAM,IAAI,GAAG,MAAM,EAAE,CAAA;AAErB,MAAM,UAAU,GAAG;;;;;;;;;;;;;;;;;CAiBlB,CAAA;AAED,MAAM,WAAW,GAAG,CAAC,IAAsB,EAAiB,EAAE,CAAC,CAAC;IAC/D,KAAK,EAAE,IAAI;IACX,OAAO,EAAE,IAAI,CAAA,0CAA0C;IACvD,QAAQ,EAAE;QACT,EAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE;+BACO,IAAI;;;;GAIhC,EAAC;QACF,EAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE;;mCAEW,IAAI;;;;;;GAMpC,EAAC;QACF,EAAC,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,UAAU,EAAC;KAChC;IACD,KAAK,EAAE,GAAG,CAAA,EAAE;IACZ,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAA;IACxB,KAAK,CAAC,WAAW;SACjB,KAAK,CAAC,EAAC,MAAM,EAAE,IAAI,EAAE,IAAI,EAAC,CAAC;SAC3B,QAAQ,CAAC,IAAI,CAAA;;;;uBAIM,IAAI;;;uBAGJ,IAAI;uBACJ,IAAI;;IAEvB,CAAC;SACD,MAAM,EAAE;EACV;CACD,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE,CAAC,QAAQ,CAAC;IAC5C,IAAI,EAAE,QAAQ;IACd,KAAK,EAAE,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;EAoBT;IACD,QAAQ,EAAE;QACT,WAAW,CAAC,MAAM,CAAC;QACnB,WAAW,CAAC,OAAO,CAAC;KACpB;CACD,CAAC,CAAA"}
1
+ {"version":3,"file":"showcase.js","sourceRoot":"","sources":["../../../s/components/drawer/showcase.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAE,IAAI,EAAC,MAAM,KAAK,CAAA;AAC7B,OAAO,EAAC,MAAM,EAAC,MAAM,sBAAsB,CAAA;AAC3C,OAAO,EAAC,QAAQ,EAAC,MAAM,mCAAmC,CAAA;AAG1D,MAAM,IAAI,GAAG,MAAM,EAAE,CAAA;AACrB,MAAM,IAAI,GAAG,MAAM,EAAE,CAAA;AACrB,MAAM,IAAI,GAAG,MAAM,EAAE,CAAA;AAErB,MAAM,UAAU,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8BlB,CAAA;AAED,MAAM,WAAW,GAAG,CAAC,IAAsB,EAAiB,EAAE,CAAC,CAAC;IAC/D,KAAK,EAAE,IAAI;IACX,OAAO,EAAE,IAAI,CAAA,0CAA0C;IACvD,QAAQ,EAAE;QACT,EAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE;+BACO,IAAI;;;;GAIhC,EAAC;QACF,EAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE;;mCAEW,IAAI;;;;;;GAMpC,EAAC;QACF,EAAC,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,UAAU,EAAC;KAChC;IACD,KAAK,EAAE,GAAG,CAAA,EAAE;IACZ,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAAA;IACxB,KAAK,CAAC,WAAW;SACjB,KAAK,CAAC,EAAC,MAAM,EAAE,IAAI,EAAE,IAAI,EAAC,CAAC;SAC3B,QAAQ,CAAC,IAAI,CAAA;;;;uBAIM,IAAI;;;uBAGJ,IAAI;uBACJ,IAAI;;IAEvB,CAAC;SACD,MAAM,EAAE;EACV;CACD,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE,CAAC,QAAQ,CAAC;IAC5C,IAAI,EAAE,QAAQ;IACd,KAAK,EAAE,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;EAoBT;IACD,QAAQ,EAAE;QACT,WAAW,CAAC,MAAM,CAAC;QACnB,WAAW,CAAC,OAAO,CAAC;KACpB;CACD,CAAC,CAAA"}