do-ui-design-system 1.0.16 → 1.0.18

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 (7) hide show
  1. package/dist/atoms/Button/Button.svelte +1 -1
  2. package/dist/molecules/IconButton/IconButton.svelte +51 -19
  3. package/dist/molecules/IconButton/IconButton.svelte.d.ts +28 -38
  4. package/dist/molecules/IconButton/IconButton.svelte.d.ts.map +1 -1
  5. package/dist/molecules/IconButton/iProps.d.ts +6 -0
  6. package/dist/molecules/IconButton/iProps.d.ts.map +1 -1
  7. package/package.json +1 -1
package/dist/atoms/Button/Button.svelte CHANGED
@@ -3,7 +3,7 @@
3
3
  import type { iProps } from './iProps.ts';
4
4
 
5
5
  let {
6
- label = 'Label',
6
+ label,
7
7
  type = 'button',
8
8
  ariaLabel,
9
9
  onClick,
package/dist/molecules/IconButton/IconButton.svelte CHANGED
@@ -2,27 +2,54 @@
2
2
  import { Button, Icon } from '../../atoms/index.js';
3
3
  import type { iProps } from './iProps.ts';
4
4
 
5
- export let variant: iProps['variant'] = 'do-btn-primary';
6
- export let size: iProps['size'] = 'do-btn-md';
7
- export let label: iProps['label'] = '';
8
- export let disabled: iProps['disabled'] = false;
9
- export let loading: iProps['loading'] = false;
10
- export let iconName: iProps['iconName'] = 'icon-arrow';
11
- export let iconSize: iProps['iconSize'] = 'inherit';
12
- export let iconColor: iProps['iconColor'] = 'inherit';
13
- export let iconPosition: iProps['iconPosition'] = 'end';
14
- export let rounded: iProps['rounded'] = false;
15
- export let circle: iProps['circle'] = false;
16
- export let square: iProps['square'] = false;
17
- export let btnCustomClass: iProps['btnCustomClass'] = '';
18
- export let iCustomClass: iProps['iCustomClass'] = '';
19
- export let btnCustomStyles: iProps['btnCustomStyles'] = '';
20
- export let iCustomStyles: iProps['iCustomStyles'] = '';
5
+ let {
6
+ variant = 'do-btn-primary',
7
+ size = 'do-btn-md',
8
+ label,
9
+ disabled,
10
+ loading,
11
+ onClick,
12
+ ariaLabel,
13
+ ariaDisabled,
14
+ iconName = 'icon-arrow',
15
+ iconSize,
16
+ iconColor,
17
+ iconPosition,
18
+ rounded,
19
+ circle,
20
+ square,
21
+ btnCustomClass,
22
+ iCustomClass,
23
+ btnCustomStyles,
24
+ iCustomStyles,
25
+ data
26
+ }: {
27
+ variant?: iProps['variant'];
28
+ size?: iProps['size'];
29
+ label?: iProps['label'];
30
+ disabled?: iProps['disabled'];
31
+ loading?: iProps['loading'];
32
+ onClick: iProps['onClick'];
33
+ ariaLabel: iProps['ariaLabel'];
34
+ ariaDisabled?: iProps['ariaDisabled'];
35
+ iconName: iProps['iconName'];
36
+ iconSize?: iProps['iconSize'];
37
+ iconColor?: iProps['iconColor'];
38
+ iconPosition?: iProps['iconPosition'];
39
+ rounded?: iProps['rounded'];
40
+ circle?: iProps['circle'];
41
+ square?: iProps['square'];
42
+ btnCustomClass?: iProps['btnCustomClass'];
43
+ iCustomClass?: iProps['iCustomClass'];
44
+ btnCustomStyles?: iProps['btnCustomStyles'];
45
+ iCustomStyles?: iProps['iCustomStyles'];
46
+ data?: iProps['data'];
47
+ } = $props();
21
48
  </script>
22
49
 
23
50
  <!-- @component
24
51
  ```Svelte
25
- <IconButton label?={'text'} variant?={'variant'} size?={'size'} on:click={()=>{}} disabled?={disabled} loading?={loading} iconName?={'iconName'} iconSize?={'iconSize'} />
52
+ <IconButton label?={'text'} variant?={'variant'} size?={'size'} onClick={()=>{}} disabled?={disabled} loading?={loading} iconName?={'iconName'} iconSize?={'iconSize'} ariaLabel={ariaLabel} ariaDisabled={ariaDisabled}/>
26
53
  ```
27
54
  - `variant?`: 'do-btn-primary' | 'do-btn-secondary' | 'do-btn-tertiary' | 'do-btn-accent' | 'do-btn-neutral'
28
55
  - `size?`: rem units
@@ -30,6 +57,9 @@
30
57
  - `disabled?`: boolean
31
58
  - `rounded?`: boolean
32
59
  - `loading?`: boolean
60
+ - `onClick`: () => void
61
+ - `ariaLabel`: string
62
+ - `ariaDisabled`?: boolean
33
63
  - `iconName?`: any icon name from the Icon component
34
64
  - `iconSize?`: rem units
35
65
  - `iconColor?`: hex units #000
@@ -44,16 +74,18 @@
44
74
  -->
45
75
 
46
76
  <Button
47
- {...$$restProps}
48
77
  {variant}
49
78
  {size}
50
79
  {disabled}
51
80
  {rounded}
52
81
  {circle}
53
82
  {square}
83
+ {ariaLabel}
84
+ {ariaDisabled}
54
85
  customClass={btnCustomClass}
55
86
  customStyles={btnCustomStyles}
56
- on:click
87
+ onClick={onClick}
88
+ {...data}
57
89
  >
58
90
  {#if loading}
59
91
  <i class="icon-loading do-loader" style={iconPosition === 'start' ? 'order:1;' : 'order:2;'}
package/dist/molecules/IconButton/IconButton.svelte.d.ts CHANGED
@@ -1,20 +1,29 @@
1
1
  import type { iProps } from './iProps.ts';
2
- interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
3
- new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
4
- $$bindings?: Bindings;
5
- } & Exports;
6
- (internal: unknown, props: Props & {
7
- $$events?: Events;
8
- $$slots?: Slots;
9
- }): Exports & {
10
- $set?: any;
11
- $on?: any;
12
- };
13
- z_$$bindings?: Bindings;
14
- }
2
+ type $$ComponentProps = {
3
+ variant?: iProps['variant'];
4
+ size?: iProps['size'];
5
+ label?: iProps['label'];
6
+ disabled?: iProps['disabled'];
7
+ loading?: iProps['loading'];
8
+ onClick: iProps['onClick'];
9
+ ariaLabel: iProps['ariaLabel'];
10
+ ariaDisabled?: iProps['ariaDisabled'];
11
+ iconName: iProps['iconName'];
12
+ iconSize?: iProps['iconSize'];
13
+ iconColor?: iProps['iconColor'];
14
+ iconPosition?: iProps['iconPosition'];
15
+ rounded?: iProps['rounded'];
16
+ circle?: iProps['circle'];
17
+ square?: iProps['square'];
18
+ btnCustomClass?: iProps['btnCustomClass'];
19
+ iCustomClass?: iProps['iCustomClass'];
20
+ btnCustomStyles?: iProps['btnCustomStyles'];
21
+ iCustomStyles?: iProps['iCustomStyles'];
22
+ data?: iProps['data'];
23
+ };
15
24
  /**
16
25
  * ```Svelte
17
- * <IconButton label?={'text'} variant?={'variant'} size?={'size'} on:click={()=>{}} disabled?={disabled} loading?={loading} iconName?={'iconName'} iconSize?={'iconSize'} />
26
+ * <IconButton label?={'text'} variant?={'variant'} size?={'size'} onClick={()=>{}} disabled?={disabled} loading?={loading} iconName?={'iconName'} iconSize?={'iconSize'} ariaLabel={ariaLabel} ariaDisabled={ariaDisabled}/>
18
27
  * ```
19
28
  * - `variant?`: 'do-btn-primary' | 'do-btn-secondary' | 'do-btn-tertiary' | 'do-btn-accent' | 'do-btn-neutral'
20
29
  * - `size?`: rem units
@@ -22,6 +31,9 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
22
31
  * - `disabled?`: boolean
23
32
  * - `rounded?`: boolean
24
33
  * - `loading?`: boolean
34
+ * - `onClick`: () => void
35
+ * - `ariaLabel`: string
36
+ * - `ariaDisabled`?: boolean
25
37
  * - `iconName?`: any icon name from the Icon component
26
38
  * - `iconSize?`: rem units
27
39
  * - `iconColor?`: hex units #000
@@ -34,29 +46,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
34
46
  * - `iCustomStyles?`: any CSS style
35
47
  * ```
36
48
  */
