@e280/sly 0.2.0-1 → 0.2.0-10

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.
Files changed (183) hide show
  1. package/README.md +348 -60
  2. package/package.json +3 -3
  3. package/s/demo/demo.bundle.ts +9 -5
  4. package/s/demo/views/counter.ts +22 -24
  5. package/s/demo/views/demo.ts +10 -6
  6. package/s/demo/views/fastcount.ts +29 -0
  7. package/s/demo/views/loaders.ts +2 -2
  8. package/s/dom/attrs/attrs.ts +21 -0
  9. package/s/dom/attrs/parts/attr-fns.ts +38 -0
  10. package/s/dom/attrs/parts/attr-proxies.ts +35 -0
  11. package/s/dom/attrs/parts/attr-spec.ts +29 -0
  12. package/s/dom/attrs/parts/on-attrs.ts +8 -0
  13. package/s/dom/dom.ts +38 -16
  14. package/s/dom/{register.ts → parts/register.ts} +2 -7
  15. package/s/dom/types.ts +39 -2
  16. package/s/index.html.ts +4 -2
  17. package/s/index.ts +10 -8
  18. package/s/loot/drag-and-drops.ts +82 -0
  19. package/s/loot/drops.ts +35 -0
  20. package/s/loot/helpers.ts +31 -0
  21. package/s/loot/index.ts +5 -0
  22. package/s/ops/loaders/make-loader.ts +3 -3
  23. package/s/ops/loaders/parts/anims.ts +1 -1
  24. package/s/ops/loaders/parts/ascii-anim.ts +3 -3
  25. package/s/ops/loaders/parts/error-display.ts +2 -2
  26. package/s/ops/op.ts +2 -2
  27. package/s/{views → ui/base}/use.ts +19 -19
  28. package/s/ui/base/utils/attr-watcher.ts +22 -0
  29. package/s/ui/base/utils/reactor.ts +21 -0
  30. package/s/ui/base-element.ts +76 -0
  31. package/s/ui/types.ts +33 -0
  32. package/s/ui/view/make-component.ts +33 -0
  33. package/s/ui/view/make-view.ts +40 -0
  34. package/s/{views/utils → ui/view/parts}/apply-attrs.ts +4 -7
  35. package/s/ui/view/parts/capsule.ts +67 -0
  36. package/s/ui/view/parts/chain.ts +33 -0
  37. package/s/ui/view/parts/context.ts +10 -0
  38. package/s/ui/view/parts/directive.ts +29 -0
  39. package/s/ui/view/parts/sly-view.ts +15 -0
  40. package/s/ui/view.ts +24 -0
  41. package/x/demo/demo.bundle.js +8 -4
  42. package/x/demo/demo.bundle.js.map +1 -1
  43. package/x/demo/demo.bundle.min.js +19 -22
  44. package/x/demo/demo.bundle.min.js.map +4 -4
  45. package/x/demo/views/counter.d.ts +374 -1
  46. package/x/demo/views/counter.js +19 -22
  47. package/x/demo/views/counter.js.map +1 -1
  48. package/x/demo/views/demo.d.ts +4 -1
  49. package/x/demo/views/demo.js +10 -5
  50. package/x/demo/views/demo.js.map +1 -1
  51. package/x/demo/views/fastcount.d.ts +12 -0
  52. package/x/demo/views/fastcount.js +21 -0
  53. package/x/demo/views/fastcount.js.map +1 -0
  54. package/x/demo/views/loaders.js +2 -2
  55. package/x/demo/views/loaders.js.map +1 -1
  56. package/x/dom/attrs/attrs.d.ts +20 -0
  57. package/x/dom/attrs/attrs.js +17 -0
  58. package/x/dom/attrs/attrs.js.map +1 -0
  59. package/x/dom/attrs/parts/attr-fns.d.ts +13 -0
  60. package/x/dom/attrs/parts/attr-fns.js +42 -0
  61. package/x/dom/attrs/parts/attr-fns.js.map +1 -0
  62. package/x/dom/attrs/parts/attr-proxies.d.ts +8 -0
  63. package/x/dom/attrs/parts/attr-proxies.js +21 -0
  64. package/x/dom/attrs/parts/attr-proxies.js.map +1 -0
  65. package/x/dom/attrs/parts/attr-spec.d.ts +3 -0
  66. package/x/dom/attrs/parts/attr-spec.js +21 -0
  67. package/x/dom/attrs/parts/attr-spec.js.map +1 -0
  68. package/x/dom/attrs/parts/on-attrs.d.ts +2 -0
  69. package/x/dom/attrs/parts/on-attrs.js +7 -0
  70. package/x/dom/attrs/parts/on-attrs.js.map +1 -0
  71. package/x/dom/dom.d.ts +18 -7
  72. package/x/dom/dom.js +25 -12
  73. package/x/dom/dom.js.map +1 -1
  74. package/x/dom/parts/dashify.js.map +1 -0
  75. package/x/dom/{register.d.ts → parts/register.d.ts} +2 -6
  76. package/x/dom/parts/register.js.map +1 -0
  77. package/x/dom/types.d.ts +14 -2
  78. package/x/index.d.ts +9 -7
  79. package/x/index.html +6 -4
  80. package/x/index.html.js +4 -2
  81. package/x/index.html.js.map +1 -1
  82. package/x/index.js +9 -7
  83. package/x/index.js.map +1 -1
  84. package/x/loot/drag-and-drops.d.ts +30 -0
  85. package/x/loot/drag-and-drops.js +63 -0
  86. package/x/loot/drag-and-drops.js.map +1 -0
  87. package/x/loot/drops.d.ts +14 -0
  88. package/x/loot/drops.js +25 -0
  89. package/x/loot/drops.js.map +1 -0
  90. package/x/loot/helpers.d.ts +3 -0
  91. package/x/loot/helpers.js +21 -0
  92. package/x/loot/helpers.js.map +1 -0
  93. package/x/loot/index.d.ts +3 -0
  94. package/x/loot/index.js +4 -0
  95. package/x/loot/index.js.map +1 -0
  96. package/x/ops/loaders/make-loader.d.ts +1 -1
  97. package/x/ops/loaders/make-loader.js +2 -2
  98. package/x/ops/loaders/make-loader.js.map +1 -1
  99. package/x/ops/loaders/parts/anims.d.ts +1 -1
  100. package/x/ops/loaders/parts/ascii-anim.d.ts +2 -2
  101. package/x/ops/loaders/parts/ascii-anim.js +2 -2
  102. package/x/ops/loaders/parts/ascii-anim.js.map +1 -1
  103. package/x/ops/loaders/parts/error-display.js +2 -2
  104. package/x/ops/loaders/parts/error-display.js.map +1 -1
  105. package/x/ops/op.d.ts +2 -2
  106. package/x/ops/op.js +2 -2
  107. package/x/ops/op.js.map +1 -1
  108. package/x/ui/base/css-reset.js.map +1 -0
  109. package/x/{views → ui/base}/use.d.ts +6 -6
  110. package/x/{views → ui/base}/use.js +10 -12
  111. package/x/ui/base/use.js.map +1 -0
  112. package/x/ui/base/utils/apply-styles.js.map +1 -0
  113. package/x/ui/base/utils/attr-watcher.d.ts +8 -0
  114. package/x/ui/base/utils/attr-watcher.js +20 -0
  115. package/x/ui/base/utils/attr-watcher.js.map +1 -0
  116. package/x/ui/base/utils/mounts.js.map +1 -0
  117. package/x/ui/base/utils/reactor.d.ts +5 -0
  118. package/x/ui/base/utils/reactor.js +17 -0
  119. package/x/ui/base/utils/reactor.js.map +1 -0
  120. package/x/ui/base-element.d.ts +19 -0
  121. package/x/ui/base-element.js +52 -0
  122. package/x/ui/base-element.js.map +1 -0
  123. package/x/ui/types.d.ts +20 -0
  124. package/x/{views → ui}/types.js.map +1 -1
  125. package/x/ui/view/make-component.d.ts +5 -0
  126. package/x/ui/view/make-component.js +16 -0
  127. package/x/ui/view/make-component.js.map +1 -0
  128. package/x/ui/view/make-view.d.ts +2 -0
  129. package/x/ui/view/make-view.js +16 -0
  130. package/x/ui/view/make-view.js.map +1 -0
  131. package/x/ui/view/parts/apply-attrs.d.ts +2 -0
  132. package/x/{views/utils → ui/view/parts}/apply-attrs.js +2 -4
  133. package/x/ui/view/parts/apply-attrs.js.map +1 -0
  134. package/x/ui/view/parts/capsule.d.ts +13 -0
  135. package/x/ui/view/parts/capsule.js +49 -0
  136. package/x/ui/view/parts/capsule.js.map +1 -0
  137. package/x/ui/view/parts/chain.d.ts +11 -0
  138. package/x/ui/view/parts/chain.js +21 -0
  139. package/x/ui/view/parts/chain.js.map +1 -0
  140. package/x/ui/view/parts/context.d.ts +8 -0
  141. package/x/ui/view/parts/context.js +10 -0
  142. package/x/ui/view/parts/context.js.map +1 -0
  143. package/x/ui/view/parts/directive.d.ts +5 -0
  144. package/x/ui/view/parts/directive.js +18 -0
  145. package/x/ui/view/parts/directive.js.map +1 -0
  146. package/x/ui/view/parts/sly-view.d.ts +5 -0
  147. package/x/ui/view/parts/sly-view.js +13 -0
  148. package/x/ui/view/parts/sly-view.js.map +1 -0
  149. package/x/ui/view.d.ts +11 -0
  150. package/x/ui/view.js +15 -0
  151. package/x/ui/view.js.map +1 -0
  152. package/s/views/attributes.ts +0 -89
  153. package/s/views/types.ts +0 -40
  154. package/s/views/view.ts +0 -150
  155. package/x/dom/dashify.js.map +0 -1
  156. package/x/dom/register.js.map +0 -1
  157. package/x/views/attributes.d.ts +0 -10
  158. package/x/views/attributes.js +0 -46
  159. package/x/views/attributes.js.map +0 -1
  160. package/x/views/css-reset.js.map +0 -1
  161. package/x/views/types.d.ts +0 -31
  162. package/x/views/use.js.map +0 -1
  163. package/x/views/utils/apply-attrs.d.ts +0 -2
  164. package/x/views/utils/apply-attrs.js.map +0 -1
  165. package/x/views/utils/apply-styles.js.map +0 -1
  166. package/x/views/utils/mounts.js.map +0 -1
  167. package/x/views/view.d.ts +0 -9
  168. package/x/views/view.js +0 -116
  169. package/x/views/view.js.map +0 -1
  170. /package/s/dom/{dashify.ts → parts/dashify.ts} +0 -0
  171. /package/s/{views → ui/base}/css-reset.ts +0 -0
  172. /package/s/{views → ui/base}/utils/apply-styles.ts +0 -0
  173. /package/s/{views → ui/base}/utils/mounts.ts +0 -0
  174. /package/x/dom/{dashify.d.ts → parts/dashify.d.ts} +0 -0
  175. /package/x/dom/{dashify.js → parts/dashify.js} +0 -0
  176. /package/x/dom/{register.js → parts/register.js} +0 -0
  177. /package/x/{views → ui/base}/css-reset.d.ts +0 -0
  178. /package/x/{views → ui/base}/css-reset.js +0 -0
  179. /package/x/{views → ui/base}/utils/apply-styles.d.ts +0 -0
  180. /package/x/{views → ui/base}/utils/apply-styles.js +0 -0
  181. /package/x/{views → ui/base}/utils/mounts.d.ts +0 -0
  182. /package/x/{views → ui/base}/utils/mounts.js +0 -0
  183. /package/x/{views → ui}/types.js +0 -0
