@pie-players/pie-tool-calculator-inline-desmos 0.3.52 → 0.3.53
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/README.md +10 -2
- package/dist/tool-calculator-inline.js +2 -2
- package/package.json +4 -3
package/README.md
CHANGED
|
@@ -157,10 +157,18 @@ The component uses CSS custom properties for theming:
|
|
|
157
157
|
--pie-background: Background color (default: white)
|
|
158
158
|
--pie-text: Text color (default: #333)
|
|
159
159
|
--pie-secondary-background: Hover background (default: #f5f5f5)
|
|
160
|
-
--pie-
|
|
161
|
-
--pie-
|
|
160
|
+
--pie-tool-trigger-active-background: Active/open button background
|
|
161
|
+
--pie-tool-trigger-active-color: Active/open button foreground
|
|
162
|
+
--pie-tool-trigger-active-border-color: Active/open button border
|
|
162
163
|
```
|
|
163
164
|
|
|
165
|
+
Hosts should prefer the `--pie-tool-trigger-active-*` variables when styling the
|
|
166
|
+
calculator button's active/open state instead of overriding broad semantic tokens
|
|
167
|
+
such as `--pie-primary`. If these variables are unset, the button preserves the
|
|
168
|
+
existing filled active look using `--pie-primary` and `--pie-primary-dark`
|
|
169
|
+
fallbacks. Hosts remain responsible for maintaining WCAG AA
|
|
170
|
+
foreground/background contrast when overriding active trigger colors.
|
|
171
|
+
|
|
164
172
|
## Development
|
|
165
173
|
|
|
166
174
|
```bash
|
|
@@ -2220,10 +2220,10 @@ var Oi = /* @__PURE__ */ li('<div class="pie-tool-calculator-inline svelte-qq14o
|
|
|
2220
2220
|
transform 0.1s ease,
|
|
2221
2221
|
box-shadow 0.15s ease;padding:0.25rem;position:relative;}.pie-tool-calculator-inline__button.svelte-qq14od:hover:not(:disabled) {background-color:var(--pie-secondary-background, #f5f5f5);transform:translateY(-1px);box-shadow:0 2px 4px rgba(0, 0, 0, 0.1);}.pie-tool-calculator-inline__button.svelte-qq14od:active:not(:disabled) {transform:translateY(0);box-shadow:none;}
|
|
2222
2222
|
|
|
2223
|
-
/* Focus indicator - WCAG 2.4.7, 2.4.13 */.pie-tool-calculator-inline__button.svelte-qq14od:focus-visible {outline:2px solid #0066cc;outline-offset:2px;box-shadow:0 0 0 4px rgba(0, 102, 204, 0.2);z-index:1;}.pie-tool-calculator-inline__button--active.svelte-qq14od {background-color:var(--pie-primary, #1976d2);color:white;border-color:var(--pie-primary, #1976d2);}.pie-tool-calculator-inline__button--active.svelte-qq14od:hover:not(:disabled) {background-color:var(--pie-primary-dark, #1565c0);}.pie-tool-calculator-inline__button.svelte-qq14od:disabled {cursor:not-allowed;opacity:0.6;}
|
|
2223
|
+
/* Focus indicator - WCAG 2.4.7, 2.4.13 */.pie-tool-calculator-inline__button.svelte-qq14od:focus-visible {outline:2px solid #0066cc;outline-offset:2px;box-shadow:0 0 0 4px rgba(0, 102, 204, 0.2);z-index:1;}.pie-tool-calculator-inline__button--active.svelte-qq14od {background-color:var(--pie-tool-trigger-active-background, var(--pie-primary, #1976d2));color:var(--pie-tool-trigger-active-color, white);border-color:var(--pie-tool-trigger-active-border-color, var(--pie-primary, #1976d2));}.pie-tool-calculator-inline__button--active.svelte-qq14od:hover:not(:disabled) {background-color:var(--pie-tool-trigger-active-background, var(--pie-primary-dark, #1565c0));color:var(--pie-tool-trigger-active-color, white);border-color:var(--pie-tool-trigger-active-border-color, var(--pie-primary, #1976d2));}.pie-tool-calculator-inline__button.svelte-qq14od:disabled {cursor:not-allowed;opacity:0.6;}
|
|
2224
2224
|
|
|
2225
2225
|
/* Size variants */.pie-tool-calculator-inline__button--sm.svelte-qq14od {width:1.5rem;height:1.5rem;
|
|
2226
|
-
/* Increase padding to meet 44px touch target - WCAG 2.5.2 */padding:0.625rem;}.pie-tool-calculator-inline__button--sm.svelte-qq14od .pie-tool-calculator-inline__icon:where(.svelte-qq14od) {width:1rem;height:1rem;}.pie-tool-calculator-inline__button--md.svelte-qq14od {width:2rem;height:2rem;}.pie-tool-calculator-inline__button--md.svelte-qq14od .pie-tool-calculator-inline__icon:where(.svelte-qq14od) {width:1.25rem;height:1.25rem;}.pie-tool-calculator-inline__button--lg.svelte-qq14od {width:2.5rem;height:2.5rem;}.pie-tool-calculator-inline__button--lg.svelte-qq14od .pie-tool-calculator-inline__icon:where(.svelte-qq14od) {width:1.5rem;height:1.5rem;}.pie-tool-calculator-inline__icon.svelte-qq14od {fill:currentColor;color:#555;}.pie-tool-calculator-inline__button.svelte-qq14od:hover:not(:disabled) .pie-tool-calculator-inline__icon:where(.svelte-qq14od) {color:#667eea;}.pie-tool-calculator-inline__button--active.svelte-qq14od .pie-tool-calculator-inline__icon:where(.svelte-qq14od) {color:
|
|
2226
|
+
/* Increase padding to meet 44px touch target - WCAG 2.5.2 */padding:0.625rem;}.pie-tool-calculator-inline__button--sm.svelte-qq14od .pie-tool-calculator-inline__icon:where(.svelte-qq14od) {width:1rem;height:1rem;}.pie-tool-calculator-inline__button--md.svelte-qq14od {width:2rem;height:2rem;}.pie-tool-calculator-inline__button--md.svelte-qq14od .pie-tool-calculator-inline__icon:where(.svelte-qq14od) {width:1.25rem;height:1.25rem;}.pie-tool-calculator-inline__button--lg.svelte-qq14od {width:2.5rem;height:2.5rem;}.pie-tool-calculator-inline__button--lg.svelte-qq14od .pie-tool-calculator-inline__icon:where(.svelte-qq14od) {width:1.5rem;height:1.5rem;}.pie-tool-calculator-inline__icon.svelte-qq14od {fill:currentColor;color:#555;}.pie-tool-calculator-inline__button.svelte-qq14od:not(.pie-tool-calculator-inline__button--active):hover:not(:disabled) .pie-tool-calculator-inline__icon:where(.svelte-qq14od) {color:#667eea;}.pie-tool-calculator-inline__button--active.svelte-qq14od .pie-tool-calculator-inline__icon:where(.svelte-qq14od) {color:var(--pie-tool-trigger-active-color, inherit);}
|
|
2227
2227
|
|
|
2228
2228
|
/* Screen reader only content */.pie-sr-only.svelte-qq14od {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;}
|
|
2229
2229
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pie-players/pie-tool-calculator-inline-desmos",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.53",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "Inline calculator toggle button for PIE assessment player question headers",
|
|
6
6
|
"repository": {
|
|
@@ -35,12 +35,13 @@
|
|
|
35
35
|
"unpkg": "./dist/tool-calculator-inline.js",
|
|
36
36
|
"jsdelivr": "./dist/tool-calculator-inline.js",
|
|
37
37
|
"dependencies": {
|
|
38
|
-
"@pie-players/pie-assessment-toolkit": "0.3.
|
|
39
|
-
"@pie-players/pie-context": "0.3.
|
|
38
|
+
"@pie-players/pie-assessment-toolkit": "0.3.53",
|
|
39
|
+
"@pie-players/pie-context": "0.3.53"
|
|
40
40
|
},
|
|
41
41
|
"scripts": {
|
|
42
42
|
"build": "vite build",
|
|
43
43
|
"dev": "vite build --watch",
|
|
44
|
+
"test": "bun test tests",
|
|
44
45
|
"typecheck": "tsc --noEmit",
|
|
45
46
|
"lint": "biome check ."
|
|
46
47
|
},
|