UNPKG

@crossed/primitive

Version:

A universal & performant styling library for React Native, Next.js & React

53 lines (52 loc) 2.42 kB
"use strict"; var __defProp = Object.defineProperty; var __getOwnPropDesc = Object.getOwnPropertyDescriptor; var __getOwnPropNames = Object.getOwnPropertyNames; 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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod); var InputInput_exports = {}; __export(InputInput_exports, { createInput: () => createInput }); module.exports = __toCommonJS(InputInput_exports); var import_jsx_runtime = require("react/jsx-runtime"); var import_react = require("react"); var import_context = require("./context"); var import_core = require("@crossed/core"); const createInput = (Styled, Group) => (0, import_react.forwardRef)((props, ref) => { const groupContext = (0, import_context.useInputContext)(); const Container = groupContext ? import_react.Fragment : Group; return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Container, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Slot, { ...props, ref, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Styled, { ...props }) }) }); }); const Slot = (0, import_react.forwardRef)( ({ children, ...props }, ref) => { const { setStates, inputRef } = (0, import_context.useInputContext)() || {}; return (0, import_react.isValidElement)(children) && import_react.Children.count(children) === 1 ? (0, import_react.cloneElement)(children, { ...props, ref: (0, import_core.composeRefs)(ref, inputRef), onBlur: (0, import_core.composeEventHandlers)(props.onBlur, () => { setStates == null ? void 0 : setStates({ isFocus: false }); }), onFocus: (0, import_core.composeEventHandlers)(props.onFocus, () => { setStates == null ? void 0 : setStates({ isFocus: true }); }) }) : children; } ); // Annotate the CommonJS export names for ESM import in node: 0 && (module.exports = { createInput }); //# sourceMappingURL=InputInput.js.map