@arcmantle/lit-jsx 1.0.13 → 1.0.14

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/README.md CHANGED
@@ -70,7 +70,11 @@ import { litJsx } from '@arcmantle/lit-jsx/vite-jsx-preserve';
70
70
  import { defineConfig } from 'vite';
71
71
 
72
72
  export default defineConfig({
73
- plugins: [litJsx()],
73
+ plugins: [
74
+ litJsx({
75
+ legacyDecorators: true
76
+ })
77
+ ],
74
78
  });
75
79
  ```
76
80
 
@@ -661,14 +665,7 @@ import { litJsx } from '@arcmantle/lit-jsx/vite-jsx-preserve';
661
665
  export default defineConfig({
662
666
  plugins: [
663
667
  litJsx({
664
- babel: {
665
- // Babel transform options
666
- plugins: ['@babel/plugin-proposal-decorators'],
667
- },
668
- // Or use a function for dynamic configuration
669
- babel: (code, id) => ({
670
- plugins: id.includes('legacy') ? [] : ['modern-plugin'],
671
- }),
668
+ legacyDecorators: true,
672
669
  }),
673
670
  ],
674
671
  });
@@ -704,7 +701,7 @@ lit-jsx automatically detects and uses the appropriate template type:
704
701
  - Complex object values
705
702
 
706
703
  ```tsx
707
- <input value={as.prop(formData.email)} checked={as.prop(isSelected)} />
704
+ <input value={as.prop(formData.email)} checked={prop => isSelected} />
708
705
  ```
709
706
 
710
707
  #### **Boolean Attribute Binding (`as.bool()` or `bool =>`)**
@@ -714,7 +711,7 @@ lit-jsx automatically detects and uses the appropriate template type:
714
711
  - Presence/absence semantics
715
712
 
716
713
  ```tsx
717
- <button disabled={as.bool(isLoading)} hidden={as.bool(!isVisible)} />
714
+ <button disabled={as.bool(isLoading)} hidden={bool => !isVisible} />
718
715
  ```
719
716
 
720
717
  ### Function Component Guidelines
@@ -726,7 +723,7 @@ lit-jsx automatically detects and uses the appropriate template type:
726
723
 
727
724
  ### Dynamic Tag Best Practices
728
725
 
729
- - Always use `toTag()` with the `.tag` property pattern
726
+ - Always use `toTag()` to define your dynamic tags.
730
727
  - Use descriptive variable names for clarity
731
728
  - Consider TypeScript for better type safety with HTML elements
732
729
  - Document complex dynamic tag logic
@@ -767,7 +764,7 @@ html`<div class=${classMap(classes)}>${content}</div>`
767
764
 
768
765
  ## 🤝 Contributing
769
766
 
770
- lit-jsx is part of the larger Weave project. Contributions are welcome!
767
+ Contributions, issues or requests are welcome!
771
768
 
772
769
  ## 📄 License
773
770
 
@@ -1,8 +1,3 @@
1
- type Falsy = null | undefined | false | 0 | -0 | 0n | '';
2
- export declare const when: <C, T, F>(condition: C, trueCase: (c: NoInfer<Exclude<C, Falsy>>) => T, falseCase?: (c: NoInfer<Exclude<C, Falsy>>) => F) => C extends Falsy ? F : T;
3
- type ShowTrueCase<C, T> = (value: NoInfer<Exclude<C, Falsy>>) => T;
4
- type ShowFalseCase<C, F> = (value: NoInfer<Exclude<C, Falsy>>) => F;
5
- type ShowChildren<C, T, F> = ShowTrueCase<C, T> | [true: ShowTrueCase<C, T>, false: ShowFalseCase<C, F>];
6
1
  /**
7
2
  * Conditionally renders content based on a truthy value.
8
3
  *
@@ -25,9 +20,11 @@ type ShowChildren<C, T, F> = ShowTrueCase<C, T> | [true: ShowTrueCase<C, T>, fal
25
20
  * </Show>
26
21
  * ```
27
22
  */
