do-ui-design-system 1.0.21 → 1.1.0

package/dist/atoms/Badge/Badge.svelte

@@ -9,7 +9,7 @@
 		title,
 		tabIndex,
 		ariaHidden,
-		data,
+		dataTestId,
 		customClass,
 		customStyles
 	}: {
@@ -20,7 +20,7 @@
 		title?: iProps['title'];
 		tabIndex?: iProps['tabIndex'];
 		ariaHidden?: iProps['ariaHidden'];
-		data?: iProps['data'];
+		dataTestId?: iProps['dataTestId'];
 		customClass?: iProps['customClass'];
 		customStyles?: iProps['customStyles'];
 	} = $props();
@@ -28,7 +28,7 @@
 
 <!-- @component Badge
   ```Svelte
-    <Badge label={label} variant={variant} role={role} aria-label={ariaLabel} title={title} tabindex={tabIndex} aria-hidden={ariaHidden} data={{'data-*': 'id'}} style={customStyles} class={customClass}/>
+    <Badge label={label} variant={variant} role={role} aria-label={ariaLabel} title={title} tabindex={tabIndex} aria-hidden={ariaHidden} data-testid={dataTestId} style={customStyles} class={customClass}/>
   	```
 	- `label`: string - the text to display in the counter
 	- `variant?`: 'do-badge-primary' | 'do-badge-accent'
@@ -37,7 +37,7 @@
 	- `title?`: string
 	- `tabIndex?`: -1 | 0 | number
 	- `ariaHidden?`: boolean
-	- `data?`: {[key: string]: string}
+	- `dataTestId?`: string
 	- `customClass?`: string
 	- `customStyles?`: any CSS style
 -->
@@ -50,7 +50,7 @@
 	{title}
 	{...tabIndex === 0 ? { tabindex: 0 } : {}}
 	aria-hidden={ariaHidden}
-	{...data}
+	data-testid={dataTestId}
 >
 	<span>{label}</span>
 </div>

package/dist/atoms/Badge/Badge.svelte.d.ts

@@ -7,14 +7,14 @@ type $$ComponentProps = {
     title?: iProps['title'];
     tabIndex?: iProps['tabIndex'];
     ariaHidden?: iProps['ariaHidden'];
-    data?: iProps['data'];
+    dataTestId?: iProps['dataTestId'];
     customClass?: iProps['customClass'];
     customStyles?: iProps['customStyles'];
 };
 /**
  * Badge
  *  ```Svelte
- *    <Badge label={label} variant={variant} role={role} aria-label={ariaLabel} title={title} tabindex={tabIndex} aria-hidden={ariaHidden} data={{'data-*': 'id'}} style={customStyles} class={customClass}/>
+ *    <Badge label={label} variant={variant} role={role} aria-label={ariaLabel} title={title} tabindex={tabIndex} aria-hidden={ariaHidden} data-testid={dataTestId} style={customStyles} class={customClass}/>
  *  	```
  * - `label`: string - the text to display in the counter
  * - `variant?`: 'do-badge-primary' | 'do-badge-accent'
@@ -23,7 +23,7 @@ type $$ComponentProps = {
  * - `title?`: string
  * - `tabIndex?`: -1 | 0 | number
  * - `ariaHidden?`: boolean
- * - `data?`: {[key: string]: string}
+ * - `dataTestId?`: string
  * - `customClass?`: string
  * - `customStyles?`: any CSS style
  */

