fuma 0.1.26 → 0.1.28

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.
@@ -1,7 +1,7 @@
1
1
  export * from './card/index.js';
2
2
  export * from './drawer/index.js';
3
- export * from './form/index.js';
4
3
  export * from './input/index.js';
4
+ export * from './form/index.js';
5
5
  export * from './menu/index.js';
6
6
  export * from './period/index.js';
7
7
  export * from './table/index.js';
package/dist/ui/index.js CHANGED
@@ -1,7 +1,7 @@
1
1
  export * from './card/index.js';
2
2
  export * from './drawer/index.js';
3
- export * from './form/index.js';
4
3
  export * from './input/index.js';
4
+ export * from './form/index.js';
5
5
  export * from './menu/index.js';
6
6
  export * from './period/index.js';
7
7
  export * from './table/index.js';
@@ -1,6 +1,7 @@
1
1
  <script>import { slide } from "svelte/transition";
2
2
  import { onMount } from "svelte";
3
3
  import { formContext } from "../../validation/form.js";
4
+ import { Slot } from "../index.js";
4
5
  let klass = "";
5
6
  export { klass as class };
6
7
  export let classLabel = "";
@@ -11,6 +12,7 @@ export let hint = "";
11
12
  export let prefix = "";
12
13
  export let prefixFor = "";
13
14
  export let enhanceDisabled = false;
15
+ export let labelPosition = "top";
14
16
  $:
15
17
  _key = prefix && key ? `${prefix}_${key}` : key || "";
