do-ui-design-system 1.1.5 → 1.1.6

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.
@@ -21,8 +21,15 @@
21
21
  customClass = '',
22
22
  square,
23
23
  noBorder,
24
+ noHover,
25
+ anchor,
26
+ target,
27
+ download,
28
+ rel,
29
+ referrerpolicy,
30
+ href,
24
31
  data,
25
- children,
32
+ children
26
33
  }: {
27
34
  label?: iProps['label'];
28
35
  type?: iProps['type'];
@@ -42,8 +49,15 @@
42
49
  customClass?: iProps['customClass'];
43
50
  square?: iProps['square'];
44
51
  noBorder?: iProps['noBorder'];
52
+ noHover?: iProps['noHover'];
53
+ anchor?: iProps['anchor'];
54
+ target?: iProps['target'];
55
+ download?: iProps['download'];
56
+ rel?: iProps['rel'];
57
+ referrerpolicy?: iProps['referrerpolicy'];
45
58
  // dataTestId?: iProps['dataTestId'];
46
59
  data?: iProps['data'];
60
+ href?: iProps['href'];
47
61
  children?: Snippet;
48
62
  } = $props();
49
63
 
@@ -88,24 +102,52 @@
88
102
  - `customStyles?`: any CSS style
89
103
  - `noBorder`?: boolean
90
104
  - `data?`: {[key: string]: string}
105
+ - `anchor?`: boolean (use `<a>` tag instead of `<button>`)
91
106
  -->