package/dist/atoms/Badge/Badge.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/atoms/Badge/Badge.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAEzC,KAAK,gBAAgB,GAAI;IACxB,KAAK,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC,UAAU,CAAC,CAAC;IAC9B,UAAU,CAAC,EAAE,MAAM,CAAC,YAAY,CAAC,CAAC;IAClC,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC,aAAa,CAAC,CAAC;IACpC,YAAY,CAAC,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC;CACtC,CAAC;AA0BH;;;;;;;;;;;;;;;GAeG;AACH,QAAA,MAAM,KAAK,sDAAwC,CAAC;AACpD,KAAK,KAAK,GAAG,UAAU,CAAC,OAAO,KAAK,CAAC,CAAC;AACtC,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Badge.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/atoms/Badge/Badge.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAEzC,KAAK,gBAAgB,GAAI;IACxB,KAAK,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAC,UAAU,CAAC,CAAC;IAC9B,UAAU,CAAC,EAAE,MAAM,CAAC,YAAY,CAAC,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,CAAC,YAAY,CAAC,CAAC;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC,aAAa,CAAC,CAAC;IACpC,YAAY,CAAC,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC;CACtC,CAAC;AA0BH;;;;;;;;;;;;;;;GAeG;AACH,QAAA,MAAM,KAAK,sDAAwC,CAAC;AACpD,KAAK,KAAK,GAAG,UAAU,CAAC,OAAO,KAAK,CAAC,CAAC;AACtC,eAAe,KAAK,CAAC"}

package/dist/atoms/Badge/iProps.d.ts

@@ -6,9 +6,7 @@ export interface iProps {
     title?: string;
     tabIndex?: -1 | 0 | number;
     ariaHidden?: boolean;
-    data?: {
-        [key: string]: string;
-    };
+    dataTestId?: string;
     customClass?: string;
     customStyles?: string;
 }

package/dist/atoms/Badge/iProps.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"iProps.d.ts","sourceRoot":"","sources":["../../../src/lib/atoms/Badge/iProps.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,MAAM;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,kBAAkB,GAAG,iBAAiB,CAAC;IACjD,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAC;IACtC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,IAAI,CAAC,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAC,CAAC;IAC/B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;CACtB"}
+{"version":3,"file":"iProps.d.ts","sourceRoot":"","sources":["../../../src/lib/atoms/Badge/iProps.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,MAAM;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,kBAAkB,GAAG,iBAAiB,CAAC;IACjD,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAC;IACtC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;CACtB"}

package/dist/atoms/Button/Button.svelte

@@ -42,6 +42,7 @@
 		customClass?: iProps['customClass'];
 		square?: iProps['square'];
 		noBorder?: iProps['noBorder'];
+		// dataTestId?: iProps['dataTestId'];
 		data?: iProps['data'];
 		children?: Snippet;
 	} = $props();

package/dist/atoms/Button/Button.svelte.d.ts.map

@@ -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;IAC9B,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"}
+{"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"}

package/dist/atoms/Button/iProps.d.ts.map

@@ -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;IACnB,IAAI,CAAC,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAC,CAAC;CAE/B"}
+{"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"}

package/dist/atoms/Card/Card.svelte

@@ -7,27 +7,27 @@
 		variant,
 		customClass,
 		ariaLabel,
-		data
+		dataTestId
 	}: {
 		children: Snippet;
 		variant: iProps['variant'];
 		customClass?: iProps['customClass'];
 		ariaLabel?: iProps['ariaLabel'];
-		data?: iProps['data'];
+		dataTestId?: iProps['dataTestId'];
 	} = $props();
 </script>
 
 <!-- @component Card
   ```Svelte
-    <Card variant={variant} customClass={customClass} data={{'data-*': 'id'}} >
+    <Card variant={variant} customClass={customClass}>
         {@render children()} // render custom content inside Card tags
     </Card>
   	```
 	- `variant`:  'do-card-primary' | 'do-card-secondary'
     - `customClass?`: string - additional custom class for styling
 	- `ariaLabel?`: string
-	- `data?`: {[key: string]: string};
+	- `dataTestId?`: string
 -->
-<div class="do-card {variant} {customClass}" aria-label={ariaLabel} {...data}>
+<div class="do-card {variant} {customClass}" aria-label={ariaLabel} data-testid={dataTestId}>
 	{@render children?.()}
 </div>

package/dist/atoms/Card/Card.svelte.d.ts

