@asnewyla/radio 0.2.0 → 0.2.1
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/index.css +2 -0
- package/dist/index.css.map +1 -1
- package/dist/test-utils.d.mts +3 -0
- package/dist/test-utils.d.ts +3 -0
- package/dist/test-utils.js +12 -0
- package/dist/test-utils.js.map +1 -0
- package/dist/test-utils.mjs +10 -0
- package/dist/test-utils.mjs.map +1 -0
- package/package.json +18 -3
package/dist/index.css
CHANGED
package/dist/index.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Radio.css"],"sourcesContent":[".xd-radio {\n display: inline-flex;\n align-items: center;\n gap: var(--xd-space-sm, 0.375rem);\n flex-wrap: wrap;\n}\n\n.xd-radio-input {\n appearance: none;\n -webkit-appearance: none;\n margin: 0;\n flex-shrink: 0;\n width: 1rem;\n height: 1rem;\n position: relative;\n border-radius: 50%;\n border: var(--xd-border-width-thin, 1px) solid var(--xd-color-border, #cbd5e1);\n background-color: transparent;\n cursor: pointer;\n transition: border-color var(--xd-motion-fast, 120ms ease-out);\n}\n\n.xd-radio-input[data-checked=\"true\"] {\n border-color: var(--xd-color-primary, #0d9488);\n}\n\n.xd-radio-input[data-checked=\"true\"]::after {\n content: \"\";\n position: absolute;\n top: 50%;\n left: 50%;\n width: 0.5rem;\n height: 0.5rem;\n border-radius: 50%;\n background-color: var(--xd-color-primary, #0d9488);\n transform: translate(-50%, -50%);\n}\n\n.xd-radio-input:focus-visible {\n outline: var(--xd-focus-ring-width, 2px) solid\n var(--xd-color-focus, var(--xd-color-primary, #0d9488));\n outline-offset: var(--xd-focus-ring-offset, 2px);\n}\n\n.xd-radio-label {\n font-size: var(--xd-font-size-md, 0.875rem);\n cursor: pointer;\n}\n\n/* --- Invalid --- */\n\n.xd-radio-input[data-invalid=\"true\"] {\n border-color: var(--xd-color-destructive, #dc2626);\n}\n\n.xd-radio-input[data-invalid=\"true\"]:focus-visible {\n outline-color: var(--xd-color-destructive, #dc2626);\n}\n\n.xd-radio-error {\n flex-basis: 100%;\n font-size: var(--xd-font-size-sm, 0.8125rem);\n color: var(--xd-color-destructive, #dc2626);\n}\n\n/* --- Disabled --- */\n\n.xd-radio-input:disabled {\n opacity: var(--xd-opacity-disabled, 0.5);\n cursor: not-allowed;\n}\n\n.xd-radio-input:disabled + .xd-radio-label {\n opacity: var(--xd-opacity-disabled, 0.5);\n cursor: not-allowed;\n}\n"],"mappings":";AAAA,CAAC;AACC,WAAS;AACT,eAAa;AACb,OAAK,IAAI,aAAa,EAAE;AACxB,aAAW;AACb;AAEA,CAAC;AACC,cAAY;AACZ,sBAAoB;AACpB,UAAQ;AACR,eAAa;AACb,SAAO;AACP,UAAQ;AACR,YAAU;AACV,iBAAe;AACf,UAAQ,IAAI,sBAAsB,EAAE,KAAK,MAAM,IAAI,iBAAiB,EAAE;AACtE,oBAAkB;AAClB,UAAQ;AACR,cAAY,aAAa,IAAI,gBAAgB,EAAE,MAAM;AACvD;AAEA,CAfC,cAec,CAAC;AACd,gBAAc,IAAI,kBAAkB,EAAE;AACxC;AAEA,CAnBC,cAmBc,CAAC,kBAAoB;AAClC,WAAS;AACT,YAAU;AACV,OAAK;AACL,QAAM;AACN,SAAO;AACP,UAAQ;AACR,iBAAe;AACf,oBAAkB,IAAI,kBAAkB,EAAE;AAC1C,aAAW,UAAU,IAAI,EAAE;AAC7B;AAEA,CA/BC,cA+Bc;AACb,WAAS,IAAI,qBAAqB,EAAE,KAAK,MACvC,IAAI,gBAAgB,EAAE,IAAI,kBAAkB,EAAE;AAChD,kBAAgB,IAAI,sBAAsB,EAAE;AAC9C;AAEA,CAAC;AACC,aAAW,IAAI,iBAAiB,EAAE;AAClC,UAAQ;AACV;AAIA,
|
|
1
|
+
{"version":3,"sources":["../src/components/Radio.css"],"sourcesContent":[".xd-radio {\n display: inline-flex;\n align-items: center;\n gap: var(--xd-space-sm, 0.375rem);\n flex-wrap: wrap;\n}\n\n.xd-radio-input {\n appearance: none;\n -webkit-appearance: none;\n margin: 0;\n flex-shrink: 0;\n width: 1rem;\n height: 1rem;\n position: relative;\n border-radius: 50%;\n border: var(--xd-border-width-thin, 1px) solid var(--xd-color-border, #cbd5e1);\n background-color: transparent;\n cursor: pointer;\n transition: border-color var(--xd-motion-fast, 120ms ease-out);\n}\n\n.xd-radio-input[data-checked=\"true\"] {\n border-color: var(--xd-color-primary, #0d9488);\n}\n\n.xd-radio-input[data-checked=\"true\"]::after {\n content: \"\";\n position: absolute;\n top: 50%;\n left: 50%;\n width: 0.5rem;\n height: 0.5rem;\n border-radius: 50%;\n background-color: var(--xd-color-primary, #0d9488);\n transform: translate(-50%, -50%);\n}\n\n.xd-radio-input:focus-visible {\n outline: var(--xd-focus-ring-width, 2px) solid\n var(--xd-color-focus, var(--xd-color-primary, #0d9488));\n outline-offset: var(--xd-focus-ring-offset, 2px);\n}\n\n.xd-radio-label {\n font-size: var(--xd-font-size-md, 0.875rem);\n letter-spacing: var(--xd-letter-spacing-label, 0);\n text-transform: var(--xd-text-transform-label, none);\n cursor: pointer;\n}\n\n/* --- Invalid --- */\n\n.xd-radio-input[data-invalid=\"true\"] {\n border-color: var(--xd-color-destructive, #dc2626);\n}\n\n.xd-radio-input[data-invalid=\"true\"]:focus-visible {\n outline-color: var(--xd-color-destructive, #dc2626);\n}\n\n.xd-radio-error {\n flex-basis: 100%;\n font-size: var(--xd-font-size-sm, 0.8125rem);\n color: var(--xd-color-destructive, #dc2626);\n}\n\n/* --- Disabled --- */\n\n.xd-radio-input:disabled {\n opacity: var(--xd-opacity-disabled, 0.5);\n cursor: not-allowed;\n}\n\n.xd-radio-input:disabled + .xd-radio-label {\n opacity: var(--xd-opacity-disabled, 0.5);\n cursor: not-allowed;\n}\n"],"mappings":";AAAA,CAAC;AACC,WAAS;AACT,eAAa;AACb,OAAK,IAAI,aAAa,EAAE;AACxB,aAAW;AACb;AAEA,CAAC;AACC,cAAY;AACZ,sBAAoB;AACpB,UAAQ;AACR,eAAa;AACb,SAAO;AACP,UAAQ;AACR,YAAU;AACV,iBAAe;AACf,UAAQ,IAAI,sBAAsB,EAAE,KAAK,MAAM,IAAI,iBAAiB,EAAE;AACtE,oBAAkB;AAClB,UAAQ;AACR,cAAY,aAAa,IAAI,gBAAgB,EAAE,MAAM;AACvD;AAEA,CAfC,cAec,CAAC;AACd,gBAAc,IAAI,kBAAkB,EAAE;AACxC;AAEA,CAnBC,cAmBc,CAAC,kBAAoB;AAClC,WAAS;AACT,YAAU;AACV,OAAK;AACL,QAAM;AACN,SAAO;AACP,UAAQ;AACR,iBAAe;AACf,oBAAkB,IAAI,kBAAkB,EAAE;AAC1C,aAAW,UAAU,IAAI,EAAE;AAC7B;AAEA,CA/BC,cA+Bc;AACb,WAAS,IAAI,qBAAqB,EAAE,KAAK,MACvC,IAAI,gBAAgB,EAAE,IAAI,kBAAkB,EAAE;AAChD,kBAAgB,IAAI,sBAAsB,EAAE;AAC9C;AAEA,CAAC;AACC,aAAW,IAAI,iBAAiB,EAAE;AAClC,kBAAgB,IAAI,yBAAyB,EAAE;AAC/C,kBAAgB,IAAI,yBAAyB,EAAE;AAC/C,UAAQ;AACV;AAIA,CA9CC,cA8Cc,CAAC;AACd,gBAAc,IAAI,sBAAsB,EAAE;AAC5C;AAEA,CAlDC,cAkDc,CAAC,kBAAoB;AAClC,iBAAe,IAAI,sBAAsB,EAAE;AAC7C;AAEA,CAAC;AACC,cAAY;AACZ,aAAW,IAAI,iBAAiB,EAAE;AAClC,SAAO,IAAI,sBAAsB,EAAE;AACrC;AAIA,CA9DC,cA8Dc;AACb,WAAS,IAAI,qBAAqB,EAAE;AACpC,UAAQ;AACV;AAEA,CAnEC,cAmEc,UAAU,EAAE,CA9B1B;AA+BC,WAAS,IAAI,qBAAqB,EAAE;AACpC,UAAQ;AACV;","names":[]}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var react = require('@testing-library/react');
|
|
4
|
+
|
|
5
|
+
// src/test-utils.ts
|
|
6
|
+
function getRadio(name) {
|
|
7
|
+
return react.screen.getByRole("radio", name === void 0 ? void 0 : { name });
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
exports.getRadio = getRadio;
|
|
11
|
+
//# sourceMappingURL=test-utils.js.map
|
|
12
|
+
//# sourceMappingURL=test-utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/test-utils.ts"],"names":["screen"],"mappings":";;;;;AAEO,SAAS,SAAS,IAAA,EAAqC;AAC5D,EAAA,OAAOA,YAAA,CAAO,UAAU,OAAA,EAAS,IAAA,KAAS,SAAY,MAAA,GAAY,EAAE,MAAM,CAAA;AAC5E","file":"test-utils.js","sourcesContent":["import { screen } from '@testing-library/react';\n\nexport function getRadio(name?: string | RegExp): HTMLElement {\n return screen.getByRole('radio', name === undefined ? undefined : { name });\n}\n"]}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { screen } from '@testing-library/react';
|
|
2
|
+
|
|
3
|
+
// src/test-utils.ts
|
|
4
|
+
function getRadio(name) {
|
|
5
|
+
return screen.getByRole("radio", name === void 0 ? void 0 : { name });
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
export { getRadio };
|
|
9
|
+
//# sourceMappingURL=test-utils.mjs.map
|
|
10
|
+
//# sourceMappingURL=test-utils.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/test-utils.ts"],"names":[],"mappings":";;;AAEO,SAAS,SAAS,IAAA,EAAqC;AAC5D,EAAA,OAAO,MAAA,CAAO,UAAU,OAAA,EAAS,IAAA,KAAS,SAAY,MAAA,GAAY,EAAE,MAAM,CAAA;AAC5E","file":"test-utils.mjs","sourcesContent":["import { screen } from '@testing-library/react';\n\nexport function getRadio(name?: string | RegExp): HTMLElement {\n return screen.getByRole('radio', name === undefined ? undefined : { name });\n}\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@asnewyla/radio",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.1",
|
|
4
4
|
"description": "Styled radio with label, validation error display, and accessibility",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
@@ -20,7 +20,12 @@
|
|
|
20
20
|
"import": "./dist/index.mjs",
|
|
21
21
|
"require": "./dist/index.js"
|
|
22
22
|
},
|
|
23
|
-
"./styles.css": "./dist/index.css"
|
|
23
|
+
"./styles.css": "./dist/index.css",
|
|
24
|
+
"./test-utils": {
|
|
25
|
+
"types": "./dist/test-utils.d.ts",
|
|
26
|
+
"import": "./dist/test-utils.mjs",
|
|
27
|
+
"require": "./dist/test-utils.js"
|
|
28
|
+
}
|
|
24
29
|
},
|
|
25
30
|
"files": [
|
|
26
31
|
"dist"
|
|
@@ -37,7 +42,17 @@
|
|
|
37
42
|
],
|
|
38
43
|
"peerDependencies": {
|
|
39
44
|
"react": "^18.0.0 || ^19.0.0",
|
|
40
|
-
"react-dom": "^18.0.0 || ^19.0.0"
|
|
45
|
+
"react-dom": "^18.0.0 || ^19.0.0",
|
|
46
|
+
"@testing-library/react": "^16.0.0",
|
|
47
|
+
"@testing-library/user-event": "^14.5.0"
|
|
48
|
+
},
|
|
49
|
+
"peerDependenciesMeta": {
|
|
50
|
+
"@testing-library/react": {
|
|
51
|
+
"optional": true
|
|
52
|
+
},
|
|
53
|
+
"@testing-library/user-event": {
|
|
54
|
+
"optional": true
|
|
55
|
+
}
|
|
41
56
|
},
|
|
42
57
|
"dependencies": {
|
|
43
58
|
"@asnewyla/unstyled-radio": "0.2.0"
|