37
- declare const IconButton: $$__sveltets_2_IsomorphicComponent<{
38
- [x: string]: any;
39
- variant?: "do-btn-primary" | "do-btn-secondary" | "do-btn-tertiary" | "do-btn-link" | "do-btn-accent" | undefined;
40
- size?: "do-btn-sm" | "do-btn-md" | "do-btn-lg" | undefined;
41
- label?: string | undefined;
42
- disabled?: boolean | undefined;
43
- loading?: boolean | undefined;
44
- iconName?: iProps["iconName"] | undefined;
45
- iconSize?: string | undefined;
46
- iconColor?: string | undefined;
47
- iconPosition?: "start" | "end" | undefined;
48
- rounded?: boolean | undefined;
49
- circle?: boolean | undefined;
50
- square?: boolean | undefined;
51
- btnCustomClass?: string | undefined;
52
- iCustomClass?: string | undefined;
53
- btnCustomStyles?: string | undefined;
54
- iCustomStyles?: string | undefined;
55
- }, {
56
- click: any;
57
- } & {
58
- [evt: string]: CustomEvent<any>;
59
- }, {}, {}, string>;
60
- type IconButton = InstanceType<typeof IconButton>;
49
+ declare const IconButton: import("svelte").Component<$$ComponentProps, {}, "">;
50
+ type IconButton = ReturnType<typeof IconButton>;
61
51
  export default IconButton;