16
18
  if (!enhanceDisabled) {
@@ -31,15 +33,28 @@ onMount(() => {
31
33
  </script>
32
34
 
33
35
  <div class="form-control {klass}" bind:this={formControl}>
34
- {#if label || $$slots.label}
35
- <label for="{prefixFor}{_key}" class="label cursor-pointer {classLabel}">
36
- <span class="label-text">{label}</span>
37
- <slot name="label" />
38
- <slot name="label_append" />
39
- </label>
40
- {/if}
36
+ <div
37
+ class:contents={labelPosition === 'top'}
38
+ class:flex={labelPosition !== 'top'}
39
+ class:items-center={labelPosition !== 'top'}
40
+ class:gap-2={labelPosition !== 'top'}
41
+ class:flex-row-reverse={labelPosition === 'right'}
42
+ class:justify-end={labelPosition === 'right'}
43
+ >
44
+ {#if label || $$slots.label}
45
+ <label for="{prefixFor}{_key}" class="label cursor-pointer {classLabel}">
46
+ <span class="label-text">
47
+ <slot name="label">
48
+ <Slot slot={label} />
49
+ </slot>
50
+ </span>
51
+ <slot name="label" />
52
+ <slot name="label_append" />
53
+ </label>
54
+ {/if}
41
55
 
42
- <slot key={_key} />
56
+ <slot key={_key} />
57
+ </div>
43
58
 
44
59
  {#if error}
45
60
  <label for="{prefixFor}{_key}" class="label" transition:slide>
@@ -1,15 +1,17 @@
1
1
  import { SvelteComponent } from "svelte";
2
+ import type { ComponentAndProps } from '../../utils/index.js';
2
3
  declare const __propDef: {
3
4
  props: {
4
5
  class?: string | undefined;
5
6
  classLabel?: string | undefined;
6
7
  key?: string | undefined;
7
- label?: string | undefined;
8
+ label?: string | ComponentAndProps | undefined;
8
9
  error?: string | undefined;
9
10
  hint?: string | undefined;
10
11
  prefix?: string | number | undefined;
11
12
  prefixFor?: string | number | undefined;
12
13
  enhanceDisabled?: boolean | undefined;
14
+ labelPosition?: ("top" | "left" | "right") | undefined;
13
15
  };
14
16
  events: {
15
17
  [evt: string]: CustomEvent<any>;
@@ -1,19 +1,19 @@
1
1
  <script>import { createEventDispatcher } from "svelte";
2
2
  import { FormControl, bindCheckedWithParams } from "./index.js";
3
- $:
4
- ({ input, value: _value, bindWithParams, label, ...props } = $$restProps);
5
- export let value = _value;
3
+ export let value = false;
4
+ export let input = {};
5
+ export let inputElement = void 0;
6
+ export let bindWithParams = false;
6
7
  const dispatch = createEventDispatcher();
7
8
  </script>
8
9
 
9
- <FormControl {...props} let:key>
10
- <label for={key} class="label cursor-pointer">
11
- <span class="label-text">
12
- <slot>{label}</slot>
13
- </span>
14
- </label>
10
+ <FormControl {...$$restProps} let:key class="">
11
+ <svelte:fragment slot="label">
12
+ <slot name="label" />
13
+ </svelte:fragment>
15
14
 
16
15
  <input
16
+ bind:this={inputElement}
17
17
  bind:checked={value}
18
18
  use:bindCheckedWithParams={{ bindEnable: bindWithParams }}
19
19
  on:input={({ currentTarget: { checked } }) => dispatch('change', checked)}
@@ -1,7 +1,26 @@
1
1
  import { SvelteComponent } from "svelte";
2
- import { type InputProps } from './index.js';
2
+ import type { HTMLInputAttributes } from 'svelte/elements';
3
3
  declare const __propDef: {
4
- props: InputProps<boolean>;
4
+ props: {
5
+ class?: string | undefined;
6
+ classLabel?: string | undefined;
7
+ key?: string | undefined;
8
+ label?: string | import("../../index.js").ComponentAndProps | undefined;
9
+ error?: string | undefined;
10
+ hint?: string | undefined;
11
+ prefix?: string | number | undefined;
12
+ prefixFor?: string | number | undefined;
13
+ enhanceDisabled?: boolean | undefined;
14
+ labelPosition?: ("top" | "left" | "right") | undefined;
15
+ } & {
16
+ input?: HTMLInputAttributes | undefined;
17
+ inputElement?: HTMLInputElement | undefined;
18
+ wrapperClass?: string | undefined;
19
+ value?: boolean | undefined;
20
+ bindWithParams?: boolean | undefined;
21
+ } & {
22
+ isRow?: boolean | undefined;
23
+ };
5
24
  events: {
6
25
  focus: FocusEvent;
7
26
  blur: FocusEvent;
@@ -10,7 +29,7 @@ declare const __propDef: {
10
29
  [evt: string]: CustomEvent<any>;
11
30
  };
12
31
  slots: {
13
- default: {};
32
+ label: {};
14
33
  };
15
34
  };
16
35
  export type InputBooleanProps = typeof __propDef.props;
@@ -5,12 +5,13 @@ declare const __propDef: {
5
5
  class?: string | undefined;
6
6
  classLabel?: string | undefined;
7
7
  key?: string | undefined;
8
- label?: string | undefined;
8
+ label?: string | import("../../index.js").ComponentAndProps | undefined;
9
9
  error?: string | undefined;
10
10
  hint?: string | undefined;
11
11
  prefix?: string | number | undefined;
12
12
  prefixFor?: string | number | undefined;
13
13
  enhanceDisabled?: boolean | undefined;
14
+ labelPosition?: ("top" | "left" | "right") | undefined;
14
15
  } & {
15
16
  input?: import("svelte/elements.js").HTMLInputAttributes | undefined;
16
17
  inputElement?: HTMLInputElement | undefined;
@@ -5,12 +5,13 @@ declare const __propDef: {
5
5
  class?: string | undefined;
6
6
  classLabel?: string | undefined;
7
7
  key?: string | undefined;
8
- label?: string | undefined;
8
+ label?: string | import("../../utils/index.js").ComponentAndProps | undefined;
9
9
  error?: string | undefined;
10
10
  hint?: string | undefined;
11
11
  prefix?: string | number | undefined;
12
12
  prefixFor?: string | number | undefined;
13
13
  enhanceDisabled?: boolean | undefined;
14
+ labelPosition?: ("top" | "left" | "right") | undefined;
14
15
  } & {
15
16
  input?: import("svelte/elements.js").HTMLInputAttributes | undefined;
16
17
  inputElement?: HTMLInputElement | undefined;
@@ -8,12 +8,13 @@ declare const __propDef: {
8
8
  class?: string | undefined;
9
9
  classLabel?: string | undefined;
10
10
  key?: string | undefined;
11
- label?: string | undefined;
11
+ label?: string | import("../../index.js").ComponentAndProps | undefined;
12
12
  error?: string | undefined;
13
13
  hint?: string | undefined;
14
14
  prefix?: string | number | undefined;
15
15
  prefixFor?: string | number | undefined;
16
16
  enhanceDisabled?: boolean | undefined;
17
+ labelPosition?: ("top" | "left" | "right") | undefined;
17
18
  } & {
18
19
  input?: import("svelte/elements").HTMLInputAttributes | undefined;
19
20
  inputElement?: HTMLInputElement | undefined;
@@ -4,12 +4,13 @@ declare const __propDef: {
4
4
  class?: string | undefined;
5
5
  classLabel?: string | undefined;
6
6
  key?: string | undefined;
7
- label?: string | undefined;
7
+ label?: string | import("../../index.js").ComponentAndProps | undefined;
8
8
  error?: string | undefined;
9
9
  hint?: string | undefined;
10
10
  prefix?: string | number | undefined;
11
11
  prefixFor?: string | number | undefined;
12
12
  enhanceDisabled?: boolean | undefined;
13
+ labelPosition?: ("top" | "left" | "right") | undefined;
13
14
  } & {
14
15
  input?: import("svelte/elements.js").HTMLInputAttributes | undefined;
15
16
  inputElement?: HTMLInputElement | undefined;
@@ -5,12 +5,13 @@ declare const __propDef: {
5
5
  class?: string | undefined;
6
6
  classLabel?: string | undefined;
7
7
  key?: string | undefined;
8
- label?: string | undefined;
8
+ label?: string | import("../../index.js").ComponentAndProps | undefined;
9
9
  error?: string | undefined;
10
10
  hint?: string | undefined;
11
11
  prefix?: string | number | undefined;
12
12
  prefixFor?: string | number | undefined;
13
13
  enhanceDisabled?: boolean | undefined;
14
+ labelPosition?: ("top" | "left" | "right") | undefined;
14
15
  } & {
15
16
  input?: import("svelte/elements.js").HTMLInputAttributes | undefined;
16
17
  inputElement?: HTMLInputElement | undefined;
@@ -4,12 +4,13 @@ declare const __propDef: {
4
4
  class?: string | undefined;
5
5
  classLabel?: string | undefined;
6
6
  key?: string | undefined;
7
- label?: string | undefined;
7
+ label?: string | import("../../..").ComponentAndProps | undefined;
8
8
  error?: string | undefined;
9
9
  hint?: string | undefined;
10
10
  prefix?: string | number | undefined;
11
11
  prefixFor?: string | number | undefined;
12
12
  enhanceDisabled?: boolean | undefined;
13
+ labelPosition?: ("top" | "left" | "right") | undefined;
13
14
  } & {
14
15
  value?: string | undefined;
15
16
  classToolbar?: string | undefined;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "fuma",
3
- "version": "0.1.26",
3
+ "version": "0.1.28",
4
4
  "description": "My fullstack material build with sveltekit, daisyui, zod and more",
5
5
  "author": {
6
6
  "name": "Jonas Voisard",