@rvx/ui 0.4.1 → 0.4.2
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/radio-buttons.js +2 -2
- package/dist/components/radio-buttons.js.map +1 -1
- package/package.json +1 -1
- package/src/components/radio-buttons.tsx +4 -4
- package/theme/components/checkbox.module.css +1 -1
- package/theme/components/dialog.module.css +2 -2
- package/theme/components/radio-buttons.module.css +6 -6
|
@@ -18,12 +18,12 @@ export function RadioButtons(props) {
|
|
|
18
18
|
props.class,
|
|
19
19
|
], style: props.style, "aria-readonly": string(!(props.options instanceof Signal)), "aria-invalid": validator ? optionalString(validator.invalid) : undefined, "aria-errormessage": validator ? validator.messageIds : undefined, "aria-label": props["aria-label"], "aria-labelledby": props["aria-labelledby"], children: _jsx(For, { each: props.options, children: (option, index) => {
|
|
20
20
|
const id = uniqueId();
|
|
21
|
-
const input = _jsx("input", { id: id, type: "radio", class: styles.
|
|
21
|
+
const input = _jsx("input", { id: id, type: "radio", class: styles.input, name: group, value: id, disabled: disabled, autofocus: () => get(props.autofocus) && index() === 0, "prop:checked": map(props.value, x => x === option.value), "on:input": () => {
|
|
22
22
|
if (props.value instanceof Signal) {
|
|
23
23
|
props.value.value = option.value;
|
|
24
24
|
}
|
|
25
25
|
} });
|
|
26
|
-
return _jsxs("label", { for: id, class: styles.
|
|
26
|
+
return _jsxs("label", { for: id, class: styles.label, children: [_jsx("div", { class: styles.padding, children: input }), _jsx(Text, { class: styles.content, children: option.label })] });
|
|
27
27
|
} }) });
|
|
28
28
|
}
|
|
29
29
|
//# sourceMappingURL=radio-buttons.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"radio-buttons.js","sourceRoot":"","sources":["../../src/components/radio-buttons.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mDAAmD,CAAC;AACvE,OAAO,EAA0B,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,EAAc,QAAQ,EAAE,MAAM,KAAK,CAAC;AAC1F,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAOnD,MAAM,UAAU,YAAY,CAAI,KAc/B;IACA,MAAM,EAAE,GAAG,KAAK,CAAC,EAAE,IAAI,OAAO,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;IACjD,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IAEzB,MAAM,QAAQ,GAAG,KAAK,CAAC,KAAK,YAAY,MAAM;QAC7C,CAAC,CAAC,GAAG,EAAE,CAAC,SAAS,EAAE,IAAI,GAAG,CAAC,KAAK,CAAC,QAAQ,CAAC;QAC1C,CAAC,CAAC,IAAI,CAAC;IAER,MAAM,SAAS,GAAG,KAAK,CAAC,KAAK,YAAY,MAAM,CAAC,CAAC,CAAC,gBAAgB,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAE5F,OAAO,cACN,IAAI,EAAC,YAAY,EACjB,EAAE,EAAE,KAAK,CAAC,EAAE,EACZ,KAAK,EAAE;YACN,MAAM,CAAC,aAAa;YACpB,KAAK,CAAC,KAAK;SACX,EACD,KAAK,EAAE,KAAK,CAAC,KAAK,mBACH,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,YAAY,MAAM,CAAC,CAAC,kBAC3C,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,SAAS,uBACpD,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,gBACnD,KAAK,CAAC,YAAY,CAAC,qBACd,KAAK,CAAC,iBAAiB,CAAC,YAEzC,KAAC,GAAG,IAAC,IAAI,EAAE,KAAK,CAAC,OAAO,YACtB,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;gBAClB,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAC;gBACtB,MAAM,KAAK,GAAG,gBACb,EAAE,EAAE,EAAE,EACN,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,MAAM,CAAC,
|
|
1
|
+
{"version":3,"file":"radio-buttons.js","sourceRoot":"","sources":["../../src/components/radio-buttons.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mDAAmD,CAAC;AACvE,OAAO,EAA0B,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,EAAc,QAAQ,EAAE,MAAM,KAAK,CAAC;AAC1F,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AACtC,OAAO,EAAE,cAAc,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AACjC,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAOnD,MAAM,UAAU,YAAY,CAAI,KAc/B;IACA,MAAM,EAAE,GAAG,KAAK,CAAC,EAAE,IAAI,OAAO,CAAC,OAAO,CAAC,OAAO,EAAE,CAAC;IACjD,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAC;IAEzB,MAAM,QAAQ,GAAG,KAAK,CAAC,KAAK,YAAY,MAAM;QAC7C,CAAC,CAAC,GAAG,EAAE,CAAC,SAAS,EAAE,IAAI,GAAG,CAAC,KAAK,CAAC,QAAQ,CAAC;QAC1C,CAAC,CAAC,IAAI,CAAC;IAER,MAAM,SAAS,GAAG,KAAK,CAAC,KAAK,YAAY,MAAM,CAAC,CAAC,CAAC,gBAAgB,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAE5F,OAAO,cACN,IAAI,EAAC,YAAY,EACjB,EAAE,EAAE,KAAK,CAAC,EAAE,EACZ,KAAK,EAAE;YACN,MAAM,CAAC,aAAa;YACpB,KAAK,CAAC,KAAK;SACX,EACD,KAAK,EAAE,KAAK,CAAC,KAAK,mBACH,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,YAAY,MAAM,CAAC,CAAC,kBAC3C,SAAS,CAAC,CAAC,CAAC,cAAc,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,SAAS,uBACpD,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,gBACnD,KAAK,CAAC,YAAY,CAAC,qBACd,KAAK,CAAC,iBAAiB,CAAC,YAEzC,KAAC,GAAG,IAAC,IAAI,EAAE,KAAK,CAAC,OAAO,YACtB,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;gBAClB,MAAM,EAAE,GAAG,QAAQ,EAAE,CAAC;gBACtB,MAAM,KAAK,GAAG,gBACb,EAAE,EAAE,EAAE,EACN,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,MAAM,CAAC,KAAK,EACnB,IAAI,EAAE,KAAK,EACX,KAAK,EAAE,EAAE,EACT,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,GAAG,EAAE,CAAC,GAAG,CAAC,KAAK,CAAC,SAAS,CAAC,IAAI,KAAK,EAAE,KAAK,CAAC,kBACxC,GAAG,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,MAAM,CAAC,KAAK,CAAC,cAC7C,GAAG,EAAE;wBACd,IAAI,KAAK,CAAC,KAAK,YAAY,MAAM,EAAE,CAAC;4BACnC,KAAK,CAAC,KAAK,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC;wBAClC,CAAC;oBACF,CAAC,GACA,CAAC;gBAEH,OAAO,iBACN,GAAG,EAAE,EAAE,EACP,KAAK,EAAE,MAAM,CAAC,KAAK,aAEnB,cAAK,KAAK,EAAE,MAAM,CAAC,OAAO,YAAG,KAAK,GAAO,EACzC,KAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,OAAO,YACzB,MAAM,CAAC,KAAK,GACP,IACA,CAAC;YACV,CAAC,GACI,GACD,CAAC;AACR,CAAC"}
|
package/package.json
CHANGED
|
@@ -55,7 +55,7 @@ export function RadioButtons<T>(props: {
|
|
|
55
55
|
const input = <input
|
|
56
56
|
id={id}
|
|
57
57
|
type="radio"
|
|
58
|
-
class={styles.
|
|
58
|
+
class={styles.input}
|
|
59
59
|
name={group}
|
|
60
60
|
value={id}
|
|
61
61
|
disabled={disabled}
|
|
@@ -70,10 +70,10 @@ export function RadioButtons<T>(props: {
|
|
|
70
70
|
|
|
71
71
|
return <label
|
|
72
72
|
for={id}
|
|
73
|
-
class={styles.
|
|
73
|
+
class={styles.label}
|
|
74
74
|
>
|
|
75
|
-
<div class={styles.
|
|
76
|
-
<Text class={styles.
|
|
75
|
+
<div class={styles.padding}>{input}</div>
|
|
76
|
+
<Text class={styles.content}>
|
|
77
77
|
{option.label}
|
|
78
78
|
</Text>
|
|
79
79
|
</label>;
|
|
@@ -4,32 +4,32 @@
|
|
|
4
4
|
flex-direction: column;
|
|
5
5
|
row-gap: var(--control-row-gap);
|
|
6
6
|
|
|
7
|
-
&:has(.
|
|
7
|
+
&:has(.input:focus-visible) {
|
|
8
8
|
outline: var(--focus-outline);
|
|
9
9
|
outline-offset: var(--focus-outline-offset);
|
|
10
10
|
}
|
|
11
11
|
}
|
|
12
12
|
|
|
13
|
-
.
|
|
13
|
+
.label {
|
|
14
14
|
display: flex;
|
|
15
15
|
column-gap: var(--control-column-gap);
|
|
16
16
|
align-items: start;
|
|
17
17
|
|
|
18
|
-
&:has(.
|
|
18
|
+
&:has(.input:not(:disabled)) {
|
|
19
19
|
cursor: pointer;
|
|
20
20
|
}
|
|
21
21
|
|
|
22
|
-
&:has(.
|
|
22
|
+
&:has(.input:disabled) > .content {
|
|
23
23
|
filter: var(--control-disabled);
|
|
24
24
|
}
|
|
25
25
|
}
|
|
26
26
|
|
|
27
|
-
.
|
|
27
|
+
.padding {
|
|
28
28
|
padding: var(--input-extension);
|
|
29
29
|
margin: calc(var(--input-extension) * -1);
|
|
30
30
|
}
|
|
31
31
|
|
|
32
|
-
.
|
|
32
|
+
.input {
|
|
33
33
|
margin: 0;
|
|
34
34
|
outline: none;
|
|
35
35
|
cursor: inherit;
|