@@ -5,19 +5,19 @@ type $$ComponentProps = {
     variant: iProps['variant'];
     customClass?: iProps['customClass'];
     ariaLabel?: iProps['ariaLabel'];
-    data?: iProps['data'];
+    dataTestId?: iProps['dataTestId'];
 };
 /**
  * Card
  *  ```Svelte
- *    <Card variant={variant} customClass={customClass} data={{'data-*': 'id'}} >
+ *    <Card variant={variant} customClass={customClass}>
  *        {@render children()} // render custom content inside Card tags
  *    </Card>
  *  	```
  * - `variant`:  'do-card-primary' | 'do-card-secondary'
  *    - `customClass?`: string - additional custom class for styling
  * - `ariaLabel?`: string
- * - `data?`: {[key: string]: string};
+ * - `dataTestId?`: string
  */
 declare const Card: import("svelte").Component<$$ComponentProps, {}, "">;
 type Card = ReturnType<typeof Card>;

package/dist/atoms/Card/Card.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Card.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/atoms/Card/Card.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,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC,aAAa,CAAC,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;IAChC,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;CACtB,CAAC;AAqBH;;;;;;;;;;;GAWG;AACH,QAAA,MAAM,IAAI,sDAAwC,CAAC;AACnD,KAAK,IAAI,GAAG,UAAU,CAAC,OAAO,IAAI,CAAC,CAAC;AACpC,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Card.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/atoms/Card/Card.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,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC3B,WAAW,CAAC,EAAE,MAAM,CAAC,aAAa,CAAC,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;IAChC,UAAU,CAAC,EAAE,MAAM,CAAC,YAAY,CAAC,CAAC;CAClC,CAAC;AAqBH;;;;;;;;;;;GAWG;AACH,QAAA,MAAM,IAAI,sDAAwC,CAAC;AACnD,KAAK,IAAI,GAAG,UAAU,CAAC,OAAO,IAAI,CAAC,CAAC;AACpC,eAAe,IAAI,CAAC"}

package/dist/atoms/Card/iProps.d.ts

@@ -2,8 +2,6 @@ export interface iProps {
     variant: 'do-card-primary' | 'do-card-secondary';
     customClass?: string;
     ariaLabel: string;
-    data?: {
-        [key: string]: string;
-    };
+    dataTestId?: string;
 }
 //# sourceMappingURL=iProps.d.ts.map