62
52
  //# sourceMappingURL=IconButton.svelte.d.ts.map
package/dist/molecules/IconButton/IconButton.svelte.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"IconButton.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/molecules/IconButton/IconButton.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAyC1C,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,QAAA,MAAM,UAAU;;;;;;;eAhCkgB,MAAM,CAAC,UAAU,CAAC;;;;;;;;;;;;;;;kBAgC9a,CAAC;AACrG,KAAK,UAAU,GAAG,YAAY,CAAC,OAAO,UAAU,CAAC,CAAC;AACpD,eAAe,UAAU,CAAC"}
1
+ {"version":3,"file":"IconButton.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/molecules/IconButton/IconButton.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAEzC,KAAK,gBAAgB,GAAI;IACxB,OAAO,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC,UAAU,CAAC,CAAC;IAC9B,OAAO,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC5B,OAAO,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC3B,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;IAC/B,YAAY,CAAC,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC;IACtC,QAAQ,EAAE,MAAM,CAAC,UAAU,CAAC,CAAC;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAC,UAAU,CAAC,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;IAChC,YAAY,CAAC,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC;IACtC,OAAO,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC;IAC1B,MAAM,CAAC,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC,gBAAgB,CAAC,CAAC;IAC1C,YAAY,CAAC,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC;IACtC,eAAe,CAAC,EAAE,MAAM,CAAC,iBAAiB,CAAC,CAAC;IAC5C,aAAa,CAAC,EAAE,MAAM,CAAC,eAAe,CAAC,CAAC;IACxC,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;CACtB,CAAC;AA8CH;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,QAAA,MAAM,UAAU,sDAAwC,CAAC;AACzD,KAAK,UAAU,GAAG,UAAU,CAAC,OAAO,UAAU,CAAC,CAAC;AAChD,eAAe,UAAU,CAAC"}
package/dist/molecules/IconButton/iProps.d.ts CHANGED
@@ -6,6 +6,9 @@ export interface iProps extends HTMLButtonAttributes {
6
6
  label?: string;
7
7
  disabled?: boolean;
8
8
  loading?: boolean;
9
+ onClick: () => void;
10
+ ariaLabel: string;
11
+ ariaDisabled?: boolean | undefined;
9
12
  iconName: IconNames;
10
13
  iconSize?: string;
11
14
  iconColor?: string;
@@ -18,5 +21,8 @@ export interface iProps extends HTMLButtonAttributes {
18
21
  iCustomClass?: string;
19
22
  btnCustomStyles?: string;
20
23
  iCustomStyles?: string;
24
+ data?: {
25
+ [key: string]: string;
26
+ };
21
27
  }
22
28
  //# sourceMappingURL=iProps.d.ts.map
package/dist/molecules/IconButton/iProps.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"iProps.d.ts","sourceRoot":"","sources":["../../../src/lib/molecules/IconButton/iProps.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,mCAAmC,CAAC;AACnE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAE5D,MAAM,WAAW,MAAO,SAAQ,oBAAoB;IACnD,OAAO,CAAC,EAAE,gBAAgB,GAAG,kBAAkB,GAAG,iBAAiB,GAAG,aAAa,GAAG,eAAe,CAAC;IACtG,IAAI,CAAC,EAAE,WAAW,GAAG,WAAW,GAAG,WAAW,CAAC;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;IAC/B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;CACvB"}
1
+ {"version":3,"file":"iProps.d.ts","sourceRoot":"","sources":["../../../src/lib/molecules/IconButton/iProps.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,mCAAmC,CAAC;AACnE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAE5D,MAAM,WAAW,MAAO,SAAQ,oBAAoB;IACnD,OAAO,CAAC,EAAE,gBAAgB,GAAG,kBAAkB,GAAG,iBAAiB,GAAG,aAAa,GAAG,eAAe,CAAC;IACtG,IAAI,CAAC,EAAE,WAAW,GAAG,WAAW,GAAG,WAAW,CAAC;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACnC,QAAQ,EAAE,SAAS,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;IAC/B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,IAAI,CAAC,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAC,CAAC;CAC/B"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "do-ui-design-system",
3
- "version": "1.0.16",
3
+ "version": "1.0.18",
4
4
  "description": "Design system en Svelte + CSS + Storybook",
5
5
  "author": "Data Observatory",
6
6
  "license": "MIT",