28
- export declare function Show<C, T, F>(props: {
23
+ export declare function Show<C>(props: {
29
24
  when: C;
30
- children: ShowChildren<C, T, F>;
31
- }): C extends Falsy ? F : T;
32
- export {};
25
+ children: ((value: NoInfer<C>) => JSX.JSXElement) | [
26
+ true: ((value: NoInfer<C>) => JSX.JSXElement),
27
+ false: ((value: NoInfer<C>) => JSX.JSXElement)
28
+ ];
29
+ }): JSX.JSXElement;
33
30
  //# sourceMappingURL=show-component.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"show-component.d.ts","sourceRoot":"","sources":["../../src/runtime/show-component.ts"],"names":[],"mappings":"AAGA,KAAK,KAAK,GAAG,IAAI,GAAG,SAAS,GAAG,KAAK,GAAG,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC;AACzD,eAAO,MAAM,IAAI,EAAc,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EACtC,SAAS,EAAE,CAAC,EACZ,QAAQ,EAAE,CAAC,CAAC,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,KAAK,CAAC,EAC9C,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,KAAK,CAAC,KAC5C,CAAC,SAAS,KAAK,GAAG,CAAC,GAAG,CAAC,CAAC;AAE7B,KAAK,YAAY,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC;AACnE,KAAK,aAAa,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC;AACpE,KAAK,YAAY,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,IACtB,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC,GAClB,CAAE,IAAI,EAAE,YAAY,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,aAAa,CAAC,CAAC,EAAE,CAAC,CAAC,CAAE,CAAC;AAG5D;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE;IACpC,IAAI,EAAM,CAAC,CAAC;IACZ,QAAQ,EAAE,YAAY,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;CAChC,GAAG,CAAC,SAAS,KAAK,GAAG,CAAC,GAAG,CAAC,CAK1B"}
1
+ {"version":3,"file":"show-component.d.ts","sourceRoot":"","sources":["../../src/runtime/show-component.ts"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,IAAI,CAAC,CAAC,EAAE,KAAK,EAAE;IAC9B,IAAI,EAAM,CAAC,CAAC;IACZ,QAAQ,EACL,CAAC,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,UAAU,CAAC,GACvC;QACD,IAAI,EAAE,CAAC,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,UAAU,CAAC;QAC7C,KAAK,EAAE,CAAC,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,UAAU,CAAC;KAC9C,CAAC;CACH,GAAG,GAAG,CAAC,UAAU,CAKjB"}
@@ -1,5 +1,4 @@
1
- import { when as litWhen } from 'lit-html/directives/when.js';
2
- export const when = litWhen;
1
+ import { when } from 'lit-html/directives/when.js';
3
2
  /**
4
3
  * Conditionally renders content based on a truthy value.
5
4
  *
@@ -1 +1 @@
1
- {"version":3,"file":"show-component.js","sourceRoot":"","sources":["../../src/runtime/show-component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,IAAI,OAAO,EAAE,MAAM,6BAA6B,CAAC;AAI9D,MAAM,CAAC,MAAM,IAAI,GAAG,OAIQ,CAAC;AAS7B;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,UAAU,IAAI,CAAU,KAG7B;IACA,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC;QAChC,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;IAE/D,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;AACzC,CAAC"}
1
+ {"version":3,"file":"show-component.js","sourceRoot":"","sources":["../../src/runtime/show-component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,6BAA6B,CAAC;AAGnD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,UAAU,IAAI,CAAI,KAQvB;IACA,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC;QAChC,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;IAE/D,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;AACzC,CAAC"}
package/package.json CHANGED
@@ -9,7 +9,7 @@
9
9
  "type": "git",
10
10
  "url": "git+https://github.com/arcmantle/lit-jsx.git"
11
11
  },
12
- "version": "1.0.13",
12
+ "version": "1.0.14",
13
13
  "files": [
14
14
  "dist",
15
15
  "src"
@@ -1,18 +1,4 @@
1
- import { when as litWhen } from 'lit-html/directives/when.js';
2
-
3
-
4
- type Falsy = null | undefined | false | 0 | -0 | 0n | '';
5
- export const when = litWhen as <C, T, F>(
6
- condition: C,
7
- trueCase: (c: NoInfer<Exclude<C, Falsy>>) => T,
8
- falseCase?: (c: NoInfer<Exclude<C, Falsy>>) => F,
9
- ) => C extends Falsy ? F : T;
10
-
11
- type ShowTrueCase<C, T> = (value: NoInfer<Exclude<C, Falsy>>) => T;
12
- type ShowFalseCase<C, F> = (value: NoInfer<Exclude<C, Falsy>>) => F;
13
- type ShowChildren<C, T, F> =
14
- | ShowTrueCase<C, T>
15
- | [ true: ShowTrueCase<C, T>, false: ShowFalseCase<C, F> ];
1
+ import { when } from 'lit-html/directives/when.js';
16
2
 
17
3
 
18
4
  /**
@@ -37,10 +23,15 @@ type ShowChildren<C, T, F> =
37
23
  * </Show>
38
24
  * ```
39
25
  */
40
- export function Show<C, T, F>(props: {
26
+ export function Show<C>(props: {
41
27
  when: C;
42
- children: ShowChildren<C, T, F>;
43
- }): C extends Falsy ? F : T {
28
+ children:
29
+ | ((value: NoInfer<C>) => JSX.JSXElement)
30
+ | [
31
+ true: ((value: NoInfer<C>) => JSX.JSXElement),
32
+ false: ((value: NoInfer<C>) => JSX.JSXElement),
33
+ ];
34
+ }): JSX.JSXElement {
44
35
  if (Array.isArray(props.children))
45
36
  return when(props.when, props.children[0], props.children[1]);
46
37