package/dist/atoms/Card/iProps.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"iProps.d.ts","sourceRoot":"","sources":["../../../src/lib/atoms/Card/iProps.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,MAAM;IACtB,OAAO,EAAE,iBAAiB,GAAG,mBAAmB,CAAC;IACjD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAC,CAAC;CAC/B"}
+{"version":3,"file":"iProps.d.ts","sourceRoot":"","sources":["../../../src/lib/atoms/Card/iProps.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,MAAM;IACtB,OAAO,EAAE,iBAAiB,GAAG,mBAAmB,CAAC;IACjD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;CACpB"}

package/dist/atoms/Chip/Chip.svelte

@@ -11,7 +11,7 @@
 		maxLength = null,
 		variant = 'do-chip-primary',
 		customClass = '',
-		data,
+		dataTestId,
 		tooltip,
 		tooltipContent,
 		children
@@ -24,7 +24,7 @@
 		maxLength?: iProps['maxLength'];
 		variant?: iProps['variant'];
 		customClass?: iProps['customClass'];
-		data?: iProps['data'];
+		dataTestId?: iProps['dataTestId'];
 		tooltip?: iProps['tooltip'];
 		tooltipContent?: iProps['tooltipContent'];
 		children?: Snippet;
@@ -44,7 +44,7 @@
 
 <!-- @component Chip
   ```Svelte
-    <Chip label={label} aria-label={ariaLabel} role={role} tabindex={tabIndex} id={id} maxLength={maxLength} variant={variant} customClass={customClass} data={{'data-*': 'id'}} tooltip={tooltip} tooltipContent={tooltipContent}>
+    <Chip label={label} aria-label={ariaLabel} role={role} tabindex={tabIndex} id={id} maxLength={maxLength} variant={variant} customClass={customClass} data-testid={dataTestId} tooltip={tooltip} tooltipContent={tooltipContent}>
         {@render children()} // render custom content inside Chip tags
     </Chip>
   	```
@@ -56,7 +56,7 @@
 	- `maxLength?`: number | null - max length of the text, if exceeded it will be truncated and "…" will be added
 	- `variant?`: 'do-chip-primary' | 'do-chip-secondary' | 'do-chip-accent'
     - `customClass?`: string - additional custom class for styling
-	- `data?`: {[key: string]: string};
+	- `dataTestId?`: string
 	- `tooltip?`: boolean
 	- `tooltipContent?`: HTML content
 
@@ -69,7 +69,7 @@
 	{role}
 	{...tabIndex === 0 ? { tabindex: 0 } : {}}
 	{id}
-	{...data}
+	data-testid={dataTestId}
 >
 	<span>
 		{displayedText}

package/dist/atoms/Chip/Chip.svelte.d.ts

@@ -9,7 +9,7 @@ type $$ComponentProps = {
     maxLength?: iProps['maxLength'];
     variant?: iProps['variant'];
     customClass?: iProps['customClass'];
-    data?: iProps['data'];
+    dataTestId?: iProps['dataTestId'];
     tooltip?: iProps['tooltip'];
     tooltipContent?: iProps['tooltipContent'];
     children?: Snippet;
@@ -17,7 +17,7 @@ type $$ComponentProps = {
 /**
  * Chip
  *  ```Svelte
- *    <Chip label={label} aria-label={ariaLabel} role={role} tabindex={tabIndex} id={id} maxLength={maxLength} variant={variant} customClass={customClass} data={{'data-*': 'id'}} tooltip={tooltip} tooltipContent={tooltipContent}>
+ *    <Chip label={label} aria-label={ariaLabel} role={role} tabindex={tabIndex} id={id} maxLength={maxLength} variant={variant} customClass={customClass} data-testid={dataTestId} tooltip={tooltip} tooltipContent={tooltipContent}>
  *        {@render children()} // render custom content inside Chip tags
  *    </Chip>
  *  	```
@@ -29,7 +29,7 @@ type $$ComponentProps = {
  * - `maxLength?`: number | null - max length of the text, if exceeded it will be truncated and "…" will be added
  * - `variant?`: 'do-chip-primary' | 'do-chip-secondary' | 'do-chip-accent'
  *    - `customClass?`: string - additional custom class for styling
- * - `data?`: {[key: string]: string};
+ * - `dataTestId?`: string
  * - `tooltip?`: boolean
  * - `tooltipContent?`: HTML content
  */

package/dist/atoms/Chip/Chip.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Chip.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/atoms/Chip/Chip.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,SAAS,CAAC,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;IAChC,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC,UAAU,CAAC,CAAC;IAC9B,EAAE,CAAC,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;IAChC,OAAO,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAC,aAAa,CAAC,CAAC;IACpC,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC,gBAAgB,CAAC,CAAC;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAiDH;;;;;;;;;;;;;;;;;;GAkBG;AACH,QAAA,MAAM,IAAI,sDAAwC,CAAC;AACnD,KAAK,IAAI,GAAG,UAAU,CAAC,OAAO,IAAI,CAAC,CAAC;AACpC,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Chip.svelte.d.ts","sourceRoot":"","sources":["../../../src/lib/atoms/Chip/Chip.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,SAAS,CAAC,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;IAChC,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC,UAAU,CAAC,CAAC;IAC9B,EAAE,CAAC,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC,WAAW,CAAC,CAAC;IAChC,OAAO,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAC,aAAa,CAAC,CAAC;IACpC,UAAU,CAAC,EAAE,MAAM,CAAC,YAAY,CAAC,CAAC;IAClC,OAAO,CAAC,EAAE,MAAM,CAAC,SAAS,CAAC,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC,gBAAgB,CAAC,CAAC;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAiDH;;;;;;;;;;;;;;;;;;GAkBG;AACH,QAAA,MAAM,IAAI,sDAAwC,CAAC;AACnD,KAAK,IAAI,GAAG,UAAU,CAAC,OAAO,IAAI,CAAC,CAAC;AACpC,eAAe,IAAI,CAAC"}

package/dist/atoms/Chip/iProps.d.ts

@@ -7,9 +7,7 @@ export interface iProps {
     maxLength?: number | null | undefined;
     variant?: 'do-chip-primary' | 'do-chip-secondary' | 'do-chip-accent';
     customClass?: string;
-    data?: {
-        [key: string]: string;
-    };
+    dataTestId?: string;
     tooltip?: boolean;
     tooltipContent?: string | null;
 }

package/dist/atoms/Chip/iProps.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"iProps.d.ts","sourceRoot":"","sources":["../../../src/lib/atoms/Chip/iProps.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,MAAM;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,QAAQ,CAAC;IACpC,QAAQ,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC;IAC3B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IACtC,OAAO,CAAC,EAAE,iBAAiB,GAAG,mBAAmB,GAAG,gBAAgB,CAAC;IACrE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAC,CAAC;IAC/B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC/B"}
+{"version":3,"file":"iProps.d.ts","sourceRoot":"","sources":["../../../src/lib/atoms/Chip/iProps.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,MAAM;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,QAAQ,CAAC;IACpC,QAAQ,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,GAAG,MAAM,CAAC;IAC3B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IACtC,OAAO,CAAC,EAAE,iBAAiB,GAAG,mBAAmB,GAAG,gBAAgB,CAAC;IACrE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC/B"}

package/dist/do-theme/button.css

@@ -46,59 +46,59 @@
 }
 
 .do-btn-primary {
-	background-color: var(--do-color-primary);
-	border-color: var(--do-color-primary-border);
-	color: var(--do-color-primary-content);
+	background-color: var(--do-btn-primary);
+	border-color: var(--do-btn-primary-border);
+	color: var(--do-btn-primary-content);
 }
 
 .do-btn-primary:hover {
-	background-color: var(--do-color-primary-hover);
-	border-color: var(--do-color-primary-border-hover);
-	color: var(--do-color-primary-content-hover);
+	background-color: var(--do-btn-primary-hover);
+	border-color: var(--do-btn-primary-border-hover);
+	color: var(--do-btn-primary-content-hover);
 }
 
 .do-btn-secondary {
-	background-color: var(--do-color-secondary);
-	border-color: var(--do-color-secondary-border);
-	color: var(--do-color-secondary-content);
+	background-color: var(--do-btn-secondary-bg);
+	border-color: var(--do-btn-secondary-border);
+	color: var(--do-btn-secondary-content);
 }
 
 .do-btn-secondary:hover {
-	color: var(--do-color-secondary-content-hover);
+	color: var(--do-btn-secondary-content-hover);
 	border-color: var(--do-transparent);
-	background-color: var(--do-color-secondary-hover);
+	background-color: var(--do-btn-secondary-hover);
 }
 
 .do-btn-tertiary {
-	background-color: var(--do-color-tertiary);
-	border-color: var(--do-color-tertiary-border);
-	color: var(--do-color-tertiary-content);
+	background-color: var(--do-btn-tertiary-bg);
+	border-color: var(--do-btn-tertiary-border);
+	color: var(--do-btn-tertiary-content);
 }
 
 .do-btn-tertiary:hover,
 .do-btn-tertiary:focus {
-	background-color: var(--do-color-tertiary-content);
-	border-color: var(--do-color-tertiary-content);
-	color: var(--do-color-tertiary-hover-content);
+	background-color: var(--do-btn-tertiary-content);
+	border-color: var(--do-btn-tertiary-content);
+	color: var(--do-btn-tertiary-hover-content);
 }
 
 .do-btn-accent {
-	background-color: var(--do-color-accent);
-	border-color: var(--do-color-accent-border);
-	color: var(--do-color-accent-content);
+	background-color: var(--do-btn-accent-bg);
+	border-color: var(--do-btn-accent-border);
+	color: var(--do-btn-accent-content);
 }
 
 .do-btn-accent:hover,
 .do-btn-accent:focus {
-	color: var(--do-color-accent-hover-content);
-	border: 1px solid var(--do-color-accent-hover-border);
-	background-color: var(--do-color-accent-hover);
+	color: var(--do-btn-accent-hover-content);
+	border: 1px solid var(--do-btn-accent-hover-border);
+	background-color: var(--do-btn-accent-hover-bg);
 }
 
 .do-btn-link {
 	border-color: var(--do-transparent);
 	background-color: var(--do-transparent);
-	color: var(--do-color-link);
+	color: var(--do-btn-link);
 	text-underline-offset: 4px;
 }
 
@@ -108,15 +108,15 @@
 
 .do-btn-link:hover,
 .do-btn-link:focus {
-	color: var(--do-color-link-hover-content);
-	border-color: 1px solid var(--do-color-link-hover-border);
+	color: var(--do-btn-link-hover-content);
+	border-color: 1px solid var(--do-btn-link-hover-border);
 	background-color: var(--do-transparent);
 }
 
 .do-btn-link-accent {
 	border-color: var(--do-transparent);
 	background-color: var(--do-transparent);
-	color: var(--do-color-link-secondary);
+	color: var(--do-btn-link-secondary);
 	text-underline-offset: 4px;
 }
 
@@ -126,9 +126,22 @@
 
 .do-btn-link-accent:hover,
 .do-btn-link-accent:focus {
-	color: var(--do-color-primary-content);
-	border-color: var(--do-color-primary-border);
-	background-color: var(--do-color-link-secondary-hover);
+	color: var(--do-btn-primary-content);
+	border-color: var(--do-btn-primary-border);
+	background-color: var(--do-btn-link-secondary-hover);
+}
+
+.do-btn-ghost {
+	background-color: transparent;
+	border-color: transparent;
+	color: inherit;
+}
+
+.do-btn-ghost:hover {
+	background-color: #eee8;
+	border-color: transparent;
+	backdrop-filter: blur(0.5rem);
+	color: #eeee;
 }
 
 .do-loader {
@@ -136,13 +149,13 @@
 }
 
 .do-chip-primary {
-color: var(--do-chip-content);
-background-color: var(--do-chip-bg);
+	color: var(--do-chip-content);
+	background-color: var(--do-chip-bg);
 }
 
 .do-chip-btn-primary {
 	color: var(--do-chip-content);
-background-color: var(--do-chip-bg);
+	background-color: var(--do-chip-bg);
 }
 
 .do-chip-primary:hover,
@@ -151,24 +164,12 @@ background-color: var(--do-chip-bg);
 	background-color: var(--do-chip-bg-hover);
 }
 
-.do-btn-ghost {
-	background-color: transparent;
-	border-color: none;
-	color: inherit;
-}
-
-.do-btn-ghost:hover {
-	background-color: transparent;
-	border-color: none;
-	backdrop-filter: blur(0.5rem);
-	color: #FFF8;
-}
-
 @keyframes rotation {
 	0% {
 		transform: rotate(0deg);
 	}
+
 	100% {
 		transform: rotate(360deg);
 	}
-}
+}

package/dist/do-theme/color.css

@@ -0,0 +1,32 @@
+.do-bg--primary {
+    background-color: var(--do-bg--primary);
+}
+
+.do-bg--secondary {
+    background-color: var(--do-bg--secondary);
+}
+
+.do-box {
+    border: 1px solid var(--do-box--primary-border);
+    color: var(--do-text-base);
+    border-radius: 0.5rem;
+    padding: 1.5rem;
+
+    &.do-box--primary {
+        border-color: var(--do-box--primary-border);
+        background-color: var(--do-box--primary-bg);
+    }
+
+    &.do-box--secondary {
+        border-color: var(--do-box--secondary-border);
+        background-color: var(--do-box--secondary-bg);
+    }
+
+    &.do-box--sm {
+        padding: 0.75rem;
+    }
+
+    &.do-box--lg {
+        padding: 1.5rem;
+    }
+}