@dezkareid/components 1.0.2 → 1.0.3
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.
package/dist/components.min.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.button-module_button__-i1WR{align-items:center;border:none;border-radius:var(--border-radius-medium);cursor:pointer;display:inline-flex;font-family:var(--font-family-base);font-size:var(--font-size-300);font-weight:var(--font-weight-medium);gap:var(--spacing-8);justify-content:center;letter-spacing:var(--font-letter-spacing-wide);line-height:var(--font-line-height-none);text-decoration:none;transition:background-color .15s ease,color .15s ease,border-color .15s ease,box-shadow .15s ease,opacity .15s ease;white-space:nowrap}.button-module_button__-i1WR:focus-visible{box-shadow:0 0 0 2px var(--color-background-primary),0 0 0 4px var(--color-primary);outline:none}.button-module_button--sm__oyPIp,.button-module_button--small__seN6c{border-radius:var(--border-radius-small);font-size:var(--font-size-200);padding:var(--spacing-4) var(--spacing-12)}.button-module_button--md__KsJg5,.button-module_button--medium__4vh1u{font-size:var(--font-size-300);padding:var(--spacing-8) var(--spacing-24)}.button-module_button--large__g15uD,.button-module_button--lg__kuuR5{border-radius:var(--border-radius-large);font-size:var(--font-size-400);padding:var(--spacing-12) var(--spacing-32)}.button-module_button--primary__5NKaZ{--button-primary-color-background:var(--color-primary);--button-primary-color-text:var(--color-text-inverse);background-color:var(--button-primary-color-background);border:1px solid transparent;color:var(--button-primary-color-text)}.button-module_button--primary__5NKaZ:hover:not(.button-module_button--disabled__5X7It){box-shadow:var(--shadow-card-hover);opacity:.92}.button-module_button--outline__inPG2,.button-module_button--secondary__7CZqp{--button-secondary-color-background:transparent;--button-secondary-color-text:var(--color-primary);--button-secondary-color-border:var(--color-primary);background-color:var(--button-secondary-color-background);border:1px solid var(--button-secondary-color-border);color:var(--button-secondary-color-text)}.button-module_button--outline__inPG2:hover:not(.button-module_button--disabled__5X7It),.button-module_button--secondary__7CZqp:hover:not(.button-module_button--disabled__5X7It){background-color:var(--color-background-secondary);box-shadow:var(--shadow-subtle)}.button-module_button--success__Y-GUS{--button-success-color-background:var(--color-success);--button-success-color-text:var(--color-text-primary);background-color:var(--button-success-color-background);border:1px solid transparent;color:var(--button-success-color-text)}.button-module_button--success__Y-GUS:hover:not(.button-module_button--disabled__5X7It){box-shadow:var(--shadow-card-hover);opacity:.92}.button-module_button--ghost__7k3yA{--button-ghost-color-background:transparent;--button-ghost-color-text:var(--color-text-primary);background-color:var(--button-ghost-color-background);border:1px solid transparent;color:var(--button-ghost-color-text)}.button-module_button--ghost__7k3yA:hover:not(.button-module_button--disabled__5X7It){background-color:var(--color-background-secondary);border-color:var(--color-background-secondary)}.button-module_button--disabled__5X7It{cursor:not-allowed;opacity:.4;pointer-events:none}.tag-module_tag__DqU0X{align-items:center;border-radius:var(--spacing-12);display:inline-flex;font-family:var(--font-family-base);font-size:var(--font-size-100);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-none);padding:var(--spacing-4) var(--spacing-8)}.tag-module_tag--default__s9pfU{--tag-default-color-background:var(--color-background-secondary);--tag-default-color-text:var(--color-text-primary);background-color:var(--tag-default-color-background);color:var(--tag-default-color-text)}.tag-module_tag--success__e8fMj{--tag-success-color-background:var(--color-success);--tag-success-color-text:var(--color-text-
|
|
1
|
+
.button-module_button__-i1WR{align-items:center;border:none;border-radius:var(--border-radius-medium);cursor:pointer;display:inline-flex;font-family:var(--font-family-base);font-size:var(--font-size-300);font-weight:var(--font-weight-medium);gap:var(--spacing-8);justify-content:center;letter-spacing:var(--font-letter-spacing-wide);line-height:var(--font-line-height-none);text-decoration:none;transition:background-color .15s ease,color .15s ease,border-color .15s ease,box-shadow .15s ease,opacity .15s ease;white-space:nowrap}.button-module_button__-i1WR:focus-visible{box-shadow:0 0 0 2px var(--color-background-primary),0 0 0 4px var(--color-primary);outline:none}.button-module_button--sm__oyPIp,.button-module_button--small__seN6c{border-radius:var(--border-radius-small);font-size:var(--font-size-200);padding:var(--spacing-4) var(--spacing-12)}.button-module_button--md__KsJg5,.button-module_button--medium__4vh1u{font-size:var(--font-size-300);padding:var(--spacing-8) var(--spacing-24)}.button-module_button--large__g15uD,.button-module_button--lg__kuuR5{border-radius:var(--border-radius-large);font-size:var(--font-size-400);padding:var(--spacing-12) var(--spacing-32)}.button-module_button--primary__5NKaZ{--button-primary-color-background:var(--color-primary);--button-primary-color-text:var(--color-text-inverse);background-color:var(--button-primary-color-background);border:1px solid transparent;color:var(--button-primary-color-text)}.button-module_button--primary__5NKaZ:hover:not(.button-module_button--disabled__5X7It){box-shadow:var(--shadow-card-hover);opacity:.92}.button-module_button--outline__inPG2,.button-module_button--secondary__7CZqp{--button-secondary-color-background:transparent;--button-secondary-color-text:var(--color-primary);--button-secondary-color-border:var(--color-primary);background-color:var(--button-secondary-color-background);border:1px solid var(--button-secondary-color-border);color:var(--button-secondary-color-text)}.button-module_button--outline__inPG2:hover:not(.button-module_button--disabled__5X7It),.button-module_button--secondary__7CZqp:hover:not(.button-module_button--disabled__5X7It){background-color:var(--color-background-secondary);box-shadow:var(--shadow-subtle)}.button-module_button--success__Y-GUS{--button-success-color-background:var(--color-success);--button-success-color-text:var(--color-text-primary);background-color:var(--button-success-color-background);border:1px solid transparent;color:var(--button-success-color-text)}.button-module_button--success__Y-GUS:hover:not(.button-module_button--disabled__5X7It){box-shadow:var(--shadow-card-hover);opacity:.92}.button-module_button--ghost__7k3yA{--button-ghost-color-background:transparent;--button-ghost-color-text:var(--color-text-primary);background-color:var(--button-ghost-color-background);border:1px solid transparent;color:var(--button-ghost-color-text)}.button-module_button--ghost__7k3yA:hover:not(.button-module_button--disabled__5X7It){background-color:var(--color-background-secondary);border-color:var(--color-background-secondary)}.button-module_button--disabled__5X7It{cursor:not-allowed;opacity:.4;pointer-events:none}.tag-module_tag__DqU0X{align-items:center;border-radius:var(--spacing-12);display:inline-flex;font-family:var(--font-family-base);font-size:var(--font-size-100);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-none);padding:var(--spacing-4) var(--spacing-8)}.tag-module_tag--default__s9pfU{--tag-default-color-background:var(--color-background-secondary);--tag-default-color-text:var(--color-text-primary);background-color:var(--tag-default-color-background);color:var(--tag-default-color-text)}.tag-module_tag--success__e8fMj{--tag-success-color-background:var(--color-success);--tag-success-color-text:var(--color-text-primary);background-color:var(--tag-success-color-background);color:var(--tag-success-color-text)}.tag-module_tag--danger__9b-l4{--tag-danger-color-background:var(--color-danger);--tag-danger-color-text:var(--color-text-primary);background-color:var(--tag-danger-color-background);color:var(--tag-danger-color-text)}.tag-module_tag--warning__aHbOj{--tag-warning-color-background:var(--color-warning);--tag-warning-color-text:var(--color-text-primary);background-color:var(--tag-warning-color-background);color:var(--tag-warning-color-text)}.card-module_card__KEaH3{background-color:var(--color-background-secondary);border-radius:var(--spacing-8);color:var(--color-text-primary);display:block;padding:var(--spacing-24);width:100%}.card-module_card--raised__hBodH{box-shadow:0 2px 8px rgba(0,0,0,.12)}.card-module_card--flat__vLG1l{border:1px solid var(--color-background-secondary);box-shadow:none}.theme-toggle-module_theme-toggle__pBmqG{align-items:center;background-color:transparent;border:none;border:1px solid var(--color-background-secondary);border-radius:var(--spacing-4);color:var(--color-text-primary);cursor:pointer;display:inline-flex;font-family:var(--font-family-base);font-size:var(--font-size-200);font-weight:var(--font-weight-medium);gap:var(--spacing-8);justify-content:center;line-height:var(--font-line-height-none);padding:var(--spacing-8) var(--spacing-12)}.theme-toggle-module_theme-toggle__pBmqG:hover{background-color:var(--color-background-secondary)}.theme-toggle-module_theme-toggle--dark__9yf3H{border-color:var(--color-primary);color:var(--color-primary)}.theme-toggle-module_theme-toggle__icon__YJaUi{flex-shrink:0;height:1em;width:1em}.theme-toggle-module_theme-toggle__wrapper__Q0frz{display:inline-flex;position:relative}.theme-toggle-module_sr-only__OgD4W{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dezkareid/components",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.3",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "A package to export UI components in formats like React, Astro, Vue, etc.",
|
|
6
6
|
"files": [
|
|
@@ -73,6 +73,8 @@
|
|
|
73
73
|
},
|
|
74
74
|
"devDependencies": {
|
|
75
75
|
"astro": "6.0.6",
|
|
76
|
+
"@dezkareid/eslint-config-ts-base": "1.0.0",
|
|
77
|
+
"@eslint-react/eslint-plugin": "2.13.0",
|
|
76
78
|
"@eslint/js": "9.39.2",
|
|
77
79
|
"@rollup/plugin-commonjs": "29.0.0",
|
|
78
80
|
"@rollup/plugin-node-resolve": "16.0.3",
|
|
@@ -93,7 +95,6 @@
|
|
|
93
95
|
"typescript-eslint": "8.57.0",
|
|
94
96
|
"vite": "7.3.1",
|
|
95
97
|
"vitest": "4.0.18",
|
|
96
|
-
"@dezkareid/eslint-config-ts-base": "^0.0.0",
|
|
97
98
|
"@dezkareid/eslint-plugin-web": "^0.0.0"
|
|
98
99
|
},
|
|
99
100
|
"scripts": {
|
package/src/css/tag.module.css
CHANGED
|
@@ -24,24 +24,25 @@
|
|
|
24
24
|
color: var(--tag-default-color-text);
|
|
25
25
|
}
|
|
26
26
|
|
|
27
|
+
/* Success: text-primary gives 7.79:1 light (#22c55e) and 9.11:1 dark (#14532d) ✅ */
|
|
27
28
|
.tag--success {
|
|
28
29
|
--tag-success-color-background: var(--color-success);
|
|
29
|
-
--tag-success-color-text: var(--color-text-
|
|
30
|
+
--tag-success-color-text: var(--color-text-primary);
|
|
30
31
|
background-color: var(--tag-success-color-background);
|
|
31
32
|
color: var(--tag-success-color-text);
|
|
32
33
|
}
|
|
33
34
|
|
|
35
|
+
/* Danger: text-primary gives 4.71:1 light (#ef4444) and 10.02:1 dark (#7f1d1d) ✅ */
|
|
34
36
|
.tag--danger {
|
|
35
37
|
--tag-danger-color-background: var(--color-danger);
|
|
36
|
-
--tag-danger-color-text: var(--color-text-
|
|
38
|
+
--tag-danger-color-text: var(--color-text-primary);
|
|
37
39
|
background-color: var(--tag-danger-color-background);
|
|
38
40
|
color: var(--tag-danger-color-text);
|
|
39
41
|
}
|
|
40
42
|
|
|
41
|
-
/* TODO(design-system): needs token --color-warning (suggest amber-600 #d97706 for light, amber-900 #78350f for dark) */
|
|
42
43
|
.tag--warning {
|
|
43
|
-
--tag-warning-color-background:
|
|
44
|
-
--tag-warning-color-text: var(--color-text-
|
|
44
|
+
--tag-warning-color-background: var(--color-warning);
|
|
45
|
+
--tag-warning-color-text: var(--color-text-primary);
|
|
45
46
|
background-color: var(--tag-warning-color-background);
|
|
46
47
|
color: var(--tag-warning-color-text);
|
|
47
48
|
}
|