92
-
93
- <button
94
- {type}
95
- aria-label={ariaLabel}
96
- onclick={onClick}
97
- {disabled}
98
- {title}
99
- aria-disabled={ariaDisabled}
100
- {name}
101
- {id}
102
- class={['do-btn', `${variant}`, `${size}`, `${customClass}`].join(' ')}
103
- style={mergedStyles}
104
- {...data}
105
- >
106
- {@render children?.()}
107
- {#if label}
108
- <span>{label}</span>
109
- {/if}
110
- <i class="icon-loading do-loader" style={loading ? 'display:inline-block;' : 'display:none;'}></i>
111
- </button>
107
+ {#if anchor}
108
+ <a
109
+ {type}
110
+ aria-label={ariaLabel}
111
+ {title}
112
+ aria-disabled={ariaDisabled}
113
+ {id}
114
+ class={['do-btn', `${variant}`, `${size}`, `${customClass}`].join(' ')}
115
+ class:no-hover={noHover}
116
+ style={mergedStyles}
117
+ {...data}
118
+ {target}
119
+ {download}
120
+ {rel}
121
+ {referrerpolicy}
122
+ {href}
123
+ >
124
+ {@render children?.()}
125
+ {#if label}
126
+ <span>{label}</span>
127
+ {/if}
128
+ <i class="icon-loading do-loader" style={loading ? 'display:inline-block;' : 'display:none;'}
129
+ ></i>
130
+ </a>
131
+ {:else}
132
+ <button
133
+ {type}
134
+ aria-label={ariaLabel}
135
+ onclick={onClick}
136
+ {disabled}
137
+ {title}
138
+ aria-disabled={ariaDisabled}
139
+ {name}
140
+ {id}
141
+ class={['do-btn', `${variant}`, `${size}`, `${customClass}`].join(' ')}
142
+ class:no-hover={noHover}
143
+ style={mergedStyles}
144
+ {...data}
145
+ >
146
+ {@render children?.()}
147
+ {#if label}
148
+ <span>{label}</span>
149
+ {/if}
150
+ <i class="icon-loading do-loader" style={loading ? 'display:inline-block;' : 'display:none;'}
151
+ ></i>
152
+ </button>
153
+ {/if}
@@ -19,7 +19,14 @@ type $$ComponentProps = {
19
19
  customClass?: iProps['customClass'];
20
20
  square?: iProps['square'];
21
21
  noBorder?: iProps['noBorder'];
22
+ noHover?: iProps['noHover'];
23
+ anchor?: iProps['anchor'];
24
+ target?: iProps['target'];
25
+ download?: iProps['download'];
26
+ rel?: iProps['rel'];
27
+ referrerpolicy?: iProps['referrerpolicy'];
22
28
  data?: iProps['data'];
29
+ href?: iProps['href'];
23
30
  children?: Snippet;
24
31
  };
25
32
  /**
@@ -43,6 +50,7 @@ type $$ComponentProps = {
43
50
  * - `customStyles?`: any CSS style
44
51
  * - `noBorder`?: boolean
45
52
  * - `data?`: {[key: string]: string}
53
+ * - `anchor?`: boolean (use `<a>` tag instead of `<button>`)
46
54
  */
47
55
  declare const Button: import("svelte").Component<$$ComponentProps, {}, "">;
48
56
  type Button = ReturnType<typeof Button>;
@@ -1 +1 @@
1
- {"version":3,"file":"Button.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/atoms/Button/Button.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACtC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAEzC,KAAK,gBAAgB,GAAI;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;IACxB,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;IAC/B,OAAO,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC,UAAU,CAAC,CAAC;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC;IACtC,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,EAAE,CAAC,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC;IACtC,WAAW,CAAC,EAAE,MAAM,CAAC,aAAa,CAAC,CAAC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC,UAAU,CAAC,CAAC;IAE9B,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AA4DH;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,QAAA,MAAM,MAAM,sDAAwC,CAAC;AACrD,KAAK,MAAM,GAAG,UAAU,CAAC,OAAO,MAAM,CAAC,CAAC;AACxC,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"Button.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/atoms/Button/Button.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AACtC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAEzC,KAAK,gBAAgB,GAAI;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;IACxB,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,SAAS,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;IAC/B,OAAO,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC,UAAU,CAAC,CAAC;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC;IACtC,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,EAAE,CAAC,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC;IACtC,WAAW,CAAC,EAAE,MAAM,CAAC,aAAa,CAAC,CAAC;IACpC,MAAM,CAAC,EAAE,MAAM,CAAC,QAAQ,CAAC,CAAC;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC,UAAU,CAAC,CAAC;IAC9B,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,QAAQ,CAAC,EAAE,MAAM,CAAC,UAAU,CAAC,CAAC;IAC9B,GAAG,CAAC,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC;IACpB,cAAc,CAAC,EAAE,MAAM,CAAC,gBAAgB,CAAC,CAAC;IAE1C,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AA4EH;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,QAAA,MAAM,MAAM,sDAAwC,CAAC;AACrD,KAAK,MAAM,GAAG,UAAU,CAAC,OAAO,MAAM,CAAC,CAAC;AACxC,eAAe,MAAM,CAAC"}
@@ -17,6 +17,13 @@ export interface iProps {
17
17
  customClass?: string;
18
18
  square?: boolean;
19
19
  noBorder?: boolean;
20
+ noHover?: boolean;
21
+ anchor?: boolean;
22
+ target?: '_self' | '_blank' | '_parent' | '_top';
23
+ download?: '';
24
+ rel?: string;
25
+ referrerpolicy?: 'no-referrer' | 'no-referrer-when-downgrade' | 'origin' | 'origin-when-cross-origin' | 'same-origin' | 'strict-origin-when-cross-origin' | 'unsafe-url';
26
+ href?: string;
20
27
  data?: {
21
28
  [key: string]: string;
22
29
  };
@@ -1 +1 @@
1
- {"version":3,"file":"iProps.d.ts","sourceRoot":"","sources":["../../../src/lib/atoms/Button/iProps.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,MAAM;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACrC,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,gBAAgB,GAAG,kBAAkB,GAAG,iBAAiB,GAAG,aAAa,GAAG,eAAe,GAAG,oBAAoB,GAAG,cAAc,CAAC;IAC9I,IAAI,CAAC,EAAE,WAAW,GAAG,WAAW,GAAG,WAAW,CAAC;IAC/C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,IAAI,CAAC,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAC,CAAC;CAE/B"}
1
+ {"version":3,"file":"iProps.d.ts","sourceRoot":"","sources":["../../../src/lib/atoms/Button/iProps.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,MAAM;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACrC,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EACL,gBAAgB,GAChB,kBAAkB,GAClB,iBAAiB,GACjB,aAAa,GACb,eAAe,GACf,oBAAoB,GACpB,cAAc,CAAC;IAClB,IAAI,CAAC,EAAE,WAAW,GAAG,WAAW,GAAG,WAAW,CAAC;IAC/C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,MAAM,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,CAAC;IACjD,QAAQ,CAAC,EAAE,EAAE,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,cAAc,CAAC,EACZ,aAAa,GACb,4BAA4B,GAC5B,QAAQ,GACR,0BAA0B,GAC1B,aAAa,GACb,iCAAiC,GACjC,YAAY,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IAEf,IAAI,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAC;CACjC"}
@@ -113,6 +113,13 @@
113
113
  background-color: var(--do-transparent);
114
114
  }
115
115
 
116
+ .do-btn-link:not(.no-hover):hover,
117
+ .do-btn-link:not(.no-hover):focus {
118
+ color: var(--do-transparent);
119
+ border: 1px solid var(--do-transparent);
120
+ background-color: var(--do-transparent);
121
+ }
122
+
116
123
  .do-btn-link-accent {
117
124
  border-color: var(--do-transparent);
118
125
  background-color: var(--do-transparent);
@@ -172,4 +179,4 @@
172
179
  100% {
173
180
  transform: rotate(360deg);
174
181
  }
175
- }
182
+ }
@@ -1,8 +1,8 @@
1
1
  /* Inter y Space Grotesk están importados al final de este documento css
2
2
  Estas fuentes están descargadas en la carpeta fonts*/
3
3
 
4
- * {
5
- font-family: 'Inter', sans-serif !important;
4
+ body {
5
+ font-family: 'Inter', sans-serif;
6
6
  }
7
7
 
8
8
  .do-text-grotesk {
@@ -22,7 +22,10 @@ h5,
22
22
  h6,
23
23
  p,
24
24
  ol,
25
+ span,
26
+ label,
25
27
  ul {
28
+ font-family: 'Inter', sans-serif;
26
29
  color: var(--do-text-base);
27
30
  }
28
31
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "do-ui-design-system",
3
- "version": "1.1.5",
3
+ "version": "1.1.6",
4
4
  "description": "Design system en Svelte + CSS + Storybook",
5
5
  "author": "Data Observatory",
6
6
  "license": "MIT",