UNPKG

@nlabs/gothamjs

Version:
50 lines (49 loc) 8.86 kB
import { jsx as _jsx } from "react/jsx-runtime"; /** * Copyright (c) 2018-Present, Nitrogen Labs, Inc. * Copyrights licensed under the MIT License. See the accompanying LICENSE file for terms. */ import { cn } from '@nlabs/utils'; import { forwardRef, useMemo } from 'react'; import { getBorderClasses, getOutlineClasses, getPlaceholderClasses, getTextClasses } from '../../utils/colorUtils.js'; export const baseClasses = { none: '', rounded: 'w-full rounded-md outline-1 outline-solid focus:outline-3 px-3.5 py-2 sm:text-sm sm:leading-6 bg-white/30 dark:bg-black/30', solid: 'w-full outline-1 outline-solid focus:outline-3 px-3.5 py-2 sm:text-sm sm:leading-6 bg-white/30 dark:bg-black/30', underline: 'w-full border-b-2 focus:border-b-3 autofill:bg-transparent outline-none py-2 sm:text-sm sm:leading-6' }; export const getInputBorderClass = (borderType, borderColor, textColor, placeholderColor)=>cn(baseClasses[borderType], getTextClasses(textColor), borderType === 'underline' ? getBorderClasses(borderColor, { hasFocus: true, hasHover: true }) : '', borderType === 'rounded' || borderType === 'solid' ? getOutlineClasses(borderColor, { hasFocus: true, hasHover: true }) : '', getPlaceholderClasses(placeholderColor, { hasFocus: true, hasHover: true })); export const InputField = /*#__PURE__*/ forwardRef(({ borderColor = 'neutral', borderType = 'solid', className, disabled = false, label, multiline = false, placeholderColor = 'neutral', textColor = 'neutral', ...inputProps }, ref)=>{ const borderClasses = useMemo(()=>getInputBorderClass(borderType, borderColor, textColor, placeholderColor), [ borderType, borderColor, textColor, placeholderColor ]); const inputClasses = useMemo(()=>cn(className, disabled ? 'text-neutral/30 dark:text-neutral-dark/30 outline-neutral/30 dark:outline-neutral-dark/30' : borderClasses, multiline && 'min-h-[100px] resize-y'), [ className, borderClasses, disabled, multiline ]); return multiline ? /*#__PURE__*/ _jsx("textarea", { ...inputProps, className: inputClasses, disabled: disabled, ref: ref }) : /*#__PURE__*/ _jsx("input", { ...inputProps, className: inputClasses, disabled: disabled, ref: ref }); }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9Vc2Vycy9uaXRyb2c3L0RldmVsb3BtZW50L2dvdGhhbWpzL3NyYy9jb21wb25lbnRzL0lucHV0RmllbGQvSW5wdXRGaWVsZC50c3giXSwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIDIwMTgtUHJlc2VudCwgTml0cm9nZW4gTGFicywgSW5jLlxuICogQ29weXJpZ2h0cyBsaWNlbnNlZCB1bmRlciB0aGUgTUlUIExpY2Vuc2UuIFNlZSB0aGUgYWNjb21wYW55aW5nIExJQ0VOU0UgZmlsZSBmb3IgdGVybXMuXG4gKi9cbmltcG9ydCB7Y259IGZyb20gJ0BubGFicy91dGlscyc7XG5pbXBvcnQge2ZvcndhcmRSZWYsIHVzZU1lbW99IGZyb20gJ3JlYWN0JztcblxuaW1wb3J0IHtcbiAgZ2V0Qm9yZGVyQ2xhc3NlcyxcbiAgZ2V0T3V0bGluZUNsYXNzZXMsXG4gIGdldFBsYWNlaG9sZGVyQ2xhc3NlcyxcbiAgZ2V0VGV4dENsYXNzZXNcbn0gZnJvbSAnLi4vLi4vdXRpbHMvY29sb3JVdGlscy5qcyc7XG5cbmltcG9ydCB0eXBlIHtJbnB1dEhUTUxBdHRyaWJ1dGVzLCBSZWYsIFRleHRhcmVhSFRNTEF0dHJpYnV0ZXN9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB0eXBlIHtHb3RoYW1Db2xvcn0gZnJvbSAnLi4vLi4vdXRpbHMvY29sb3JVdGlscy5qcyc7XG5cbmV4cG9ydCB0eXBlIElucHV0Qm9yZGVyVHlwZSA9ICdzb2xpZCcgfCAncm91bmRlZCcgfCAnbm9uZScgfCAndW5kZXJsaW5lJztcblxuZXhwb3J0IGludGVyZmFjZSBJbnB1dEZpZWxkUHJvcHMgZXh0ZW5kcyBPbWl0PElucHV0SFRNTEF0dHJpYnV0ZXM8SFRNTElucHV0RWxlbWVudD4gJiBUZXh0YXJlYUhUTUxBdHRyaWJ1dGVzPEhUTUxUZXh0QXJlYUVsZW1lbnQ+LCAnY2xhc3NOYW1lJz4ge1xuICByZWFkb25seSBib3JkZXJDb2xvcj86IEdvdGhhbUNvbG9yO1xuICByZWFkb25seSBib3JkZXJUeXBlPzogSW5wdXRCb3JkZXJUeXBlO1xuICByZWFkb25seSBjbGFzc05hbWU/OiBzdHJpbmc7XG4gIHJlYWRvbmx5IGlkPzogc3RyaW5nO1xuICByZWFkb25seSBsYWJlbD86IHN0cmluZztcbiAgcmVhZG9ubHkgbXVsdGlsaW5lPzogYm9vbGVhbjtcbiAgcmVhZG9ubHkgcGxhY2Vob2xkZXJDb2xvcj86IEdvdGhhbUNvbG9yO1xuICByZWFkb25seSB0ZXh0Q29sb3I/OiBHb3RoYW1Db2xvcjtcbn1cblxuZXhwb3J0IGNvbnN0IGJhc2VDbGFzc2VzID0ge1xuICBub25lOiAnJyxcbiAgcm91bmRlZDogJ3ctZnVsbCByb3VuZGVkLW1kIG91dGxpbmUtMSBvdXRsaW5lLXNvbGlkIGZvY3VzOm91dGxpbmUtMyBweC0zLjUgcHktMiBzbTp0ZXh0LXNtIHNtOmxlYWRpbmctNiBiZy13aGl0ZS8zMCBkYXJrOmJnLWJsYWNrLzMwJyxcbiAgc29saWQ6ICd3LWZ1bGwgb3V0bGluZS0xIG91dGxpbmUtc29saWQgZm9jdXM6b3V0bGluZS0zIHB4LTMuNSBweS0yIHNtOnRleHQtc20gc206bGVhZGluZy02IGJnLXdoaXRlLzMwIGRhcms6YmctYmxhY2svMzAnLFxuICB1bmRlcmxpbmU6ICd3LWZ1bGwgYm9yZGVyLWItMiBmb2N1czpib3JkZXItYi0zIGF1dG9maWxsOmJnLXRyYW5zcGFyZW50IG91dGxpbmUtbm9uZSBweS0yIHNtOnRleHQtc20gc206bGVhZGluZy02J1xufTtcblxuZXhwb3J0IGNvbnN0IGdldElucHV0Qm9yZGVyQ2xhc3MgPSAoXG4gIGJvcmRlclR5cGU6IElucHV0Qm9yZGVyVHlwZSxcbiAgYm9yZGVyQ29sb3I6IEdvdGhhbUNvbG9yLFxuICB0ZXh0Q29sb3I6IEdvdGhhbUNvbG9yLFxuICBwbGFjZWhvbGRlckNvbG9yOiBHb3RoYW1Db2xvclxuKSA9PiBjbihcbiAgYmFzZUNsYXNzZXNbYm9yZGVyVHlwZV0sXG4gIGdldFRleHRDbGFzc2VzKHRleHRDb2xvciksXG4gIGJvcmRlclR5cGUgPT09ICd1bmRlcmxpbmUnXG4gICAgPyBnZXRCb3JkZXJDbGFzc2VzKGJvcmRlckNvbG9yLCB7aGFzRm9jdXM6IHRydWUsIGhhc0hvdmVyOiB0cnVlfSlcbiAgICA6ICcnLFxuICBib3JkZXJUeXBlID09PSAncm91bmRlZCcgfHwgYm9yZGVyVHlwZSA9PT0gJ3NvbGlkJ1xuICAgID8gZ2V0T3V0bGluZUNsYXNzZXMoYm9yZGVyQ29sb3IsIHtoYXNGb2N1czogdHJ1ZSwgaGFzSG92ZXI6IHRydWV9KVxuICAgIDogJycsXG4gIGdldFBsYWNlaG9sZGVyQ2xhc3NlcyhwbGFjZWhvbGRlckNvbG9yLCB7aGFzRm9jdXM6IHRydWUsIGhhc0hvdmVyOiB0cnVlfSlcbik7XG5cbmV4cG9ydCBjb25zdCBJbnB1dEZpZWxkID0gZm9yd2FyZFJlZjxIVE1MSW5wdXRFbGVtZW50IHwgSFRNTFRleHRBcmVhRWxlbWVudCwgSW5wdXRGaWVsZFByb3BzPigoe1xuICBib3JkZXJDb2xvciA9ICduZXV0cmFsJyxcbiAgYm9yZGVyVHlwZSA9ICdzb2xpZCcsXG4gIGNsYXNzTmFtZSxcbiAgZGlzYWJsZWQgPSBmYWxzZSxcbiAgbGFiZWwsXG4gIG11bHRpbGluZSA9IGZhbHNlLFxuICBwbGFjZWhvbGRlckNvbG9yID0gJ25ldXRyYWwnLFxuICB0ZXh0Q29sb3IgPSAnbmV1dHJhbCcsXG4gIC4uLmlucHV0UHJvcHNcbn0sIHJlZikgPT4ge1xuICBjb25zdCBib3JkZXJDbGFzc2VzID0gdXNlTWVtbyhcbiAgICAoKSA9PiBnZXRJbnB1dEJvcmRlckNsYXNzKGJvcmRlclR5cGUsIGJvcmRlckNvbG9yLCB0ZXh0Q29sb3IsIHBsYWNlaG9sZGVyQ29sb3IpLFxuICAgIFtib3JkZXJUeXBlLCBib3JkZXJDb2xvciwgdGV4dENvbG9yLCBwbGFjZWhvbGRlckNvbG9yXVxuICApO1xuXG4gIGNvbnN0IGlucHV0Q2xhc3NlcyA9IHVzZU1lbW8oXG4gICAgKCkgPT4gY24oXG4gICAgICBjbGFzc05hbWUsXG4gICAgICBkaXNhYmxlZCA/ICd0ZXh0LW5ldXRyYWwvMzAgZGFyazp0ZXh0LW5ldXRyYWwtZGFyay8zMCBvdXRsaW5lLW5ldXRyYWwvMzAgZGFyazpvdXRsaW5lLW5ldXRyYWwtZGFyay8zMCcgOiBib3JkZXJDbGFzc2VzLFxuICAgICAgbXVsdGlsaW5lICYmICdtaW4taC1bMTAwcHhdIHJlc2l6ZS15J1xuICAgICksXG4gICAgW2NsYXNzTmFtZSwgYm9yZGVyQ2xhc3NlcywgZGlzYWJsZWQsIG11bHRpbGluZV1cbiAgKTtcblxuICByZXR1cm4gbXVsdGlsaW5lID8gKFxuICAgIDx0ZXh0YXJlYVxuICAgICAgey4uLmlucHV0UHJvcHMgYXMgVGV4dGFyZWFIVE1MQXR0cmlidXRlczxIVE1MVGV4dEFyZWFFbGVtZW50Pn1cbiAgICAgIGNsYXNzTmFtZT17aW5wdXRDbGFzc2VzfVxuICAgICAgZGlzYWJsZWQ9e2Rpc2FibGVkfVxuICAgICAgcmVmPXtyZWYgYXMgUmVmPEhUTUxUZXh0QXJlYUVsZW1lbnQ+fVxuICAgIC8+XG4gICkgOiAoXG4gICAgPGlucHV0XG4gICAgICB7Li4uaW5wdXRQcm9wcyBhcyBJbnB1dEhUTUxBdHRyaWJ1dGVzPEhUTUxJbnB1dEVsZW1lbnQ+fVxuICAgICAgY2xhc3NOYW1lPXtpbnB1dENsYXNzZXN9XG4gICAgICBkaXNhYmxlZD17ZGlzYWJsZWR9XG4gICAgICByZWY9e3JlZiBhcyBSZWY8SFRNTElucHV0RWxlbWVudD59XG4gICAgLz5cbiAgKTtcbn0pOyJdLCJuYW1lcyI6WyJjbiIsImZvcndhcmRSZWYiLCJ1c2VNZW1vIiwiZ2V0Qm9yZGVyQ2xhc3NlcyIsImdldE91dGxpbmVDbGFzc2VzIiwiZ2V0UGxhY2Vob2xkZXJDbGFzc2VzIiwiZ2V0VGV4dENsYXNzZXMiLCJiYXNlQ2xhc3NlcyIsIm5vbmUiLCJyb3VuZGVkIiwic29saWQiLCJ1bmRlcmxpbmUiLCJnZXRJbnB1dEJvcmRlckNsYXNzIiwiYm9yZGVyVHlwZSIsImJvcmRlckNvbG9yIiwidGV4dENvbG9yIiwicGxhY2Vob2xkZXJDb2xvciIsImhhc0ZvY3VzIiwiaGFzSG92ZXIiLCJJbnB1dEZpZWxkIiwiY2xhc3NOYW1lIiwiZGlzYWJsZWQiLCJsYWJlbCIsIm11bHRpbGluZSIsImlucHV0UHJvcHMiLCJyZWYiLCJib3JkZXJDbGFzc2VzIiwiaW5wdXRDbGFzc2VzIiwidGV4dGFyZWEiLCJpbnB1dCJdLCJtYXBwaW5ncyI6IjtBQUFBOzs7Q0FHQyxHQUNELFNBQVFBLEVBQUUsUUFBTyxlQUFlO0FBQ2hDLFNBQVFDLFVBQVUsRUFBRUMsT0FBTyxRQUFPLFFBQVE7QUFFMUMsU0FDRUMsZ0JBQWdCLEVBQ2hCQyxpQkFBaUIsRUFDakJDLHFCQUFxQixFQUNyQkMsY0FBYyxRQUNULDRCQUE0QjtBQWtCbkMsT0FBTyxNQUFNQyxjQUFjO0lBQ3pCQyxNQUFNO0lBQ05DLFNBQVM7SUFDVEMsT0FBTztJQUNQQyxXQUFXO0FBQ2IsRUFBRTtBQUVGLE9BQU8sTUFBTUMsc0JBQXNCLENBQ2pDQyxZQUNBQyxhQUNBQyxXQUNBQyxtQkFDR2hCLEdBQ0hPLFdBQVcsQ0FBQ00sV0FBVyxFQUN2QlAsZUFBZVMsWUFDZkYsZUFBZSxjQUNYVixpQkFBaUJXLGFBQWE7UUFBQ0csVUFBVTtRQUFNQyxVQUFVO0lBQUksS0FDN0QsSUFDSkwsZUFBZSxhQUFhQSxlQUFlLFVBQ3ZDVCxrQkFBa0JVLGFBQWE7UUFBQ0csVUFBVTtRQUFNQyxVQUFVO0lBQUksS0FDOUQsSUFDSmIsc0JBQXNCVyxrQkFBa0I7UUFBQ0MsVUFBVTtRQUFNQyxVQUFVO0lBQUksSUFDdkU7QUFFRixPQUFPLE1BQU1DLDJCQUFhbEIsV0FBb0UsQ0FBQyxFQUM3RmEsY0FBYyxTQUFTLEVBQ3ZCRCxhQUFhLE9BQU8sRUFDcEJPLFNBQVMsRUFDVEMsV0FBVyxLQUFLLEVBQ2hCQyxLQUFLLEVBQ0xDLFlBQVksS0FBSyxFQUNqQlAsbUJBQW1CLFNBQVMsRUFDNUJELFlBQVksU0FBUyxFQUNyQixHQUFHUyxZQUNKLEVBQUVDO0lBQ0QsTUFBTUMsZ0JBQWdCeEIsUUFDcEIsSUFBTVUsb0JBQW9CQyxZQUFZQyxhQUFhQyxXQUFXQyxtQkFDOUQ7UUFBQ0g7UUFBWUM7UUFBYUM7UUFBV0M7S0FBaUI7SUFHeEQsTUFBTVcsZUFBZXpCLFFBQ25CLElBQU1GLEdBQ0pvQixXQUNBQyxXQUFXLDhGQUE4RkssZUFDekdILGFBQWEsMkJBRWY7UUFBQ0g7UUFBV007UUFBZUw7UUFBVUU7S0FBVTtJQUdqRCxPQUFPQSwwQkFDTCxLQUFDSztRQUNFLEdBQUdKLFVBQVU7UUFDZEosV0FBV087UUFDWE4sVUFBVUE7UUFDVkksS0FBS0E7dUJBR1AsS0FBQ0k7UUFDRSxHQUFHTCxVQUFVO1FBQ2RKLFdBQVdPO1FBQ1hOLFVBQVVBO1FBQ1ZJLEtBQUtBOztBQUdYLEdBQUcifQ==