@asnewyla/unstyled-switch 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.js +35 -10
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +6 -5
- package/dist/index.mjs.map +1 -1
- package/dist/test-utils.js +30 -7
- package/dist/test-utils.js.map +1 -1
- package/dist/test-utils.mjs +5 -4
- package/dist/test-utils.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1,9 +1,33 @@
|
|
|
1
|
-
'use
|
|
1
|
+
'use client';
|
|
2
|
+
"use strict";
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
2
20
|
|
|
3
|
-
|
|
4
|
-
var
|
|
21
|
+
// src/index.ts
|
|
22
|
+
var index_exports = {};
|
|
23
|
+
__export(index_exports, {
|
|
24
|
+
UnstyledSwitch: () => UnstyledSwitch
|
|
25
|
+
});
|
|
26
|
+
module.exports = __toCommonJS(index_exports);
|
|
5
27
|
|
|
6
28
|
// src/components/UnstyledSwitch.tsx
|
|
29
|
+
var import_react = require("react");
|
|
30
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
7
31
|
function booleanToString(value) {
|
|
8
32
|
return value ? "true" : void 0;
|
|
9
33
|
}
|
|
@@ -18,11 +42,11 @@ function UnstyledSwitchInner({
|
|
|
18
42
|
...rest
|
|
19
43
|
}, ref) {
|
|
20
44
|
const isControlled = checked !== void 0;
|
|
21
|
-
const [internalChecked, setInternalChecked] =
|
|
45
|
+
const [internalChecked, setInternalChecked] = (0, import_react.useState)(
|
|
22
46
|
defaultChecked ?? false
|
|
23
47
|
);
|
|
24
48
|
const isChecked = isControlled ? checked : internalChecked;
|
|
25
|
-
const [focused, setFocused] =
|
|
49
|
+
const [focused, setFocused] = (0, import_react.useState)(false);
|
|
26
50
|
const handleChange = (e) => {
|
|
27
51
|
if (!isControlled) {
|
|
28
52
|
setInternalChecked(e.target.checked);
|
|
@@ -37,7 +61,7 @@ function UnstyledSwitchInner({
|
|
|
37
61
|
setFocused(false);
|
|
38
62
|
onBlur?.(e);
|
|
39
63
|
};
|
|
40
|
-
return /* @__PURE__ */
|
|
64
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
41
65
|
"input",
|
|
42
66
|
{
|
|
43
67
|
ref,
|
|
@@ -58,10 +82,11 @@ function UnstyledSwitchInner({
|
|
|
58
82
|
}
|
|
59
83
|
);
|
|
60
84
|
}
|
|
61
|
-
var UnstyledSwitch =
|
|
85
|
+
var UnstyledSwitch = (0, import_react.forwardRef)(
|
|
62
86
|
UnstyledSwitchInner
|
|
63
87
|
);
|
|
64
|
-
|
|
65
|
-
exports
|
|
66
|
-
|
|
88
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
89
|
+
0 && (module.exports = {
|
|
90
|
+
UnstyledSwitch
|
|
91
|
+
});
|
|
67
92
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/UnstyledSwitch.tsx"],"
|
|
1
|
+
{"version":3,"sources":["../src/index.ts","../src/components/UnstyledSwitch.tsx"],"sourcesContent":["export type { UnstyledSwitchProps } from './components';\nexport { UnstyledSwitch } from './components';\n","import { type ForwardedRef, forwardRef, useState } from 'react';\n\nexport type UnstyledSwitchProps = {\n checked?: boolean;\n defaultChecked?: boolean;\n onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;\n disabled?: boolean;\n invalid?: boolean;\n} & Omit<\n React.InputHTMLAttributes<HTMLInputElement>,\n | 'type'\n | 'role'\n | 'checked'\n | 'defaultChecked'\n | 'onChange'\n | 'disabled'\n | 'invalid'\n>;\n\nfunction booleanToString(value: boolean | undefined): string | undefined {\n return value ? 'true' : undefined;\n}\n\nfunction UnstyledSwitchInner(\n {\n checked,\n defaultChecked,\n onChange,\n disabled,\n invalid,\n onFocus,\n onBlur,\n ...rest\n }: UnstyledSwitchProps,\n ref: ForwardedRef<HTMLInputElement>,\n) {\n const isControlled = checked !== undefined;\n const [internalChecked, setInternalChecked] = useState(\n defaultChecked ?? false,\n );\n const isChecked = isControlled ? checked : internalChecked;\n\n const [focused, setFocused] = useState(false);\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n if (!isControlled) {\n setInternalChecked(e.target.checked);\n }\n onChange?.(e);\n };\n\n const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n setFocused(true);\n onFocus?.(e);\n };\n\n const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n setFocused(false);\n onBlur?.(e);\n };\n\n return (\n <input\n ref={ref}\n {...rest}\n type=\"checkbox\"\n role=\"switch\"\n checked={isChecked}\n onChange={handleChange}\n data-checked={booleanToString(isChecked)}\n aria-checked={isChecked ? 'true' : 'false'}\n onFocus={handleFocus}\n onBlur={handleBlur}\n data-focused={booleanToString(focused)}\n disabled={disabled}\n data-disabled={booleanToString(disabled)}\n data-invalid={booleanToString(invalid)}\n aria-invalid={invalid ? 'true' : undefined}\n />\n );\n}\n\nexport const UnstyledSwitch = forwardRef<HTMLInputElement, UnstyledSwitchProps>(\n UnstyledSwitchInner,\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAAwD;AA8DpD;AA3CJ,SAAS,gBAAgB,OAAgD;AACvE,SAAO,QAAQ,SAAS;AAC1B;AAEA,SAAS,oBACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GACA,KACA;AACA,QAAM,eAAe,YAAY;AACjC,QAAM,CAAC,iBAAiB,kBAAkB,QAAI;AAAA,IAC5C,kBAAkB;AAAA,EACpB;AACA,QAAM,YAAY,eAAe,UAAU;AAE3C,QAAM,CAAC,SAAS,UAAU,QAAI,uBAAS,KAAK;AAE5C,QAAM,eAAe,CAAC,MAA2C;AAC/D,QAAI,CAAC,cAAc;AACjB,yBAAmB,EAAE,OAAO,OAAO;AAAA,IACrC;AACA,eAAW,CAAC;AAAA,EACd;AAEA,QAAM,cAAc,CAAC,MAA0C;AAC7D,eAAW,IAAI;AACf,cAAU,CAAC;AAAA,EACb;AAEA,QAAM,aAAa,CAAC,MAA0C;AAC5D,eAAW,KAAK;AAChB,aAAS,CAAC;AAAA,EACZ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACC,GAAG;AAAA,MACJ,MAAK;AAAA,MACL,MAAK;AAAA,MACL,SAAS;AAAA,MACT,UAAU;AAAA,MACV,gBAAc,gBAAgB,SAAS;AAAA,MACvC,gBAAc,YAAY,SAAS;AAAA,MACnC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,gBAAc,gBAAgB,OAAO;AAAA,MACrC;AAAA,MACA,iBAAe,gBAAgB,QAAQ;AAAA,MACvC,gBAAc,gBAAgB,OAAO;AAAA,MACrC,gBAAc,UAAU,SAAS;AAAA;AAAA,EACnC;AAEJ;AAEO,IAAM,qBAAiB;AAAA,EAC5B;AACF;","names":[]}
|
package/dist/index.mjs
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
import { jsx } from 'react/jsx-runtime';
|
|
1
|
+
'use client';
|
|
3
2
|
|
|
4
3
|
// src/components/UnstyledSwitch.tsx
|
|
4
|
+
import { forwardRef, useState } from "react";
|
|
5
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
6
|
function booleanToString(value) {
|
|
6
7
|
return value ? "true" : void 0;
|
|
7
8
|
}
|
|
@@ -59,7 +60,7 @@ function UnstyledSwitchInner({
|
|
|
59
60
|
var UnstyledSwitch = forwardRef(
|
|
60
61
|
UnstyledSwitchInner
|
|
61
62
|
);
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
63
|
+
export {
|
|
64
|
+
UnstyledSwitch
|
|
65
|
+
};
|
|
65
66
|
//# sourceMappingURL=index.mjs.map
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/UnstyledSwitch.tsx"],"
|
|
1
|
+
{"version":3,"sources":["../src/components/UnstyledSwitch.tsx"],"sourcesContent":["import { type ForwardedRef, forwardRef, useState } from 'react';\n\nexport type UnstyledSwitchProps = {\n checked?: boolean;\n defaultChecked?: boolean;\n onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;\n disabled?: boolean;\n invalid?: boolean;\n} & Omit<\n React.InputHTMLAttributes<HTMLInputElement>,\n | 'type'\n | 'role'\n | 'checked'\n | 'defaultChecked'\n | 'onChange'\n | 'disabled'\n | 'invalid'\n>;\n\nfunction booleanToString(value: boolean | undefined): string | undefined {\n return value ? 'true' : undefined;\n}\n\nfunction UnstyledSwitchInner(\n {\n checked,\n defaultChecked,\n onChange,\n disabled,\n invalid,\n onFocus,\n onBlur,\n ...rest\n }: UnstyledSwitchProps,\n ref: ForwardedRef<HTMLInputElement>,\n) {\n const isControlled = checked !== undefined;\n const [internalChecked, setInternalChecked] = useState(\n defaultChecked ?? false,\n );\n const isChecked = isControlled ? checked : internalChecked;\n\n const [focused, setFocused] = useState(false);\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n if (!isControlled) {\n setInternalChecked(e.target.checked);\n }\n onChange?.(e);\n };\n\n const handleFocus = (e: React.FocusEvent<HTMLInputElement>) => {\n setFocused(true);\n onFocus?.(e);\n };\n\n const handleBlur = (e: React.FocusEvent<HTMLInputElement>) => {\n setFocused(false);\n onBlur?.(e);\n };\n\n return (\n <input\n ref={ref}\n {...rest}\n type=\"checkbox\"\n role=\"switch\"\n checked={isChecked}\n onChange={handleChange}\n data-checked={booleanToString(isChecked)}\n aria-checked={isChecked ? 'true' : 'false'}\n onFocus={handleFocus}\n onBlur={handleBlur}\n data-focused={booleanToString(focused)}\n disabled={disabled}\n data-disabled={booleanToString(disabled)}\n data-invalid={booleanToString(invalid)}\n aria-invalid={invalid ? 'true' : undefined}\n />\n );\n}\n\nexport const UnstyledSwitch = forwardRef<HTMLInputElement, UnstyledSwitchProps>(\n UnstyledSwitchInner,\n);\n"],"mappings":";;;AAAA,SAA4B,YAAY,gBAAgB;AA8DpD;AA3CJ,SAAS,gBAAgB,OAAgD;AACvE,SAAO,QAAQ,SAAS;AAC1B;AAEA,SAAS,oBACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GACA,KACA;AACA,QAAM,eAAe,YAAY;AACjC,QAAM,CAAC,iBAAiB,kBAAkB,IAAI;AAAA,IAC5C,kBAAkB;AAAA,EACpB;AACA,QAAM,YAAY,eAAe,UAAU;AAE3C,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAE5C,QAAM,eAAe,CAAC,MAA2C;AAC/D,QAAI,CAAC,cAAc;AACjB,yBAAmB,EAAE,OAAO,OAAO;AAAA,IACrC;AACA,eAAW,CAAC;AAAA,EACd;AAEA,QAAM,cAAc,CAAC,MAA0C;AAC7D,eAAW,IAAI;AACf,cAAU,CAAC;AAAA,EACb;AAEA,QAAM,aAAa,CAAC,MAA0C;AAC5D,eAAW,KAAK;AAChB,aAAS,CAAC;AAAA,EACZ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACC,GAAG;AAAA,MACJ,MAAK;AAAA,MACL,MAAK;AAAA,MACL,SAAS;AAAA,MACT,UAAU;AAAA,MACV,gBAAc,gBAAgB,SAAS;AAAA,MACvC,gBAAc,YAAY,SAAS;AAAA,MACnC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,gBAAc,gBAAgB,OAAO;AAAA,MACrC;AAAA,MACA,iBAAe,gBAAgB,QAAQ;AAAA,MACvC,gBAAc,gBAAgB,OAAO;AAAA,MACrC,gBAAc,UAAU,SAAS;AAAA;AAAA,EACnC;AAEJ;AAEO,IAAM,iBAAiB;AAAA,EAC5B;AACF;","names":[]}
|
package/dist/test-utils.js
CHANGED
|
@@ -1,12 +1,35 @@
|
|
|
1
|
-
'use
|
|
2
|
-
|
|
3
|
-
var
|
|
1
|
+
'use client';
|
|
2
|
+
"use strict";
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
4
20
|
|
|
5
21
|
// src/test-utils.ts
|
|
22
|
+
var test_utils_exports = {};
|
|
23
|
+
__export(test_utils_exports, {
|
|
24
|
+
getSwitch: () => getSwitch
|
|
25
|
+
});
|
|
26
|
+
module.exports = __toCommonJS(test_utils_exports);
|
|
27
|
+
var import_react = require("@testing-library/react");
|
|
6
28
|
function getSwitch(name) {
|
|
7
|
-
return
|
|
29
|
+
return import_react.screen.getByRole("switch", name === void 0 ? void 0 : { name });
|
|
8
30
|
}
|
|
9
|
-
|
|
10
|
-
exports
|
|
11
|
-
|
|
31
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
32
|
+
0 && (module.exports = {
|
|
33
|
+
getSwitch
|
|
34
|
+
});
|
|
12
35
|
//# sourceMappingURL=test-utils.js.map
|
package/dist/test-utils.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/test-utils.ts"],"
|
|
1
|
+
{"version":3,"sources":["../src/test-utils.ts"],"sourcesContent":["import { screen } from '@testing-library/react';\n\nexport function getSwitch(name?: string | RegExp): HTMLElement {\n return screen.getByRole('switch', name === undefined ? undefined : { name });\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAuB;AAEhB,SAAS,UAAU,MAAqC;AAC7D,SAAO,oBAAO,UAAU,UAAU,SAAS,SAAY,SAAY,EAAE,KAAK,CAAC;AAC7E;","names":[]}
|
package/dist/test-utils.mjs
CHANGED
|
@@ -1,10 +1,11 @@
|
|
|
1
|
-
|
|
1
|
+
'use client';
|
|
2
2
|
|
|
3
3
|
// src/test-utils.ts
|
|
4
|
+
import { screen } from "@testing-library/react";
|
|
4
5
|
function getSwitch(name) {
|
|
5
6
|
return screen.getByRole("switch", name === void 0 ? void 0 : { name });
|
|
6
7
|
}
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
8
|
+
export {
|
|
9
|
+
getSwitch
|
|
10
|
+
};
|
|
10
11
|
//# sourceMappingURL=test-utils.mjs.map
|
package/dist/test-utils.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/test-utils.ts"],"
|
|
1
|
+
{"version":3,"sources":["../src/test-utils.ts"],"sourcesContent":["import { screen } from '@testing-library/react';\n\nexport function getSwitch(name?: string | RegExp): HTMLElement {\n return screen.getByRole('switch', name === undefined ? undefined : { name });\n}\n"],"mappings":";;;AAAA,SAAS,cAAc;AAEhB,SAAS,UAAU,MAAqC;AAC7D,SAAO,OAAO,UAAU,UAAU,SAAS,SAAY,SAAY,EAAE,KAAK,CAAC;AAC7E;","names":[]}
|