@pallasoft/ps-input-components 3.3.2 → 3.3.3
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.
|
@@ -5,7 +5,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
|
|
|
5
5
|
const ps_design_system_1 = require("@pallasoft/ps-design-system");
|
|
6
6
|
const ps_icons_1 = require("@pallasoft/ps-icons");
|
|
7
7
|
const react_aria_components_1 = require("react-aria-components");
|
|
8
|
-
const PsCheckbox = ({ children, className, isDisabled, isIndeterminate, isLoading = false, isSelected, label, name, onChange, value, }) => isLoading ? ((0, jsx_runtime_1.jsx)("span", { "aria-busy": 'true', className: ps_design_system_1.PallasoftClassNameService.merge('ps-skeleton inline-block h-
|
|
8
|
+
const PsCheckbox = ({ children, className, isDisabled, isIndeterminate, isLoading = false, isSelected, label, name, onChange, value, }) => isLoading ? ((0, jsx_runtime_1.jsx)("span", { "aria-busy": 'true', className: ps_design_system_1.PallasoftClassNameService.merge('ps-skeleton inline-block h-[1.125rem] w-[1.125rem] rounded-[0.35rem]', className), role: 'status', children: (0, jsx_runtime_1.jsx)("span", { className: 'sr-only', children: label }) })) : ((0, jsx_runtime_1.jsx)(react_aria_components_1.Checkbox, { "aria-label": children ? undefined : label, className: ps_design_system_1.PallasoftClassNameService.merge('group inline-flex cursor-pointer items-center gap-3 text-sm text-ink outline-none data-[disabled]:cursor-not-allowed data-[disabled]:opacity-45', className), isDisabled: isDisabled, isIndeterminate: isIndeterminate, isSelected: isSelected, name: name, onChange: onChange, value: value, children: ({ isIndeterminate: showDash, isSelected: showCheck }) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { className: ps_design_system_1.PallasoftClassNameService.merge('flex h-[1.125rem] w-[1.125rem] shrink-0 items-center justify-center rounded-[0.35rem] border transition-colors duration-150 group-data-[focus-visible]:outline group-data-[focus-visible]:outline-2 group-data-[focus-visible]:outline-offset-2 group-data-[focus-visible]:outline-[rgb(var(--ps-color-primary-rgb))]', showCheck || showDash
|
|
9
9
|
? 'border-primary bg-primary text-[color:var(--ps-color-primary-contrast)]'
|
|
10
10
|
: 'border-line bg-surface group-hover:border-primary/60 dark:border-white/20'), children: showDash ? ((0, jsx_runtime_1.jsx)("span", { className: 'block h-0.5 w-2.5 rounded-full bg-current' })) : showCheck ? ((0, jsx_runtime_1.jsx)(ps_icons_1.PsIcon, { "aria-hidden": 'true', className: 'block h-3.5 w-3.5', iconKey: ps_icons_1.PsIconKey.Check, strokeWidth: 3 })) : null }), children] })) }));
|
|
11
11
|
exports.PsCheckbox = PsCheckbox;
|
|
@@ -2,6 +2,6 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
|
|
|
2
2
|
import { PallasoftClassNameService } from '@pallasoft/ps-design-system';
|
|
3
3
|
import { PsIcon, PsIconKey } from '@pallasoft/ps-icons';
|
|
4
4
|
import { Checkbox } from 'react-aria-components';
|
|
5
|
-
export const PsCheckbox = ({ children, className, isDisabled, isIndeterminate, isLoading = false, isSelected, label, name, onChange, value, }) => isLoading ? (_jsx("span", { "aria-busy": 'true', className: PallasoftClassNameService.merge('ps-skeleton inline-block h-
|
|
5
|
+
export const PsCheckbox = ({ children, className, isDisabled, isIndeterminate, isLoading = false, isSelected, label, name, onChange, value, }) => isLoading ? (_jsx("span", { "aria-busy": 'true', className: PallasoftClassNameService.merge('ps-skeleton inline-block h-[1.125rem] w-[1.125rem] rounded-[0.35rem]', className), role: 'status', children: _jsx("span", { className: 'sr-only', children: label }) })) : (_jsx(Checkbox, { "aria-label": children ? undefined : label, className: PallasoftClassNameService.merge('group inline-flex cursor-pointer items-center gap-3 text-sm text-ink outline-none data-[disabled]:cursor-not-allowed data-[disabled]:opacity-45', className), isDisabled: isDisabled, isIndeterminate: isIndeterminate, isSelected: isSelected, name: name, onChange: onChange, value: value, children: ({ isIndeterminate: showDash, isSelected: showCheck }) => (_jsxs(_Fragment, { children: [_jsx("span", { className: PallasoftClassNameService.merge('flex h-[1.125rem] w-[1.125rem] shrink-0 items-center justify-center rounded-[0.35rem] border transition-colors duration-150 group-data-[focus-visible]:outline group-data-[focus-visible]:outline-2 group-data-[focus-visible]:outline-offset-2 group-data-[focus-visible]:outline-[rgb(var(--ps-color-primary-rgb))]', showCheck || showDash
|
|
6
6
|
? 'border-primary bg-primary text-[color:var(--ps-color-primary-contrast)]'
|
|
7
7
|
: 'border-line bg-surface group-hover:border-primary/60 dark:border-white/20'), children: showDash ? (_jsx("span", { className: 'block h-0.5 w-2.5 rounded-full bg-current' })) : showCheck ? (_jsx(PsIcon, { "aria-hidden": 'true', className: 'block h-3.5 w-3.5', iconKey: PsIconKey.Check, strokeWidth: 3 })) : null }), children] })) }));
|