admin: phosphor icons replace hand-drawn svgs and text-character glyphs
Release / guard (push) Successful in 39s
Gates / frontend (push) Failing after 2m25s
Gates / package (push) Skipped
Gates / container (push) Skipped
Gates / frontend (push) Failing after 1m59s
Gates / package (push) Skipped
Gates / container (push) Skipped
Gates / test-aarch64 (push) Successful in 8m18s
CI / gates (push) Failing after 11m34s
Gates / test (push) Successful in 2m18s
Gates / test-aarch64 (push) Successful in 7m23s
Release / gates (push) Failing after 18m51s
Release / publish (push) Skipped
Gates / test (push) Successful in 2m36s
Release / guard (push) Successful in 39s
Gates / frontend (push) Failing after 2m25s
Gates / package (push) Skipped
Gates / container (push) Skipped
Gates / frontend (push) Failing after 1m59s
Gates / package (push) Skipped
Gates / container (push) Skipped
Gates / test-aarch64 (push) Successful in 8m18s
CI / gates (push) Failing after 11m34s
Gates / test (push) Successful in 2m18s
Gates / test-aarch64 (push) Successful in 7m23s
Release / gates (push) Failing after 18m51s
Release / publish (push) Skipped
Gates / test (push) Successful in 2m36s
health strip marks, menu ticks, chip crosses, the search magnifier, the checkbox check and the back arrows all come from @phosphor-icons/react now, pinned exactly and entered in the license ledger. changelog and version bump for 0.0.15, including the bundle budget raise to 900000 bytes.
This commit is contained in:
@@ -11,6 +11,7 @@
|
||||
*/
|
||||
|
||||
import type { ReactNode } from "react";
|
||||
import { Check } from "@phosphor-icons/react";
|
||||
import * as stylex from "@stylexjs/stylex";
|
||||
import { Checkbox as AriaCheckbox } from "react-aria-components";
|
||||
import { colors } from "./tokens.stylex";
|
||||
@@ -100,21 +101,6 @@ const styles = stylex.create({
|
||||
},
|
||||
});
|
||||
|
||||
/** `currentColor` so the mark follows the selected box's foreground token. */
|
||||
function CheckMark() {
|
||||
return (
|
||||
<svg aria-hidden="true" viewBox="0 0 12 12" width="10" height="10" fill="none">
|
||||
<path
|
||||
d="M2.5 6.5 5 9l4.5-5.5"
|
||||
stroke="currentColor"
|
||||
strokeWidth="2"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
);
|
||||
}
|
||||
|
||||
export default function Checkbox({ children, ...state }: Props) {
|
||||
return (
|
||||
<AriaCheckbox {...state} className={() => stylex.props(styles.label).className ?? ""}>
|
||||
@@ -128,7 +114,8 @@ export default function Checkbox({ children, ...state }: Props) {
|
||||
renderProps.isDisabled && styles.boxDisabled,
|
||||
)}
|
||||
>
|
||||
{renderProps.isSelected && <CheckMark />}
|
||||
{/* Bold: the regular stroke thins to near-invisible at this size. */}
|
||||
{renderProps.isSelected && <Check aria-hidden="true" size={10} weight="bold" />}
|
||||
</span>
|
||||
{children}
|
||||
</>
|
||||
|
||||
Reference in New Issue
Block a user