@plexui/vue 0.1.5 → 0.1.6
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.
|
@@ -141,7 +141,10 @@ const CheckboxComponent = defineComponent({
|
|
|
141
141
|
"aria-disabled": undefined,
|
|
142
142
|
...buttonAttrs,
|
|
143
143
|
"aria-describedby": ariaDescribedBy,
|
|
144
|
-
},
|
|
144
|
+
},
|
|
145
|
+
// Mounted for good: on every uncheck Presence reads computed style, and
|
|
146
|
+
// a long list of boxes cleared at once forces one style pass per box.
|
|
147
|
+
{ default: () => h(RekaCheckboxIndicator, { class: s.CheckMark, forceMount: true }) }),
|
|
145
148
|
}),
|
|
146
149
|
isFormControl.value
|
|
147
150
|
? h("input", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../../src/components/Checkbox/Checkbox.ts"],"names":[],"mappings":"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","sourcesContent":["import { computed, defineComponent, h, onMounted, ref, useId, watch, type PropType } from \"vue\"\nimport { CheckboxIndicator as RekaCheckboxIndicator, CheckboxRoot as RekaCheckboxRoot } from \"reka-ui\"\nimport { bubbleInputStyle, useBubbleInputEffect, useCheckedTracker, useIsFormControl, useSize } from \"./bubbleInput.js\"\nimport { ControlButton, isListener, type Listeners } from \"./ControlButton.js\"\nimport s from \"@plexui/styles/components/Checkbox/Checkbox.module.css\"\n\n// Vue port of packages/ui/src/components/Checkbox/Checkbox.tsx on Reka UI's\n// Checkbox (state, role, aria-checked, Enter handling, indicator presence).\n// Where Reka's DOM differs from Radix's, Radix's is rendered (see the parity\n// tests): the button carries `value`, no `aria-disabled` and no `aria-label`\n// copied from the label text; the hidden form input is Radix's BubbleInput;\n// the consumer's handlers run before the toggle and can cancel it; a form\n// reset restores the initial state.\n\nexport type CheckedState = boolean | \"indeterminate\"\n\nconst CheckboxComponent = defineComponent({\n name: \"Checkbox\",\n inheritAttrs: false,\n props: {\n /** The `id` of the checkbox. */\n id: String,\n /** The state of the checkbox when it is initially rendered. Use when you do not need to control its state. */\n defaultChecked: { type: [Boolean, String] as PropType<CheckedState>, default: undefined },\n /** The controlled state of the checkbox. Bind with `v-model:checked`. */\n checked: { type: [Boolean, String] as PropType<CheckedState>, default: undefined },\n /** Optional accessible label rendered to the right of the checkbox. The `label` slot takes rich content. */\n label: String,\n /** Optional second line below the label, linked via `aria-describedby`. The `description` slot takes rich content. */\n description: String,\n /** When `true`, prevents the user from interacting with the checkbox. */\n disabled: { type: Boolean, default: false },\n /** When `true`, indicates that the user must check the checkbox before the owning form can be submitted. */\n required: { type: Boolean, default: undefined },\n /** The name of the checkbox. Submitted with its owning form as part of a name/value pair. */\n name: String,\n /** The value given as data when submitted with a `name`. @default \"on\" */\n value: String,\n /** The orientation of the checkbox relative to the label. @default \"left\" */\n orientation: { type: String as PropType<\"left\" | \"right\">, default: \"left\" },\n /** Determines if the checkbox should be a fully rounded pill shape. @default false */\n pill: { type: Boolean, default: false },\n /** Visual style: `\"solid\"` fills the box when checked, `\"ghost\"` shows the checkmark only. @default \"solid\" */\n variant: { type: String as PropType<\"solid\" | \"ghost\">, default: \"solid\" },\n },\n emits: {\n /** The state of the checkbox changed */\n \"update:checked\": (_checked: CheckedState) => true,\n /** The checkbox gained focus */\n focus: (_event: FocusEvent) => true,\n /** The checkbox lost focus */\n blur: (_event: FocusEvent) => true,\n },\n setup(props, { attrs, slots, emit }) {\n const generatedId = useId()\n const container = ref<HTMLDivElement | null>(null)\n const control = ref<HTMLButtonElement | null>(null)\n const bubbleInput = ref<HTMLInputElement | null>(null)\n useCheckedTracker(bubbleInput)\n\n // Radix's useControllableState: controlled while `checked` is set, and\n // only actual changes are reported\n const internalChecked = ref<CheckedState>(props.defaultChecked ?? false)\n const checked = computed(() => props.checked ?? internalChecked.value)\n // The state a click asks for (Reka's toggle sets it), for the user click\n let requestedChecked = true\n const setChecked = (next: CheckedState) => {\n requestedChecked = next === true\n if (next === checked.value) return\n if (props.checked === undefined) internalChecked.value = next\n emit(\"update:checked\", next)\n }\n\n const initialChecked = checked.value\n const isFormControl = useIsFormControl(control, () => attrs.form)\n const controlSize = useSize(() => (isFormControl.value ? control.value : null))\n const onUserClick = useBubbleInputEffect(bubbleInput, () => checked.value, true)\n\n onMounted(() => {\n control.value = (container.value?.firstElementChild as HTMLButtonElement | null) ?? null\n })\n\n // Like a native checkbox, a form reset restores the initial state\n watch(control, (button, _, onCleanup) => {\n const form = button?.form\n if (!form) return\n const reset = () => setChecked(initialChecked)\n form.addEventListener(\"reset\", reset)\n onCleanup(() => form.removeEventListener(\"reset\", reset))\n })\n\n // In a form, the button's click stops here; the input's click bubbles instead\n const afterClick = (event: Event) => {\n const hasConsumerStoppedPropagation = event.cancelBubble\n onUserClick({ requestedChecked, hasConsumerStoppedPropagation })\n if (bubbleInput.value && isFormControl.value && !hasConsumerStoppedPropagation) event.stopPropagation()\n }\n\n // Prevents text selection when double-clicking the label\n const handleLabelMouseDown = (event: MouseEvent) => {\n if (!event.defaultPrevented && event.detail > 1) event.preventDefault()\n }\n\n return () => {\n const { class: className, form, ...rest } = attrs\n const id = props.id ?? generatedId\n const hasLabel = Boolean(slots.label || props.label)\n // The description only renders next to a label; it comes before any ids\n // the caller (a Field, say) passes\n const descriptionId = hasLabel && (slots.description || props.description) ? `${id}-label-description` : undefined\n const indeterminateDefault = props.defaultChecked === \"indeterminate\" ? false : props.defaultChecked\n const inputDefaultChecked = indeterminateDefault ?? (initialChecked === \"indeterminate\" ? false : initialChecked)\n\n // The consumer's listeners compose with Reka's; other attributes land\n // on the button after the component's own, as `{...restProps}` does\n const listeners: Listeners = {\n onFocus: (event: FocusEvent) => emit(\"focus\", event),\n onBlur: (event: FocusEvent) => emit(\"blur\", event),\n }\n const buttonAttrs: Record<string, unknown> = {}\n for (const [key, value] of Object.entries(rest)) {\n if (isListener(key)) listeners[key] = value\n else buttonAttrs[key] = value\n }\n const ariaDescribedBy =\n [descriptionId, buttonAttrs[\"aria-describedby\"] as string | undefined].filter(Boolean).join(\" \") || undefined\n const labelElement = hasLabel\n ? h(\"label\", { for: id, class: s.Label, onMousedown: handleLabelMouseDown }, slots.label ? slots.label() : props.label)\n : null\n\n return h(\n \"div\",\n {\n \"ref\": container,\n \"data-disabled\": props.disabled ? \"\" : undefined,\n \"data-has-label\": hasLabel ? \"\" : undefined,\n \"data-orientation\": props.orientation,\n \"class\": [className, s.Container],\n },\n [\n h(\n RekaCheckboxRoot as never,\n {\n \"asChild\": true,\n \"modelValue\": checked.value,\n \"onUpdate:modelValue\": setChecked,\n \"disabled\": props.disabled,\n // Passed even when unset, so Reka renders no aria-required=\"false\"\n \"required\": props.required,\n },\n {\n default: () =>\n h(\n ControlButton,\n {\n \"listeners\": listeners,\n \"after\": { onClick: afterClick },\n \"class\": s.Checkbox,\n \"id\": id,\n \"data-pill\": props.pill ? \"\" : undefined,\n \"data-variant\": props.variant,\n \"value\": props.value ?? \"on\",\n // Reka marks a disabled checkbox aria-disabled; Radix does not\n \"aria-disabled\": undefined,\n ...buttonAttrs,\n \"aria-describedby\": ariaDescribedBy,\n },\n { default: () => h(RekaCheckboxIndicator, { class: s.CheckMark }) },\n ),\n },\n ),\n isFormControl.value\n ? h(\"input\", {\n \"ref\": bubbleInput,\n \"type\": \"checkbox\",\n \"aria-hidden\": \"true\",\n \"^checked\": inputDefaultChecked ? \"\" : undefined,\n \"required\": props.required,\n \"disabled\": props.disabled,\n \"name\": props.name,\n \"^value\": props.value ?? \"on\",\n \"form\": form,\n \"tabindex\": -1,\n \"style\": bubbleInputStyle(controlSize.value, { transform: \"translateX(-100%)\" }),\n })\n : null,\n descriptionId\n ? h(\"div\", { class: s.LabelGroup }, [\n labelElement,\n h(\n \"span\",\n { id: descriptionId, class: s.Description },\n slots.description ? slots.description() : props.description,\n ),\n ])\n : labelElement,\n ],\n )\n }\n },\n})\n\ntype CheckboxOwnProps = InstanceType<typeof CheckboxComponent>[\"$props\"]\n\nexport type CheckboxProps = CheckboxOwnProps\n\nexport const Checkbox = CheckboxComponent\n"]}
|
|
1
|
+
{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../../src/components/Checkbox/Checkbox.ts"],"names":[],"mappings":"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","sourcesContent":["import { computed, defineComponent, h, onMounted, ref, useId, watch, type PropType } from \"vue\"\nimport { CheckboxIndicator as RekaCheckboxIndicator, CheckboxRoot as RekaCheckboxRoot } from \"reka-ui\"\nimport { bubbleInputStyle, useBubbleInputEffect, useCheckedTracker, useIsFormControl, useSize } from \"./bubbleInput.js\"\nimport { ControlButton, isListener, type Listeners } from \"./ControlButton.js\"\nimport s from \"@plexui/styles/components/Checkbox/Checkbox.module.css\"\n\n// Vue port of packages/ui/src/components/Checkbox/Checkbox.tsx on Reka UI's\n// Checkbox (state, role, aria-checked, Enter handling, indicator presence).\n// Where Reka's DOM differs from Radix's, Radix's is rendered (see the parity\n// tests): the button carries `value`, no `aria-disabled` and no `aria-label`\n// copied from the label text; the hidden form input is Radix's BubbleInput;\n// the consumer's handlers run before the toggle and can cancel it; a form\n// reset restores the initial state.\n\nexport type CheckedState = boolean | \"indeterminate\"\n\nconst CheckboxComponent = defineComponent({\n name: \"Checkbox\",\n inheritAttrs: false,\n props: {\n /** The `id` of the checkbox. */\n id: String,\n /** The state of the checkbox when it is initially rendered. Use when you do not need to control its state. */\n defaultChecked: { type: [Boolean, String] as PropType<CheckedState>, default: undefined },\n /** The controlled state of the checkbox. Bind with `v-model:checked`. */\n checked: { type: [Boolean, String] as PropType<CheckedState>, default: undefined },\n /** Optional accessible label rendered to the right of the checkbox. The `label` slot takes rich content. */\n label: String,\n /** Optional second line below the label, linked via `aria-describedby`. The `description` slot takes rich content. */\n description: String,\n /** When `true`, prevents the user from interacting with the checkbox. */\n disabled: { type: Boolean, default: false },\n /** When `true`, indicates that the user must check the checkbox before the owning form can be submitted. */\n required: { type: Boolean, default: undefined },\n /** The name of the checkbox. Submitted with its owning form as part of a name/value pair. */\n name: String,\n /** The value given as data when submitted with a `name`. @default \"on\" */\n value: String,\n /** The orientation of the checkbox relative to the label. @default \"left\" */\n orientation: { type: String as PropType<\"left\" | \"right\">, default: \"left\" },\n /** Determines if the checkbox should be a fully rounded pill shape. @default false */\n pill: { type: Boolean, default: false },\n /** Visual style: `\"solid\"` fills the box when checked, `\"ghost\"` shows the checkmark only. @default \"solid\" */\n variant: { type: String as PropType<\"solid\" | \"ghost\">, default: \"solid\" },\n },\n emits: {\n /** The state of the checkbox changed */\n \"update:checked\": (_checked: CheckedState) => true,\n /** The checkbox gained focus */\n focus: (_event: FocusEvent) => true,\n /** The checkbox lost focus */\n blur: (_event: FocusEvent) => true,\n },\n setup(props, { attrs, slots, emit }) {\n const generatedId = useId()\n const container = ref<HTMLDivElement | null>(null)\n const control = ref<HTMLButtonElement | null>(null)\n const bubbleInput = ref<HTMLInputElement | null>(null)\n useCheckedTracker(bubbleInput)\n\n // Radix's useControllableState: controlled while `checked` is set, and\n // only actual changes are reported\n const internalChecked = ref<CheckedState>(props.defaultChecked ?? false)\n const checked = computed(() => props.checked ?? internalChecked.value)\n // The state a click asks for (Reka's toggle sets it), for the user click\n let requestedChecked = true\n const setChecked = (next: CheckedState) => {\n requestedChecked = next === true\n if (next === checked.value) return\n if (props.checked === undefined) internalChecked.value = next\n emit(\"update:checked\", next)\n }\n\n const initialChecked = checked.value\n const isFormControl = useIsFormControl(control, () => attrs.form)\n const controlSize = useSize(() => (isFormControl.value ? control.value : null))\n const onUserClick = useBubbleInputEffect(bubbleInput, () => checked.value, true)\n\n onMounted(() => {\n control.value = (container.value?.firstElementChild as HTMLButtonElement | null) ?? null\n })\n\n // Like a native checkbox, a form reset restores the initial state\n watch(control, (button, _, onCleanup) => {\n const form = button?.form\n if (!form) return\n const reset = () => setChecked(initialChecked)\n form.addEventListener(\"reset\", reset)\n onCleanup(() => form.removeEventListener(\"reset\", reset))\n })\n\n // In a form, the button's click stops here; the input's click bubbles instead\n const afterClick = (event: Event) => {\n const hasConsumerStoppedPropagation = event.cancelBubble\n onUserClick({ requestedChecked, hasConsumerStoppedPropagation })\n if (bubbleInput.value && isFormControl.value && !hasConsumerStoppedPropagation) event.stopPropagation()\n }\n\n // Prevents text selection when double-clicking the label\n const handleLabelMouseDown = (event: MouseEvent) => {\n if (!event.defaultPrevented && event.detail > 1) event.preventDefault()\n }\n\n return () => {\n const { class: className, form, ...rest } = attrs\n const id = props.id ?? generatedId\n const hasLabel = Boolean(slots.label || props.label)\n // The description only renders next to a label; it comes before any ids\n // the caller (a Field, say) passes\n const descriptionId = hasLabel && (slots.description || props.description) ? `${id}-label-description` : undefined\n const indeterminateDefault = props.defaultChecked === \"indeterminate\" ? false : props.defaultChecked\n const inputDefaultChecked = indeterminateDefault ?? (initialChecked === \"indeterminate\" ? false : initialChecked)\n\n // The consumer's listeners compose with Reka's; other attributes land\n // on the button after the component's own, as `{...restProps}` does\n const listeners: Listeners = {\n onFocus: (event: FocusEvent) => emit(\"focus\", event),\n onBlur: (event: FocusEvent) => emit(\"blur\", event),\n }\n const buttonAttrs: Record<string, unknown> = {}\n for (const [key, value] of Object.entries(rest)) {\n if (isListener(key)) listeners[key] = value\n else buttonAttrs[key] = value\n }\n const ariaDescribedBy =\n [descriptionId, buttonAttrs[\"aria-describedby\"] as string | undefined].filter(Boolean).join(\" \") || undefined\n const labelElement = hasLabel\n ? h(\"label\", { for: id, class: s.Label, onMousedown: handleLabelMouseDown }, slots.label ? slots.label() : props.label)\n : null\n\n return h(\n \"div\",\n {\n \"ref\": container,\n \"data-disabled\": props.disabled ? \"\" : undefined,\n \"data-has-label\": hasLabel ? \"\" : undefined,\n \"data-orientation\": props.orientation,\n \"class\": [className, s.Container],\n },\n [\n h(\n RekaCheckboxRoot as never,\n {\n \"asChild\": true,\n \"modelValue\": checked.value,\n \"onUpdate:modelValue\": setChecked,\n \"disabled\": props.disabled,\n // Passed even when unset, so Reka renders no aria-required=\"false\"\n \"required\": props.required,\n },\n {\n default: () =>\n h(\n ControlButton,\n {\n \"listeners\": listeners,\n \"after\": { onClick: afterClick },\n \"class\": s.Checkbox,\n \"id\": id,\n \"data-pill\": props.pill ? \"\" : undefined,\n \"data-variant\": props.variant,\n \"value\": props.value ?? \"on\",\n // Reka marks a disabled checkbox aria-disabled; Radix does not\n \"aria-disabled\": undefined,\n ...buttonAttrs,\n \"aria-describedby\": ariaDescribedBy,\n },\n // Mounted for good: on every uncheck Presence reads computed style, and\n // a long list of boxes cleared at once forces one style pass per box.\n { default: () => h(RekaCheckboxIndicator, { class: s.CheckMark, forceMount: true }) },\n ),\n },\n ),\n isFormControl.value\n ? h(\"input\", {\n \"ref\": bubbleInput,\n \"type\": \"checkbox\",\n \"aria-hidden\": \"true\",\n \"^checked\": inputDefaultChecked ? \"\" : undefined,\n \"required\": props.required,\n \"disabled\": props.disabled,\n \"name\": props.name,\n \"^value\": props.value ?? \"on\",\n \"form\": form,\n \"tabindex\": -1,\n \"style\": bubbleInputStyle(controlSize.value, { transform: \"translateX(-100%)\" }),\n })\n : null,\n descriptionId\n ? h(\"div\", { class: s.LabelGroup }, [\n labelElement,\n h(\n \"span\",\n { id: descriptionId, class: s.Description },\n slots.description ? slots.description() : props.description,\n ),\n ])\n : labelElement,\n ],\n )\n }\n },\n})\n\ntype CheckboxOwnProps = InstanceType<typeof CheckboxComponent>[\"$props\"]\n\nexport type CheckboxProps = CheckboxOwnProps\n\nexport const Checkbox = CheckboxComponent\n"]}
|