@@ -0,0 +1 @@
1
+ {"version":3,"file":"directive.js","sourceRoot":"","sources":["../../../../s/ui/view/parts/directive.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,cAAc,EAAE,SAAS,EAAkB,MAAM,wBAAwB,CAAA;AAEjF,OAAO,EAAC,WAAW,EAAC,MAAM,cAAc,CAAA;AAGxC,+GAA+G;AAC/G,MAAM,UAAU,iBAAiB,CAC/B,MAAqB,EACrB,QAAwB;IAGzB,OAAO,SAAS,CAAC,MAAM,aAAc,SAAQ,cAAc;QAC1D,QAAQ,GAAG,IAAI,WAAW,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAA;QAE5C,MAAM,CAAC,OAA2B;YACjC,OAAO,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,OAAO,CAAC,CAAA;QACrC,CAAC;QAED,YAAY;YACX,IAAI,CAAC,QAAQ,CAAC,YAAY,EAAE,CAAA;QAC7B,CAAC;QAED,WAAW;YACV,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAA;QAC5B,CAAC;KACD,CAAqD,CAAA;AACvD,CAAC"}
@@ -0,0 +1,5 @@
1
+ /** <sly-view> element that views are rendered into. */
2
+ export declare class SlyView extends HTMLElement {
3
+ #private;
4
+ static make(): SlyView;
5
+ }
@@ -0,0 +1,13 @@
1
+ import { dom } from "../../../dom/dom.js";
2
+ /** <sly-view> element that views are rendered into. */
3
+ export class SlyView extends HTMLElement {
4
+ static #registered = false;
5
+ static make() {
6
+ if (!this.#registered) {
7
+ dom.register({ SlyView }, { soft: true, upgrade: true });
8
+ this.#registered = true;
9
+ }
10
+ return document.createElement("sly-view");
11
+ }
12
+ }
13
+ //# sourceMappingURL=sly-view.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"sly-view.js","sourceRoot":"","sources":["../../../../s/ui/view/parts/sly-view.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAC,MAAM,qBAAqB,CAAA;AAEvC,uDAAuD;AACvD,MAAM,OAAO,OAAQ,SAAQ,WAAW;IACvC,MAAM,CAAC,WAAW,GAAG,KAAK,CAAA;IAC1B,MAAM,CAAC,IAAI;QACV,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC;YACvB,GAAG,CAAC,QAAQ,CAAC,EAAC,OAAO,EAAC,EAAE,EAAC,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC,CAAA;YACpD,IAAI,CAAC,WAAW,GAAG,IAAI,CAAA;QACxB,CAAC;QACD,OAAO,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAY,CAAA;IACrD,CAAC"}
package/x/ui/view.d.ts ADDED
@@ -0,0 +1,11 @@
1
+ import { Content, ViewFn } from "./types.js";
2
+ import { Use } from "./base/use.js";
3
+ import { BaseElement } from "./base-element.js";
4
+ export declare function view<Props extends any[]>(fn: ViewFn<Props>): import("./types.js").View<Props>;
5
+ export declare namespace view {
6
+ var settings: (settings: ShadowRootInit) => {
7
+ render: <Props extends any[]>(fn: ViewFn<Props>) => import("./types.js").View<Props>;
8
+ };
9
+ var render: typeof view;
10
+ var component: (fn: (use: Use) => Content) => import("./types.js").ComponentClass<typeof BaseElement, []>;
11
+ }
package/x/ui/view.js ADDED
@@ -0,0 +1,15 @@
1
+ import { makeView } from "./view/make-view.js";
2
+ import { BaseElement } from "./base-element.js";
3
+ export function view(fn) {
4
+ return makeView(fn, { mode: "open" });
5
+ }
6
+ view.settings = (settings) => ({
7
+ render: (fn) => {
8
+ return makeView(fn, settings);
9
+ }
10
+ });
11
+ view.render = view;
12
+ view.component = (fn) => (view(use => () => fn(use))
13
+ .component(BaseElement)
14
+ .props(() => []));
15
+ //# sourceMappingURL=view.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"view.js","sourceRoot":"","sources":["../../s/ui/view.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,QAAQ,EAAC,MAAM,qBAAqB,CAAA;AAE5C,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAE/C,MAAM,UAAU,IAAI,CAAsB,EAAiB;IAC1D,OAAO,QAAQ,CAAC,EAAE,EAAE,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC,CAAA;AACpC,CAAC;AAED,IAAI,CAAC,QAAQ,GAAG,CAAC,QAAwB,EAAE,EAAE,CAAC,CAAC;IAC9C,MAAM,EAAE,CAAsB,EAAiB,EAAE,EAAE;QAClD,OAAO,QAAQ,CAAC,EAAE,EAAE,QAAQ,CAAC,CAAA;IAC9B,CAAC;CACD,CAAC,CAAA;AAEF,IAAI,CAAC,MAAM,GAAG,IAAI,CAAA;AAElB,IAAI,CAAC,SAAS,GAAG,CAAC,EAAyB,EAAE,EAAE,CAAC,CAC/C,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;KACxB,SAAS,CAAC,WAAW,CAAC;KACtB,KAAK,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,CACjB,CAAA"}
@@ -1,89 +0,0 @@
1
-
2
- export type AttrKind = (
3
- | typeof String
4
- | typeof Number
5
- | typeof Boolean
6
- )
7
-
8
- export type AttrType<H extends AttrKind> = (
9
- H extends typeof String
10
- ? string | undefined
11
-
12
- : H extends typeof Number
13
- ? number | undefined
14
-
15
- : H extends typeof Boolean
16
- ? boolean
17
-
18
- : never
19
- )
20
-
21
- export type AttrSpec = {
22
- [key: string]: AttrKind
23
- }
24
-
25
- export type AttrTypes<A extends AttrSpec> = {
26
- [P in keyof A]: AttrType<A[P]>
27
- }
28
-
29
- export const attributes = <A extends AttrSpec>(
30
- element: HTMLElement,
31
- spec: A,
32
- ) => new Proxy(spec, {
33
-
34
- get: (_target, name: string) => {
35
- const type = spec[name]
36
- const raw = element.getAttribute(name)
37
-
38
- switch (type) {
39
- case String:
40
- return raw ?? undefined
41
-
42
- case Number:
43
- return raw !== null
44
- ? Number(raw)
45
- : undefined
46
-
47
- case Boolean:
48
- return raw !== null
49
-
50
- default:
51
- throw new Error(`invalid attribute type for "${name}"`)
52
- }
53
- },
54
-
55
- set: (_target, name: string, value: any) => {
56
- const type = spec[name]
57
-
58
- switch (type) {
59
- case String: {
60
- element.setAttribute(name, value)
61
- return true
62
- }
63
-
64
- case Number: {
65
- element.setAttribute(name, value.toString())
66
- return true
67
- }
68
-
69
- case Boolean: {
70
- if (value)
71
- element.setAttribute(name, "")
72
- else
73
- element.removeAttribute(name)
74
- return true
75
- }
76
-
77
- default:
78
- throw new Error(`invalid attribute type for "${name}"`)
79
- }
80
- },
81
-
82
- }) as any as AttrTypes<A>
83
-
84
- export function onAttrChange(element: HTMLElement, fn: () => void) {
85
- const observer = new MutationObserver(fn)
86
- observer.observe(element, {attributes: true})
87
- return () => observer.disconnect()
88
- }
89
-
package/s/views/types.ts DELETED
@@ -1,40 +0,0 @@
1
-
2
- import {Constructor} from "@e280/stz"
3
- import {DirectiveResult} from "lit/directive.js"
4
- import {CSSResultGroup, TemplateResult} from "lit"
5
-
6
- import {Use} from "./use.js"
7
-
8
- export type Content = TemplateResult | DirectiveResult | HTMLElement | string | null | undefined | void | Content[]
9
- export type AttrValue = string | boolean | number | undefined | null | void
10
-
11
- export type Component<Props extends any[] = []> = {
12
- render(...props: Props): void
13
- } & HTMLElement
14
-
15
- export type ComponentFn = (use: Use) => Content
16
- export type ViewFn<Props extends any[]> = (use: Use) => (...props: Props) => Content
17
- export type BasicView<Props extends any[]> = (...props: Props) => DirectiveResult<any>
18
- export type View<Props extends any[]> = BasicView<Props> & {
19
- props: (...props: Props) => ViewChain
20
- component: (...props: Props) => Constructor<Component>
21
- }
22
-
23
- export type ViewSettings = ShadowRootInit & {
24
- tag?: string
25
- name?: string
26
- styles?: CSSResultGroup
27
- }
28
-
29
- export type ViewChain = {
30
- children(...c: Content[]): ViewChain
31
- attrs(a: Record<string, AttrValue>): ViewChain
32
- attr(n: string, v: AttrValue): ViewChain
33
- render(): DirectiveResult<any>
34
- }
35
-
36
- export type ViewContext = {
37
- children: Content[]
38
- attrs: Record<string, AttrValue>
39
- }
40
-
package/s/views/view.ts DELETED
@@ -1,150 +0,0 @@
1
-
2
- import {render} from "lit"
3
- import {debounce, MapG} from "@e280/stz"
4
- import {directive} from "lit/directive.js"
5
- import {tracker} from "@e280/strata/tracker"
6
- import {AsyncDirective} from "lit/async-directive.js"
7
-
8
- import {register} from "../dom/register.js"
9
- import {applyAttrs} from "./utils/apply-attrs.js"
10
- import {applyStyles} from "./utils/apply-styles.js"
11
- import {Use, _wrap, _disconnect, _reconnect} from "./use.js"
12
- import {AttrValue, ComponentFn, Content, View, ViewFn, ViewSettings, ViewContext} from "./types.js"
13
-
14
- export const view = setupView({mode: "open"})
15
- export class SlyView extends HTMLElement {}
16
- register({SlyView}, {soft: true, upgrade: true})
17
-
18
- function setupView(settings: ViewSettings) {
19
- function view<Props extends any[]>(fn: ViewFn<Props>): View<Props> {
20
- type Situation = {
21
- getElement: () => HTMLElement
22
- isComponent: boolean
23
- }
24
-
25
- const make = (situation: Situation) => class ViewDirective extends AsyncDirective {
26
- #element = situation.getElement()
27
- #shadow = this.#element.attachShadow(settings)
28
- #renderDebounced = debounce(0, () => this.#renderNow())
29
- #tracking = new MapG<any, () => void>
30
- #params!: {context: ViewContext, props: Props}
31
-
32
- #use = new Use(
33
- this.#element,
34
- this.#shadow,
35
- () => this.#renderNow(),
36
- this.#renderDebounced,
37
- )
38
-
39
- #fn = (() => {
40
- const fn2 = fn(this.#use)
41
- this.#element.setAttribute("view", settings.name ?? "")
42
- if (settings.styles) applyStyles(this.#shadow, settings.styles)
43
- return fn2
44
- })()
45
-
46
- #renderNow() {
47
- if (!this.#params) return
48
- if (!this.isConnected) return
49
- const {context: w, props} = this.#params
50
-
51
- this.#use[_wrap](() => {
52
- // apply html attributes
53
- applyAttrs(this.#element, w.attrs)
54
-
55
- // render the template, tracking strata items
56
- const {result, seen} = tracker.observe(() => this.#fn(...props))
57
-
58
- // inject the template
59
- render(result, this.#shadow)
60
-
61
- // reacting to changes
62
- for (const item of seen)
63
- this.#tracking.guarantee(
64
- item,
65
- () => tracker.subscribe(item, async() => this.#renderDebounced()),
66
- )
67
-
68
- // inject content into light dom
69
- if (!situation.isComponent)
70
- render(w.children, this.#element)
71
- })
72
- }
73
-
74
- render(context: ViewContext, props: Props) {
75
- this.#params = {context: context, props}
76
- this.#renderNow()
77
- return situation.isComponent ? null : this.#element
78
- }
79
-
80
- disconnected() {
81
- this.#use[_disconnect]()
82
- for (const untrack of this.#tracking.values())
83
- untrack()
84
- this.#tracking.clear()
85
- }
86
-
87
- reconnected() {
88
- this.#use[_reconnect]()
89
- }
90
- }
91
-
92
- const d = directive(make({
93
- getElement: () => document.createElement(settings.tag ?? "sly-view"),
94
- isComponent: false,
95
- }))
96
-
97
- const freshViewContext = (): ViewContext => ({attrs: {}, children: []})
98
-
99
- function rendy(...props: Props) {
100
- return d(freshViewContext(), props)
101
- }
102
-
103
- rendy.props = (...props: Props) => {
104
- let ctx = freshViewContext()
105
- const chain = {
106
- children(...children: Content[]) {
107
- ctx = {...ctx, children: [...ctx.children, ...children]}
108
- return chain
109
- },
110
- attrs(attrs: Record<string, AttrValue>) {
111
- ctx = {...ctx, attrs: {...ctx.attrs, ...attrs}}
112
- return chain
113
- },
114
- attr(name: string, value: AttrValue) {
115
- ctx = {...ctx, attrs: {...ctx.attrs, [name]: value}}
116
- return chain
117
- },
118
- render() {
119
- return d(ctx, props)
120
- },
121
- }
122
- return chain
123
- }
124
-
125
- rendy.component = (...props: Props) => class extends HTMLElement {
126
- #directive = directive(
127
- make({
128
- getElement: () => this,
129
- isComponent: true,
130
- })
131
- )
132
- constructor() {
133
- super()
134
- this.render(...props)
135
- }
136
- render(...props: Props) {
137
- if (this.isConnected)
138
- render(this.#directive(freshViewContext(), props), this)
139
- }
140
- }
141
-
142
- return rendy
143
- }
144
-
145
- view.declare = view
146
- view.settings = (settings2: Partial<ViewSettings>) => setupView({...settings, ...settings2})
147
- view.component = (fn: ComponentFn) => view(use => () => fn(use)).component()
148
- return view
149
- }
150
-
@@ -1 +0,0 @@
1
- {"version":3,"file":"dashify.js","sourceRoot":"","sources":["../../s/dom/dashify.ts"],"names":[],"mappings":"AACA;;;;;GAKG;AACH,MAAM,UAAU,OAAO,CAAC,KAAa;IACpC,OAAO,KAAK,CAAC,OAAO,CAAC,sBAAsB,EAAE,KAAK,CAAC,CAAC,WAAW,EAAE,CAAA;AAClE,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"register.js","sourceRoot":"","sources":["../../s/dom/register.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,OAAO,EAAC,MAAM,cAAc,CAAA;AAQpC;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,QAAQ,CACtB,QAAW,EACX,UAAwC,EAAE;IAG3C,MAAM,EACL,IAAI,GAAG,KAAK,EACZ,OAAO,GAAG,IAAI,GACd,GAAG,OAAO,CAAA;IAEX,KAAK,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC;QACxD,MAAM,GAAG,GAAG,OAAO,CAAC,IAAI,CAAC,CAAA;QACzB,MAAM,OAAO,GAAG,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;QAEvC,IAAI,IAAI,IAAI,OAAO;YAClB,SAAQ;QAET,cAAc,CAAC,MAAM,CAAC,GAAG,EAAE,OAAO,CAAC,CAAA;QAEnC,IAAI,OAAO;YACV,QAAQ,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE;gBAChD,IAAI,OAAO,CAAC,WAAW,KAAK,WAAW;oBACtC,cAAc,CAAC,OAAO,CAAC,OAAO,CAAC,CAAA;YACjC,CAAC,CAAC,CAAA;IACJ,CAAC;AACF,CAAC"}
@@ -1,10 +0,0 @@
1
- export type AttrKind = (typeof String | typeof Number | typeof Boolean);
2
- export type AttrType<H extends AttrKind> = (H extends typeof String ? string | undefined : H extends typeof Number ? number | undefined : H extends typeof Boolean ? boolean : never);
3
- export type AttrSpec = {
4
- [key: string]: AttrKind;
5
- };
6
- export type AttrTypes<A extends AttrSpec> = {
7
- [P in keyof A]: AttrType<A[P]>;
8
- };
9
- export declare const attributes: <A extends AttrSpec>(element: HTMLElement, spec: A) => AttrTypes<A>;
10
- export declare function onAttrChange(element: HTMLElement, fn: () => void): () => void;
@@ -1,46 +0,0 @@
1
- export const attributes = (element, spec) => new Proxy(spec, {
2
- get: (_target, name) => {
3
- const type = spec[name];
4
- const raw = element.getAttribute(name);
5
- switch (type) {
6
- case String:
7
- return raw ?? undefined;
8
- case Number:
9
- return raw !== null
10
- ? Number(raw)
11
- : undefined;
12
- case Boolean:
13
- return raw !== null;
14
- default:
15
- throw new Error(`invalid attribute type for "${name}"`);
16
- }
17
- },
18
- set: (_target, name, value) => {
19
- const type = spec[name];
20
- switch (type) {
21
- case String: {
22
- element.setAttribute(name, value);
23
- return true;
24
- }
25
- case Number: {
26
- element.setAttribute(name, value.toString());
27
- return true;
28
- }
29
- case Boolean: {
30
- if (value)
31
- element.setAttribute(name, "");
32
- else
33
- element.removeAttribute(name);
34
- return true;
35
- }
36
- default:
37
- throw new Error(`invalid attribute type for "${name}"`);
38
- }
39
- },
40
- });
41
- export function onAttrChange(element, fn) {
42
- const observer = new MutationObserver(fn);
43
- observer.observe(element, { attributes: true });
44
- return () => observer.disconnect();
45
- }
46
- //# sourceMappingURL=attributes.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"attributes.js","sourceRoot":"","sources":["../../s/views/attributes.ts"],"names":[],"mappings":"AA4BA,MAAM,CAAC,MAAM,UAAU,GAAG,CACxB,OAAoB,EACpB,IAAO,EACN,EAAE,CAAC,IAAI,KAAK,CAAC,IAAI,EAAE;IAErB,GAAG,EAAE,CAAC,OAAO,EAAE,IAAY,EAAE,EAAE;QAC9B,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,CAAA;QACvB,MAAM,GAAG,GAAG,OAAO,CAAC,YAAY,CAAC,IAAI,CAAC,CAAA;QAEtC,QAAQ,IAAI,EAAE,CAAC;YACd,KAAK,MAAM;gBACV,OAAO,GAAG,IAAI,SAAS,CAAA;YAExB,KAAK,MAAM;gBACV,OAAO,GAAG,KAAK,IAAI;oBAClB,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC;oBACb,CAAC,CAAC,SAAS,CAAA;YAEb,KAAK,OAAO;gBACX,OAAO,GAAG,KAAK,IAAI,CAAA;YAEpB;gBACC,MAAM,IAAI,KAAK,CAAC,+BAA+B,IAAI,GAAG,CAAC,CAAA;QACzD,CAAC;IACF,CAAC;IAED,GAAG,EAAE,CAAC,OAAO,EAAE,IAAY,EAAE,KAAU,EAAE,EAAE;QAC1C,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,CAAA;QAEvB,QAAQ,IAAI,EAAE,CAAC;YACd,KAAK,MAAM,CAAC,CAAC,CAAC;gBACb,OAAO,CAAC,YAAY,CAAC,IAAI,EAAE,KAAK,CAAC,CAAA;gBACjC,OAAO,IAAI,CAAA;YACZ,CAAC;YAED,KAAK,MAAM,CAAC,CAAC,CAAC;gBACb,OAAO,CAAC,YAAY,CAAC,IAAI,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAA;gBAC5C,OAAO,IAAI,CAAA;YACZ,CAAC;YAED,KAAK,OAAO,CAAC,CAAC,CAAC;gBACd,IAAI,KAAK;oBACR,OAAO,CAAC,YAAY,CAAC,IAAI,EAAE,EAAE,CAAC,CAAA;;oBAE9B,OAAO,CAAC,eAAe,CAAC,IAAI,CAAC,CAAA;gBAC9B,OAAO,IAAI,CAAA;YACZ,CAAC;YAED;gBACC,MAAM,IAAI,KAAK,CAAC,+BAA+B,IAAI,GAAG,CAAC,CAAA;QACzD,CAAC;IACF,CAAC;CAED,CAAwB,CAAA;AAEzB,MAAM,UAAU,YAAY,CAAC,OAAoB,EAAE,EAAc;IAChE,MAAM,QAAQ,GAAG,IAAI,gBAAgB,CAAC,EAAE,CAAC,CAAA;IACzC,QAAQ,CAAC,OAAO,CAAC,OAAO,EAAE,EAAC,UAAU,EAAE,IAAI,EAAC,CAAC,CAAA;IAC7C,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAA;AACnC,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"css-reset.js","sourceRoot":"","sources":["../../s/views/css-reset.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,GAAG,EAAiB,MAAM,KAAK,CAAA;AAEvC,MAAM,CAAC,MAAM,QAAQ,GAAmB,GAAG,CAAA;;;;;;;;;;;;;;;;CAgB1C,CAAA"}
@@ -1,31 +0,0 @@
1
- import { Constructor } from "@e280/stz";
2
- import { DirectiveResult } from "lit/directive.js";
3
- import { CSSResultGroup, TemplateResult } from "lit";
4
- import { Use } from "./use.js";
5
- export type Content = TemplateResult | DirectiveResult | HTMLElement | string | null | undefined | void | Content[];
6
- export type AttrValue = string | boolean | number | undefined | null | void;
7
- export type Component<Props extends any[] = []> = {
8
- render(...props: Props): void;
9
- } & HTMLElement;
10
- export type ComponentFn = (use: Use) => Content;
11
- export type ViewFn<Props extends any[]> = (use: Use) => (...props: Props) => Content;
12
- export type BasicView<Props extends any[]> = (...props: Props) => DirectiveResult<any>;
13
- export type View<Props extends any[]> = BasicView<Props> & {
14
- props: (...props: Props) => ViewChain;
15
- component: (...props: Props) => Constructor<Component>;
16
- };
17
- export type ViewSettings = ShadowRootInit & {
18
- tag?: string;
19
- name?: string;
20
- styles?: CSSResultGroup;
21
- };
22
- export type ViewChain = {
23
- children(...c: Content[]): ViewChain;
24
- attrs(a: Record<string, AttrValue>): ViewChain;
25
- attr(n: string, v: AttrValue): ViewChain;
26
- render(): DirectiveResult<any>;
27
- };
28
- export type ViewContext = {
29
- children: Content[];
30
- attrs: Record<string, AttrValue>;
31
- };
@@ -1 +0,0 @@
1
- {"version":3,"file":"use.js","sourceRoot":"","sources":["../../s/views/use.ts"],"names":[],"mappings":"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"}
@@ -1,2 +0,0 @@
1
- import { AttrValue } from "../types.js";
2
- export declare function applyAttrs(element: HTMLElement, attrs: Record<string, AttrValue>): void;
@@ -1 +0,0 @@
1
- {"version":3,"file":"apply-attrs.js","sourceRoot":"","sources":["../../../s/views/utils/apply-attrs.ts"],"names":[],"mappings":"AAGA,MAAM,UAAU,UAAU,CACxB,OAAoB,EACpB,KAAgC;IAGjC,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;QAClD,IAAI,KAAK,KAAK,SAAS;YACtB,OAAO,CAAC,eAAe,CAAC,GAAG,CAAC,CAAA;aAExB,IAAI,KAAK,KAAK,IAAI;YACtB,OAAO,CAAC,eAAe,CAAC,GAAG,CAAC,CAAA;aAExB,IAAI,OAAO,KAAK,KAAK,QAAQ;YACjC,OAAO,CAAC,YAAY,CAAC,GAAG,EAAE,KAAK,CAAC,CAAA;aAE5B,IAAI,OAAO,KAAK,KAAK,QAAQ;YACjC,OAAO,CAAC,YAAY,CAAC,GAAG,EAAE,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAA;aAEvC,IAAI,OAAO,KAAK,KAAK,SAAS,EAAE,CAAC;YACrC,IAAI,KAAK,KAAK,IAAI;gBACjB,OAAO,CAAC,YAAY,CAAC,GAAG,EAAE,EAAE,CAAC,CAAA;;gBAE7B,OAAO,CAAC,eAAe,CAAC,GAAG,CAAC,CAAA;QAC9B,CAAC;;YAGA,OAAO,CAAC,IAAI,CAAC,0BAA0B,GAAG,OAAO,OAAO,KAAK,EAAE,CAAC,CAAA;IAClE,CAAC;AACF,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"apply-styles.js","sourceRoot":"","sources":["../../../s/views/utils/apply-styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,WAAW,EAAqC,kBAAkB,EAAC,MAAM,KAAK,CAAA;AAEtF,MAAM,UAAU,WAAW,CAAC,MAAkB,EAAE,MAAuB;IACtE,WAAW,CAAC,MAAM,EAAE,aAAa,CAAC,MAAM,CAAC,CAAC,CAAA;AAC3C,CAAC;AAED,SAAS,aAAa,CAAC,MAAuB;IAC7C,MAAM,aAAa,GAAG,EAAE,CAAA;IAExB,IAAI,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC;QAC3B,MAAM,GAAG,GAAG,IAAI,GAAG,CAAE,MAAyB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,OAAO,EAAE,CAAC,CAAA;QACxE,KAAK,MAAM,CAAC,IAAI,GAAG;YAClB,aAAa,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAsB,CAAC,CAAC,CAAA;IACnE,CAAC;SACI,IAAI,MAAM,KAAK,SAAS;QAC5B,aAAa,CAAC,IAAI,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAC,CAAA;IAE/C,OAAO,aAAa,CAAA;AACrB,CAAC"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"mounts.js","sourceRoot":"","sources":["../../../s/views/utils/mounts.ts"],"names":[],"mappings":"AACA,MAAM,OAAO,MAAM;IAClB,SAAS,GAAyB,EAAE,CAAA;IACpC,WAAW,GAAmB,EAAE,CAAA;IAEhC,KAAK,CAAC,KAAuB;QAC5B,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QAC1B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAA;IAC/B,CAAC;IAED,UAAU;QACT,KAAK,MAAM,OAAO,IAAI,IAAI,CAAC,WAAW;YACrC,OAAO,EAAE,CAAA;QACV,IAAI,CAAC,WAAW,GAAG,EAAE,CAAA;IACtB,CAAC;IAED,UAAU;QACT,KAAK,MAAM,KAAK,IAAI,IAAI,CAAC,SAAS;YACjC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAA;IAChC,CAAC;CACD"}
package/x/views/view.d.ts DELETED
@@ -1,9 +0,0 @@
1
- import { ComponentFn, View, ViewFn, ViewSettings } from "./types.js";
2
- export declare const view: {
3
- <Props extends any[]>(fn: ViewFn<Props>): View<Props>;
4
- declare: /*elided*/ any;
5
- settings(settings2: Partial<ViewSettings>): /*elided*/ any;
6
- component(fn: ComponentFn): import("@e280/stz").Constructor<import("./types.js").Component<[]>>;
7
- };
8
- export declare class SlyView extends HTMLElement {
9
- }
package/x/views/view.js DELETED
@@ -1,116 +0,0 @@
1
- import { render } from "lit";
2
- import { debounce, MapG } from "@e280/stz";
3
- import { directive } from "lit/directive.js";
4
- import { tracker } from "@e280/strata/tracker";
5
- import { AsyncDirective } from "lit/async-directive.js";
6
- import { register } from "../dom/register.js";
7
- import { applyAttrs } from "./utils/apply-attrs.js";
8
- import { applyStyles } from "./utils/apply-styles.js";
9
- import { Use, _wrap, _disconnect, _reconnect } from "./use.js";
10
- export const view = setupView({ mode: "open" });
11
- export class SlyView extends HTMLElement {
12
- }
13
- register({ SlyView }, { soft: true, upgrade: true });
14
- function setupView(settings) {
15
- function view(fn) {
16
- const make = (situation) => class ViewDirective extends AsyncDirective {
17
- #element = situation.getElement();
18
- #shadow = this.#element.attachShadow(settings);
19
- #renderDebounced = debounce(0, () => this.#renderNow());
20
- #tracking = new MapG;
21
- #params;
22
- #use = new Use(this.#element, this.#shadow, () => this.#renderNow(), this.#renderDebounced);
23
- #fn = (() => {
24
- const fn2 = fn(this.#use);
25
- this.#element.setAttribute("view", settings.name ?? "");
26
- if (settings.styles)
27
- applyStyles(this.#shadow, settings.styles);
28
- return fn2;
29
- })();
30
- #renderNow() {
31
- if (!this.#params)
32
- return;
33
- if (!this.isConnected)
34
- return;
35
- const { context: w, props } = this.#params;
36
- this.#use[_wrap](() => {
37
- // apply html attributes
38
- applyAttrs(this.#element, w.attrs);
39
- // render the template, tracking strata items
40
- const { result, seen } = tracker.observe(() => this.#fn(...props));
41
- // inject the template
42
- render(result, this.#shadow);
43
- // reacting to changes
44
- for (const item of seen)
45
- this.#tracking.guarantee(item, () => tracker.subscribe(item, async () => this.#renderDebounced()));
46
- // inject content into light dom
47
- if (!situation.isComponent)
48
- render(w.children, this.#element);
49
- });
50
- }
51
- render(context, props) {
52
- this.#params = { context: context, props };
53
- this.#renderNow();
54
- return situation.isComponent ? null : this.#element;
55
- }
56
- disconnected() {
57
- this.#use[_disconnect]();
58
- for (const untrack of this.#tracking.values())
59
- untrack();
60
- this.#tracking.clear();
61
- }
62
- reconnected() {
63
- this.#use[_reconnect]();
64
- }
65
- };
66
- const d = directive(make({
67
- getElement: () => document.createElement(settings.tag ?? "sly-view"),
68
- isComponent: false,
69
- }));
70
- const freshViewContext = () => ({ attrs: {}, children: [] });
71
- function rendy(...props) {
72
- return d(freshViewContext(), props);
73
- }
74
- rendy.props = (...props) => {
75
- let ctx = freshViewContext();
76
- const chain = {
77
- children(...children) {
78
- ctx = { ...ctx, children: [...ctx.children, ...children] };
79
- return chain;
80
- },
81
- attrs(attrs) {
82
- ctx = { ...ctx, attrs: { ...ctx.attrs, ...attrs } };
83
- return chain;
84
- },
85
- attr(name, value) {
86
- ctx = { ...ctx, attrs: { ...ctx.attrs, [name]: value } };
87
- return chain;
88
- },
89
- render() {
90
- return d(ctx, props);
91
- },
92
- };
93
- return chain;
94
- };
95
- rendy.component = (...props) => class extends HTMLElement {
96
- #directive = directive(make({
97
- getElement: () => this,
98
- isComponent: true,
99
- }));
100
- constructor() {
101
- super();
102
- this.render(...props);
103
- }
104
- render(...props) {
105
- if (this.isConnected)
106
- render(this.#directive(freshViewContext(), props), this);
107
- }
108
- };
109
- return rendy;
110
- }
111
- view.declare = view;
112
- view.settings = (settings2) => setupView({ ...settings, ...settings2 });
113
- view.component = (fn) => view(use => () => fn(use)).component();
114
- return view;
115
- }
116
- //# sourceMappingURL=view.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"view.js","sourceRoot":"","sources":["../../s/views/view.ts"],"names":[],"mappings":"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"}
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes