@esportsplus/ui 0.28.0 → 0.29.0

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 (19) hide show
  1. package/build/components/index.d.ts +0 -1
  2. package/build/components/index.js +0 -1
  3. package/build/components/input/index.d.ts +2 -20
  4. package/build/components/input/index.js +8 -9
  5. package/build/components/range/index.d.ts +2 -20
  6. package/build/components/range/index.js +9 -10
  7. package/build/components/textarea/index.d.ts +2 -20
  8. package/build/components/textarea/index.js +10 -11
  9. package/package.json +1 -1
  10. package/src/components/index.ts +0 -1
  11. package/src/components/input/index.ts +23 -29
  12. package/src/components/range/index.ts +31 -37
  13. package/src/components/textarea/index.ts +24 -30
  14. package/build/components/row/index.d.ts +0 -1
  15. package/build/components/row/index.js +0 -1
  16. package/build/components/row/scss/index.scss +0 -2
  17. package/src/components/row/index.ts +0 -1
  18. package/src/components/row/scss/index.scss +0 -8
  19. package/src/components/row/scss/variables.scss +0 -4
package/build/components/index.d.ts CHANGED
@@ -27,7 +27,6 @@ export * from './page/index.js';
27
27
  export { default as radio } from './radio/index.js';
28
28
  export { default as range } from './range/index.js';
29
29
  export { default as root } from './root/index.js';
30
- export * as row from './row/index.js';
31
30
  export { default as select } from './select/index.js';
32
31
  export { default as switch } from './switch/index.js';
33
32
  export { default as scrollbar } from './scrollbar/index.js';
package/build/components/index.js CHANGED
@@ -27,7 +27,6 @@ export * from './page/index.js';
27
27
  export { default as radio } from './radio/index.js';
28
28
  export { default as range } from './range/index.js';
29
29
  export { default as root } from './root/index.js';
30
- export * as row from './row/index.js';
31
30
  export { default as select } from './select/index.js';
32
31
  export { default as switch } from './switch/index.js';
33
32
  export { default as scrollbar } from './scrollbar/index.js';
package/build/components/input/index.d.ts CHANGED
@@ -1,27 +1,9 @@
1
1
  import { type Attributes } from '@esportsplus/template';
2
2
  import './scss/index.scss';
3
- type A = Attributes & {
3
+ declare const _default: (attributes: Attributes & {
4
4
  state?: {
5
5
  active: boolean;
6
6
  error: string;
7
7
  };
8
- };
9
- declare const _default: {
10
- (): ReturnType<(this: {
11
- attributes?: A | undefined;
12
- content?: undefined;
13
- }, attributes: Readonly<A>, content: never) => import("@esportsplus/template").Renderable<any>>;
14
- <T extends A>(attributes: T): ReturnType<(this: {
15
- attributes?: A | undefined;
16
- content?: undefined;
17
- }, attributes: Readonly<A>, content: never) => import("@esportsplus/template").Renderable<any>>;
18
- <T extends never>(content: T): ReturnType<(this: {
19
- attributes?: A | undefined;
20
- content?: undefined;
21
- }, attributes: Readonly<A>, content: never) => import("@esportsplus/template").Renderable<any>>;
22
- (attributes: A, content: never): ReturnType<(this: {
23
- attributes?: A | undefined;
24
- content?: undefined;
25
- }, attributes: Readonly<A>, content: never) => import("@esportsplus/template").Renderable<any>>;
26
- };
8
+ }) => Node;
27
9
  export default _default;
package/build/components/input/index.js CHANGED
@@ -1,17 +1,16 @@
1
1
  import { reactive } from '@esportsplus/reactivity';
2
2
  import { html } from '@esportsplus/template';
3
3
  import form from '../../components/form/index.js';
4
- import template from '../../components/template/index.js';
5
4
  import './scss/index.scss';
6
- export default template.factory(function (attributes) {
5
+ export default (attributes) => {
7
6
  let state = attributes.state || reactive({
8
7
  active: false,
9
8
  error: ''
10
9
  });
11
10
  return html `
12
- <input
13
- class='input'
14
- ${{
11
+ <input
12
+ class='input'
13
+ ${{
15
14
  class: () => state.active && '--active',
16
15
  onfocusin: () => {
17
16
  state.active = true;
@@ -22,7 +21,7 @@ export default template.factory(function (attributes) {
22
21
  onrender: form.input.onrender(state),
23
22
  type: (attributes.type || 'text')
24
23
  }}
25
- ${attributes}
26
- />
27
- `;
28
- });
24
+ ${attributes}
25
+ />
26
+ `;
27
+ };
package/build/components/range/index.d.ts CHANGED
@@ -1,28 +1,10 @@
1
1
  import { type Attributes } from '@esportsplus/template';
2
2
  import './scss/index.scss';
3
- type A = Attributes & {
3
+ declare const _default: (attributes: Attributes & {
4
4
  state?: {
5
5
  active: boolean;
6
6
  error: string;
7
7
  value: number;
8
8
  };
9
- };
10
- declare const _default: {
11
- (): ReturnType<(this: {
12
- attributes?: A | undefined;
13
- content?: undefined;
14
- }, attributes: Readonly<A>, content: never) => import("@esportsplus/template").Renderable<any>>;
15
- <T extends A>(attributes: T): ReturnType<(this: {
16
- attributes?: A | undefined;
17
- content?: undefined;
18
- }, attributes: Readonly<A>, content: never) => import("@esportsplus/template").Renderable<any>>;
19
- <T extends never>(content: T): ReturnType<(this: {
20
- attributes?: A | undefined;
21
- content?: undefined;
22
- }, attributes: Readonly<A>, content: never) => import("@esportsplus/template").Renderable<any>>;
23
- (attributes: A, content: never): ReturnType<(this: {
24
- attributes?: A | undefined;
25
- content?: undefined;
26
- }, attributes: Readonly<A>, content: never) => import("@esportsplus/template").Renderable<any>>;
27
- };
9
+ }) => Node;
28
10
  export default _default;
package/build/components/range/index.js CHANGED
@@ -1,9 +1,8 @@
1
1
  import { reactive, root } from '@esportsplus/reactivity';
2
2
  import { html } from '@esportsplus/template';
3
3
  import form from '../../components/form/index.js';
4
- import template from '../../components/template/index.js';
5
4
  import './scss/index.scss';
6
- export default template.factory(function (attributes) {
5
+ export default (attributes) => {
7
6
  let state = attributes.state || reactive({
8
7
  active: false,
9
8
  error: '',
@@ -13,10 +12,10 @@ export default template.factory(function (attributes) {
13
12
  state.value = Number(attributes.value);
14
13
  }
15
14
  return html `
16
- <input
17
- class='range --border-state --border-black'
18
- type='range'
19
- ${{
15
+ <input
16
+ class='range --border-state --border-black'
17
+ type='range'
18
+ ${{
20
19
  class: () => state.active && '--active',
21
20
  onfocusin: () => {
22
21
  state.active = true;
@@ -30,7 +29,7 @@ export default template.factory(function (attributes) {
30
29
  onrender: form.input.onrender(state),
31
30
  value: root(() => attributes?.value || state.value || 0)
32
31
  }}
33
- ${attributes}
34
- />
35
- `;
36
- });
32
+ ${attributes}
33
+ />
34
+ `;
35
+ };
package/build/components/textarea/index.d.ts CHANGED
@@ -1,27 +1,9 @@
1
1
  import { type Attributes } from '@esportsplus/template';
2
2
  import './scss/index.scss';
3
- type A = Attributes & {
3
+ declare const _default: (attributes: Attributes & {
4
4
  state?: {
5
5
  active: boolean;
6
6
  error: string;
7
7
  };
8
- };
9
- declare const _default: {
10
- (): ReturnType<(this: {
11
- attributes?: A | undefined;
12
- content?: undefined;
13
- }, attributes: Readonly<A>, content: never) => import("@esportsplus/template").Renderable<any>>;
14
- <T extends A>(attributes: T): ReturnType<(this: {
15
- attributes?: A | undefined;
16
- content?: undefined;
17
- }, attributes: Readonly<A>, content: never) => import("@esportsplus/template").Renderable<any>>;
18
- <T extends never>(content: T): ReturnType<(this: {
19
- attributes?: A | undefined;
20
- content?: undefined;
21
- }, attributes: Readonly<A>, content: never) => import("@esportsplus/template").Renderable<any>>;
22
- (attributes: A, content: never): ReturnType<(this: {
23
- attributes?: A | undefined;
24
- content?: undefined;
25
- }, attributes: Readonly<A>, content: never) => import("@esportsplus/template").Renderable<any>>;
26
- };
8
+ }) => Node;
27
9
  export default _default;
package/build/components/textarea/index.js CHANGED
@@ -2,18 +2,17 @@ import { reactive } from '@esportsplus/reactivity';
2
2
  import { html } from '@esportsplus/template';
3
3
  import { omit } from '@esportsplus/utilities';
4
4
  import form from '../../components/form/index.js';
5
- import template from '../../components/template/index.js';
6
5
  import './scss/index.scss';
7
6
  const OMIT = ['state'];
8
- export default template.factory(function (attributes) {
7
+ export default (attributes) => {
9
8
  let state = attributes.state || reactive({
10
9
  active: false,
11
10
  error: ''
12
11
  });
13
12
  return html `
14
- <textarea
15
- class='textarea'
16
- ${{
13
+ <textarea
14
+ class='textarea'
15
+ ${{
17
16
  class: () => state.active && '--active',
18
17
  onfocusin: () => {
19
18
  state.active = true;
@@ -23,9 +22,9 @@ export default template.factory(function (attributes) {
23
22
  },
24
23
  onrender: form.input.onrender(state)
25
24
  }}
26
- ${omit(attributes, OMIT)}
27
- >
28
- ${attributes?.value}
29
- </textarea>
30
- `;
31
- });
25
+ ${omit(attributes, OMIT)}
26
+ >
27
+ ${attributes?.value}
28
+ </textarea>
29
+ `;
30
+ };
package/package.json CHANGED
@@ -48,7 +48,7 @@
48
48
  "private": false,
49
49
  "sideEffects": false,
50
50
  "type": "module",
51
- "version": "0.28.0",
51
+ "version": "0.29.0",
52
52
  "scripts": {
53
53
  "build": "run-s build:vite build:ts",
54
54
  "build:ts": "tsc && tsc-alias",
package/src/components/index.ts CHANGED
@@ -27,7 +27,6 @@ export * from './page';
27
27
  export { default as radio } from './radio';
28
28
  export { default as range } from './range';
29
29
  export { default as root } from './root';
30
- export * as row from './row';
31
30
  export { default as select } from './select';
32
31
  export { default as switch } from './switch';
33
32
  export { default as scrollbar } from './scrollbar';
package/src/components/input/index.ts CHANGED
@@ -1,36 +1,30 @@
1
1
  import { reactive } from '@esportsplus/reactivity';
2
2
  import { html, type Attributes } from '@esportsplus/template';
3
3
  import form from '~/components/form';
4
- import template from '~/components/template';
5
4
  import './scss/index.scss';
6
5
 
7
6
 
8
- type A = Attributes & { state?: { active: boolean, error: string } };
7
+ export default (attributes: Attributes & { state?: { active: boolean, error: string } }) => {
8
+ let state = attributes.state || reactive({
9
+ active: false,
10
+ error: ''
11
+ });
9
12
 
10
-
11
- export default template.factory<A, never>(
12
- function(attributes) {
13
- let state = attributes.state || reactive({
14
- active: false,
15
- error: ''
16
- });
17
-
18
- return html`
19
- <input
20
- class='input'
21
- ${{
22
- class: () => state.active && '--active',
23
- onfocusin: () => {
24
- state.active = true;
25
- },
26
- onfocusout: () => {
27
- state.active = false;
28
- },
29
- onrender: form.input.onrender(state),
30
- type: (attributes.type || 'text') as string
31
- }}
32
- ${attributes}
33
- />
34
- `;
35
- }
36
- );
13
+ return html`
14
+ <input
15
+ class='input'
16
+ ${{
17
+ class: () => state.active && '--active',
18
+ onfocusin: () => {
19
+ state.active = true;
20
+ },
21
+ onfocusout: () => {
22
+ state.active = false;
23
+ },
24
+ onrender: form.input.onrender(state),
25
+ type: (attributes.type || 'text') as string
26
+ }}
27
+ ${attributes}
28
+ />
29
+ `;
30
+ };
package/src/components/range/index.ts CHANGED
@@ -1,45 +1,39 @@
1
1
  import { reactive, root } from '@esportsplus/reactivity';
2
2
  import { html, type Attributes } from '@esportsplus/template';
3
3
  import form from '~/components/form';
4
- import template from '~/components/template';
5
4
  import './scss/index.scss';
6
5
 
7
6
 
8
- type A = Attributes & { state?: { active: boolean, error: string, value: number } };
7
+ export default (attributes: Attributes & { state?: { active: boolean, error: string, value: number } }) => {
8
+ let state = attributes.state || reactive({
9
+ active: false,
10
+ error: '',
11
+ value: 0
12
+ });
9
13
 
10
-
11
- export default template.factory<A, never>(
12
- function(attributes) {
13
- let state = attributes.state || reactive({
14
- active: false,
15
- error: '',
16
- value: 0
17
- });
18
-
19
- if (attributes?.value) {
20
- state.value = Number( attributes.value );
21
- }
22
-
23
- return html`
24
- <input
25
- class='range --border-state --border-black'
26
- type='range'
27
- ${{
28
- class: () => state.active && '--active',
29
- onfocusin: () => {
30
- state.active = true;
31
- },
32
- onfocusout: () => {
33
- state.active = false;
34
- },
35
- oninput: (e) => {
36
- state.value = Number((e.target as HTMLInputElement).value);
37
- },
38
- onrender: form.input.onrender(state),
39
- value: root(() => (attributes?.value as number) || state.value || 0)
40
- }}
41
- ${attributes}
42
- />
43
- `;
14
+ if (attributes?.value) {
15
+ state.value = Number( attributes.value );
44
16
  }
45
- );
17
+
18
+ return html`
19
+ <input
20
+ class='range --border-state --border-black'
21
+ type='range'
22
+ ${{
23
+ class: () => state.active && '--active',
24
+ onfocusin: () => {
25
+ state.active = true;
26
+ },
27
+ onfocusout: () => {
28
+ state.active = false;
29
+ },
30
+ oninput: (e) => {
31
+ state.value = Number((e.target as HTMLInputElement).value);
32
+ },
33
+ onrender: form.input.onrender(state),
34
+ value: root(() => (attributes?.value as number) || state.value || 0)
35
+ }}
36
+ ${attributes}
37
+ />
38
+ `;
39
+ };
package/src/components/textarea/index.ts CHANGED
@@ -2,40 +2,34 @@ import { reactive } from '@esportsplus/reactivity';
2
2
  import { html, type Attributes } from '@esportsplus/template';
3
3
  import { omit } from '@esportsplus/utilities';
4
4
  import form from '~/components/form';
5
- import template from '~/components/template';
6
5
  import './scss/index.scss';
7
6
 
8
7
 
9
- type A = Attributes & { state?: { active: boolean, error: string } };
10
-
11
-
12
8
  const OMIT = ['state'];
13
9
 
14
10
 
15
- export default template.factory<A, never>(
16
- function(attributes) {
17
- let state = attributes.state || reactive({
18
- active: false,
19
- error: ''
20
- });
11
+ export default (attributes: Attributes & { state?: { active: boolean, error: string } }) => {
12
+ let state = attributes.state || reactive({
13
+ active: false,
14
+ error: ''
15
+ });
21
16
 
22
- return html`
23
- <textarea
24
- class='textarea'
25
- ${{
26
- class: () => state.active && '--active',
27
- onfocusin: () => {
28
- state.active = true;
29
- },
30
- onfocusout: () => {
31
- state.active = false;
32
- },
33
- onrender: form.input.onrender(state)
34
- }}
35
- ${omit(attributes, OMIT)}
36
- >
37
- ${attributes?.value as string}
38
- </textarea>
39
- `;
40
- }
41
- );
17
+ return html`
18
+ <textarea
19
+ class='textarea'
20
+ ${{
21
+ class: () => state.active && '--active',
22
+ onfocusin: () => {
23
+ state.active = true;
24
+ },
25
+ onfocusout: () => {
26
+ state.active = false;
27
+ },
28
+ onrender: form.input.onrender(state)
29
+ }}
30
+ ${omit(attributes, OMIT)}
31
+ >
32
+ ${attributes?.value as string}
33
+ </textarea>
34
+ `;
35
+ };
package/build/components/row/index.d.ts DELETED
@@ -1 +0,0 @@
1
- import './scss/index.scss';
package/build/components/row/index.js DELETED
@@ -1 +0,0 @@
1
- import './scss/index.scss';
package/build/components/row/scss/index.scss DELETED
@@ -1,2 +0,0 @@
1
- @layer components {.row{gap:var(--gap-vertical)var(--gap-horizontal);flex-wrap:wrap;justify-content:flex-start;width:100%;display:flex;position:relative}}
2
- /*$vite$:1*/
package/src/components/row/index.ts DELETED
@@ -1 +0,0 @@
1
- import './scss/index.scss';
package/src/components/row/scss/index.scss DELETED
@@ -1,8 +0,0 @@
1
- .row {
2
- display: flex;
3
- flex-wrap: wrap;
4
- gap: var(--gap-vertical) var(--gap-horizontal);
5
- justify-content: flex-start;
6
- position: relative;
7
- width: 100%;
8
- }
package/src/components/row/scss/variables.scss DELETED
@@ -1,4 +0,0 @@
1
- .row {
2
- --gap-horizontal: 0px;
3
- --gap-vertical: 0px;
4
- }