Skip to main content
Glama
index.js11 kB
"use strict"; "use client"; var __create = Object.create; var __defProp = Object.defineProperty; var __getOwnPropDesc = Object.getOwnPropertyDescriptor; var __getOwnPropNames = Object.getOwnPropertyNames; var __getProtoOf = Object.getPrototypeOf; var __hasOwnProp = Object.prototype.hasOwnProperty; var __export = (target, all) => { for (var name in all) __defProp(target, name, { get: all[name], enumerable: true }); }; var __copyProps = (to, from, except, desc) => { if (from && typeof from === "object" || typeof from === "function") { for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); } return to; }; var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps( // If the importer is in node compatibility mode or this is not an ESM // file that has been converted to a CommonJS file using a Babel- // compatible transform (i.e. "__esModule" has not been set), then set // "default" to the CommonJS "module.exports" for node compatibility. isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod )); var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod); // src/index.ts var index_exports = {}; __export(index_exports, { Checkbox: () => Checkbox, CheckboxIndicator: () => CheckboxIndicator, Indicator: () => CheckboxIndicator, Root: () => Checkbox, createCheckboxScope: () => createCheckboxScope, unstable_BubbleInput: () => CheckboxBubbleInput, unstable_CheckboxBubbleInput: () => CheckboxBubbleInput, unstable_CheckboxProvider: () => CheckboxProvider, unstable_CheckboxTrigger: () => CheckboxTrigger, unstable_Provider: () => CheckboxProvider, unstable_Trigger: () => CheckboxTrigger }); module.exports = __toCommonJS(index_exports); // src/checkbox.tsx var React = __toESM(require("react")); var import_react_compose_refs = require("@radix-ui/react-compose-refs"); var import_react_context = require("@radix-ui/react-context"); var import_primitive = require("@radix-ui/primitive"); var import_react_use_controllable_state = require("@radix-ui/react-use-controllable-state"); var import_react_use_previous = require("@radix-ui/react-use-previous"); var import_react_use_size = require("@radix-ui/react-use-size"); var import_react_presence = require("@radix-ui/react-presence"); var import_react_primitive = require("@radix-ui/react-primitive"); var import_jsx_runtime = require("react/jsx-runtime"); var CHECKBOX_NAME = "Checkbox"; var [createCheckboxContext, createCheckboxScope] = (0, import_react_context.createContextScope)(CHECKBOX_NAME); var [CheckboxProviderImpl, useCheckboxContext] = createCheckboxContext(CHECKBOX_NAME); function CheckboxProvider(props) { const { __scopeCheckbox, checked: checkedProp, children, defaultChecked, disabled, form, name, onCheckedChange, required, value = "on", // @ts-expect-error internal_do_not_use_render } = props; const [checked, setChecked] = (0, import_react_use_controllable_state.useControllableState)({ prop: checkedProp, defaultProp: defaultChecked ?? false, onChange: onCheckedChange, caller: CHECKBOX_NAME }); const [control, setControl] = React.useState(null); const [bubbleInput, setBubbleInput] = React.useState(null); const hasConsumerStoppedPropagationRef = React.useRef(false); const isFormControl = control ? !!form || !!control.closest("form") : ( // We set this to true by default so that events bubble to forms without JS (SSR) true ); const context = { checked, disabled, setChecked, control, setControl, name, form, value, hasConsumerStoppedPropagationRef, required, defaultChecked: isIndeterminate(defaultChecked) ? false : defaultChecked, isFormControl, bubbleInput, setBubbleInput }; return /* @__PURE__ */ (0, import_jsx_runtime.jsx)( CheckboxProviderImpl, { scope: __scopeCheckbox, ...context, children: isFunction(internal_do_not_use_render) ? internal_do_not_use_render(context) : children } ); } var TRIGGER_NAME = "CheckboxTrigger"; var CheckboxTrigger = React.forwardRef( ({ __scopeCheckbox, onKeyDown, onClick, ...checkboxProps }, forwardedRef) => { const { control, value, disabled, checked, required, setControl, setChecked, hasConsumerStoppedPropagationRef, isFormControl, bubbleInput } = useCheckboxContext(TRIGGER_NAME, __scopeCheckbox); const composedRefs = (0, import_react_compose_refs.useComposedRefs)(forwardedRef, setControl); const initialCheckedStateRef = React.useRef(checked); React.useEffect(() => { const form = control?.form; if (form) { const reset = () => setChecked(initialCheckedStateRef.current); form.addEventListener("reset", reset); return () => form.removeEventListener("reset", reset); } }, [control, setChecked]); return /* @__PURE__ */ (0, import_jsx_runtime.jsx)( import_react_primitive.Primitive.button, { type: "button", role: "checkbox", "aria-checked": isIndeterminate(checked) ? "mixed" : checked, "aria-required": required, "data-state": getState(checked), "data-disabled": disabled ? "" : void 0, disabled, value, ...checkboxProps, ref: composedRefs, onKeyDown: (0, import_primitive.composeEventHandlers)(onKeyDown, (event) => { if (event.key === "Enter") event.preventDefault(); }), onClick: (0, import_primitive.composeEventHandlers)(onClick, (event) => { setChecked((prevChecked) => isIndeterminate(prevChecked) ? true : !prevChecked); if (bubbleInput && isFormControl) { hasConsumerStoppedPropagationRef.current = event.isPropagationStopped(); if (!hasConsumerStoppedPropagationRef.current) event.stopPropagation(); } }) } ); } ); CheckboxTrigger.displayName = TRIGGER_NAME; var Checkbox = React.forwardRef( (props, forwardedRef) => { const { __scopeCheckbox, name, checked, defaultChecked, required, disabled, value, onCheckedChange, form, ...checkboxProps } = props; return /* @__PURE__ */ (0, import_jsx_runtime.jsx)( CheckboxProvider, { __scopeCheckbox, checked, defaultChecked, disabled, required, onCheckedChange, name, form, value, internal_do_not_use_render: ({ isFormControl }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [ /* @__PURE__ */ (0, import_jsx_runtime.jsx)( CheckboxTrigger, { ...checkboxProps, ref: forwardedRef, __scopeCheckbox } ), isFormControl && /* @__PURE__ */ (0, import_jsx_runtime.jsx)( CheckboxBubbleInput, { __scopeCheckbox } ) ] }) } ); } ); Checkbox.displayName = CHECKBOX_NAME; var INDICATOR_NAME = "CheckboxIndicator"; var CheckboxIndicator = React.forwardRef( (props, forwardedRef) => { const { __scopeCheckbox, forceMount, ...indicatorProps } = props; const context = useCheckboxContext(INDICATOR_NAME, __scopeCheckbox); return /* @__PURE__ */ (0, import_jsx_runtime.jsx)( import_react_presence.Presence, { present: forceMount || isIndeterminate(context.checked) || context.checked === true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)( import_react_primitive.Primitive.span, { "data-state": getState(context.checked), "data-disabled": context.disabled ? "" : void 0, ...indicatorProps, ref: forwardedRef, style: { pointerEvents: "none", ...props.style } } ) } ); } ); CheckboxIndicator.displayName = INDICATOR_NAME; var BUBBLE_INPUT_NAME = "CheckboxBubbleInput"; var CheckboxBubbleInput = React.forwardRef( ({ __scopeCheckbox, ...props }, forwardedRef) => { const { control, hasConsumerStoppedPropagationRef, checked, defaultChecked, required, disabled, name, value, form, bubbleInput, setBubbleInput } = useCheckboxContext(BUBBLE_INPUT_NAME, __scopeCheckbox); const composedRefs = (0, import_react_compose_refs.useComposedRefs)(forwardedRef, setBubbleInput); const prevChecked = (0, import_react_use_previous.usePrevious)(checked); const controlSize = (0, import_react_use_size.useSize)(control); React.useEffect(() => { const input = bubbleInput; if (!input) return; const inputProto = window.HTMLInputElement.prototype; const descriptor = Object.getOwnPropertyDescriptor( inputProto, "checked" ); const setChecked = descriptor.set; const bubbles = !hasConsumerStoppedPropagationRef.current; if (prevChecked !== checked && setChecked) { const event = new Event("click", { bubbles }); input.indeterminate = isIndeterminate(checked); setChecked.call(input, isIndeterminate(checked) ? false : checked); input.dispatchEvent(event); } }, [bubbleInput, prevChecked, checked, hasConsumerStoppedPropagationRef]); const defaultCheckedRef = React.useRef(isIndeterminate(checked) ? false : checked); return /* @__PURE__ */ (0, import_jsx_runtime.jsx)( import_react_primitive.Primitive.input, { type: "checkbox", "aria-hidden": true, defaultChecked: defaultChecked ?? defaultCheckedRef.current, required, disabled, name, value, form, ...props, tabIndex: -1, ref: composedRefs, style: { ...props.style, ...controlSize, position: "absolute", pointerEvents: "none", opacity: 0, margin: 0, // We transform because the input is absolutely positioned but we have // rendered it **after** the button. This pulls it back to sit on top // of the button. transform: "translateX(-100%)" } } ); } ); CheckboxBubbleInput.displayName = BUBBLE_INPUT_NAME; function isFunction(value) { return typeof value === "function"; } function isIndeterminate(checked) { return checked === "indeterminate"; } function getState(checked) { return isIndeterminate(checked) ? "indeterminate" : checked ? "checked" : "unchecked"; } //# sourceMappingURL=index.js.map

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/kkShrihari/miEAA3_mcp'

If you have feedback or need assistance with the MCP directory API, please join our Discord server