@paolojulian.dev/design-system 4.2.1 → 4.2.2
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.
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.d.ts +10 -2
- package/dist/index.es.js +92 -90
- package/dist/index.es.js.map +1 -1
- package/dist/style.css +1 -1
- package/package.json +1 -1
package/dist/index.cjs.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),u=require("./utils.cjs.js"),j=require("react"),O=({children:t,gap:n=void 0,alignItems:e=void 0,justifyContent:a=void 0,className:o=""})=>i.jsx("div",{className:u.cn("flex flex-row",o),style:{gap:n,alignItems:e,justifyContent:a},children:t}),C=({children:t,gap:n=void 0,alignItems:e=void 0,justifyContent:a=void 0,className:o=""})=>i.jsx("div",{className:u.cn("flex flex-col",o),style:{gap:n,alignItems:e,justifyContent:a},children:t});function I(t){var n,e,a="";if(typeof t=="string"||typeof t=="number")a+=t;else if(typeof t=="object")if(Array.isArray(t))for(n=0;n<t.length;n++)t[n]&&(e=I(t[n]))&&(a&&(a+=" "),a+=e);else for(n in t)t[n]&&(a&&(a+=" "),a+=n);return a}function R(){for(var t,n,e=0,a="";e<arguments.length;)(t=arguments[e++])&&(n=I(t))&&(a&&(a+=" "),a+=n);return a}const N=t=>typeof t=="boolean"?"".concat(t):t===0?"0":t,P=R,L=(t,n)=>e=>{var a;if((n==null?void 0:n.variants)==null)return P(t,e==null?void 0:e.class,e==null?void 0:e.className);const{variants:o,defaultVariants:p}=n,l=Object.keys(o).map(r=>{const d=e==null?void 0:e[r],f=p==null?void 0:p[r];if(d===null)return null;const s=N(d)||N(f);return o[r][s]}),x=e&&Object.entries(e).reduce((r,d)=>{let[f,s]=d;return s===void 0||(r[f]=s),r},{}),v=n==null||(a=n.compoundVariants)===null||a===void 0?void 0:a.reduce((r,d)=>{let{class:f,className:s,...y}=d;return Object.entries(y).every(w=>{let[c,m]=w;return Array.isArray(m)?m.includes({...p,...x}[c]):{...p,...x}[c]===m})?[...r,f,s]:r},[]);return P(t,l,v,e==null?void 0:e.class,e==null?void 0:e.className)},M={serif:"font-serif",body:"text-base","body-wide":"text-sm tracking-[0.40em] font-medium",heading:"text-[1.5rem] md:text-4xl tracking-[-0.04em] font-medium","heading-lg":"text-[2.5rem] md:text-[4rem] tracking-[-0.04em] font-medium leading-[2.75rem] md:leading-[4.5rem]","heading-xl":"text-[4rem] md:text-[7rem] tracking-[-0.04em] leading-[3.5rem] md:leading-[5.5rem] font-medium"},H=L("font-sans",{variants:{variant:M},defaultVariants:{variant:"body"}});function S({as:t="p",children:n,className:e="",variant:a,...o}){return i.jsx(t,{className:u.cn(H({variant:a,className:e})),...o,children:n})}function W({title:t}){return i.jsx(C,{className:"pt-2 border-t border-white text-white",children:i.jsx(S,{className:"uppercase",variant:"body-wide",children:t})})}function $(){return i.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",focusable:"false",children:[i.jsx("path",{d:"M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z"}),i.jsx("circle",{cx:"12",cy:"12",r:"3"})]})}function F(){return i.jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",focusable:"false",children:[i.jsx("path",{d:"M9.88 9.88a3 3 0 1 0 4.24 4.24"}),i.jsx("path",{d:"M10.73 5.08A10.43 10.43 0 0 1 12 5c7 0 10 7 10 7a13.16 13.16 0 0 1-1.67 2.68"}),i.jsx("path",{d:"M6.61 6.61A13.526 13.526 0 0 0 2 12s3 7 10 7a9.74 9.74 0 0 0 5.39-1.61"}),i.jsx("line",{x1:"2",x2:"22",y1:"2",y2:"22"})]})}const V=j.forwardRef(({className:t,inputClassName:n,type:e,label:a,helperText:o,id:p,isError:l=!1,errorMessage:x,rightAdornment:v,disabled:r,readOnly:d,style:f,...s},y)=>{const w=j.useId(),c=p??w,m=`${c}-error`,k=`${c}-helper`,h=e==="password",g=!!v&&!h,[b,T]=j.useState(!1),A=h?b?"text":"password":e??"text",q=[l&&x?m:null,!l&&o?k:null].filter(Boolean).join(" ")||void 0;return i.jsxs("div",{className:u.cn("p-text-input relative w-full",t),style:f,children:[i.jsx("input",{...s,id:c,ref:y,type:A,disabled:r,readOnly:d,placeholder:" ","aria-invalid":l||void 0,"aria-describedby":q,"aria-required":s.required,"aria-disabled":r,"aria-readonly":d,autoComplete:s.autoComplete??(h?"current-password":void 0),className:u.cn("peer h-16 w-full rounded px-4 pt-6 pb-2",(h||g)&&"pr-12","bg-(--p-input-bg) text-(--p-input-text)","font-sans text-sm outline-none","border border-(--p-input-border) focus:border-(--p-input-border-focus)","focus:bg-(--p-input-bg-focus)","focus:ring-2 focus:ring-(--p-input-ring)","transition-all duration-150 ease-in","disabled:cursor-not-allowed disabled:opacity-50","read-only:cursor-default read-only:bg-(--p-input-bg-readonly)",l&&"ring-2 ring-red-500",g&&e==="date"&&"[&::-webkit-calendar-picker-indicator]:absolute [&::-webkit-calendar-picker-indicator]:right-0 [&::-webkit-calendar-picker-indicator]:h-full [&::-webkit-calendar-picker-indicator]:w-full [&::-webkit-calendar-picker-indicator]:cursor-pointer [&::-webkit-calendar-picker-indicator]:opacity-0",n)}),i.jsx("span",{"aria-hidden":"true",className:u.cn("pointer-events-none absolute top-2 left-4","font-sans text-xs","origin-left transition-all duration-150 ease-in","scale-0 opacity-0",l?"text-red-500":"text-(--p-input-label) peer-focus:text-(--p-input-label-focus)","peer-focus:scale-100 peer-focus:opacity-100","peer-not-placeholder-shown:scale-100 peer-not-placeholder-shown:opacity-100"),children:a}),i.jsx("label",{htmlFor:c,className:u.cn("pointer-events-none absolute top-1/2 left-4 -translate-y-1/2","font-sans text-sm text-(--p-input-text)","origin-left transition-all duration-150 ease-in","peer-focus:scale-0 peer-focus:opacity-0","peer-not-placeholder-shown:scale-0 peer-not-placeholder-shown:opacity-0",r&&"opacity-50"),children:a}),h&&i.jsx("button",{type:"button",onClick:()=>T(B=>!B),disabled:r,className:u.cn("absolute top-1/2 right-4 -translate-y-1/2","text-(--p-input-label) hover:text-(--p-input-text)","transition-colors duration-150","focus-visible:outline-2 focus-visible:outline-offset-2","focus-visible:outline-(--p-input-ring)","disabled:pointer-events-none disabled:opacity-50"),"aria-label":b?"Hide password":"Show password","aria-pressed":b,"aria-controls":c,children:b?i.jsx($,{}):i.jsx(F,{})}),g&&i.jsx("span",{"aria-hidden":"true",className:"pointer-events-none absolute top-1/2 right-4 -translate-y-1/2 text-(--p-input-label)",children:v}),l&&x&&i.jsx("p",{id:m,role:"alert",className:"mt-1 px-4 font-sans text-xs text-red-500",children:x}),!l&&o&&i.jsx("p",{id:k,className:"mt-1 px-4 font-sans text-xs text-(--p-input-text-helper)",children:o})]})});V.displayName="PTextInput";exports.PSectionHeader=W;exports.PTextInput=V;exports.PTypography=S;exports.Row=O;exports.Stack=C;
|
|
2
2
|
//# sourceMappingURL=index.cjs.js.map
|
package/dist/index.cjs.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs.js","sources":["../src/components/PContainers/Row/Row.tsx","../src/components/PContainers/Stack/Stack.tsx","../node_modules/class-variance-authority/node_modules/clsx/dist/clsx.mjs","../node_modules/class-variance-authority/dist/index.mjs","../src/components/PTypography/PTypography.constants.ts","../src/components/PTypography/PTypography.tsx","../src/components/PSectionHeader/PSectionHeader.tsx","../src/components/PTextInput/PTextInput.tsx"],"sourcesContent":["import { CSSProperties, FC, ReactNode } from 'react';\nimport cn from '../../../utils/cn';\n\nexport type RowProps = {\n children: ReactNode;\n gap?: CSSProperties['gap'];\n alignItems?: CSSProperties['alignItems'];\n justifyContent?: CSSProperties['justifyContent'];\n className?: string;\n};\n\nconst Row: FC<RowProps> = ({\n children,\n gap = undefined,\n alignItems = undefined,\n justifyContent = undefined,\n className = '',\n}) => {\n return (\n <div\n className={cn('flex flex-row', className)}\n style={{\n gap,\n alignItems,\n justifyContent,\n }}\n >\n {children}\n </div>\n );\n};\n\nexport default Row;\n","import { CSSProperties, FC, ReactNode } from 'react';\nimport cn from '../../../utils/cn';\n\nexport type StackProps = {\n children: ReactNode;\n gap?: CSSProperties['gap'];\n alignItems?: CSSProperties['alignItems'];\n justifyContent?: CSSProperties['justifyContent'];\n className?: string;\n};\n\nconst Stack: FC<StackProps> = ({\n children,\n gap = undefined,\n alignItems = undefined,\n justifyContent = undefined,\n className = '',\n}) => {\n return (\n <div\n className={cn('flex flex-col', className)}\n style={{\n gap,\n alignItems,\n justifyContent,\n }}\n >\n {children}\n </div>\n );\n};\n\nexport default Stack;\n","function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f);else for(t in e)e[t]&&(n&&(n+=\" \"),n+=t);return n}export function clsx(){for(var e,t,f=0,n=\"\";f<arguments.length;)(e=arguments[f++])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","import { clsx } from \"clsx\";\nconst falsyToString = (value)=>typeof value === \"boolean\" ? \"\".concat(value) : value === 0 ? \"0\" : value;\nexport const cx = clsx;\nexport const cva = (base, config)=>{\n return (props)=>{\n var ref;\n if ((config === null || config === void 0 ? void 0 : config.variants) == null) return cx(base, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);\n const { variants , defaultVariants } = config;\n const getVariantClassNames = Object.keys(variants).map((variant)=>{\n const variantProp = props === null || props === void 0 ? void 0 : props[variant];\n const defaultVariantProp = defaultVariants === null || defaultVariants === void 0 ? void 0 : defaultVariants[variant];\n if (variantProp === null) return null;\n const variantKey = falsyToString(variantProp) || falsyToString(defaultVariantProp);\n return variants[variant][variantKey];\n });\n const propsWithoutUndefined = props && Object.entries(props).reduce((acc, param)=>{\n let [key, value] = param;\n if (value === undefined) {\n return acc;\n }\n acc[key] = value;\n return acc;\n }, {});\n const getCompoundVariantClassNames = config === null || config === void 0 ? void 0 : (ref = config.compoundVariants) === null || ref === void 0 ? void 0 : ref.reduce((acc, param1)=>{\n let { class: cvClass , className: cvClassName , ...compoundVariantOptions } = param1;\n return Object.entries(compoundVariantOptions).every((param)=>{\n let [key, value] = param;\n return Array.isArray(value) ? value.includes({\n ...defaultVariants,\n ...propsWithoutUndefined\n }[key]) : ({\n ...defaultVariants,\n ...propsWithoutUndefined\n })[key] === value;\n }) ? [\n ...acc,\n cvClass,\n cvClassName\n ] : acc;\n }, []);\n return cx(base, getVariantClassNames, getCompoundVariantClassNames, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);\n };\n};\n\n\n//# sourceMappingURL=index.mjs.map","import { cva } from 'class-variance-authority';\n\ntype FontVariants =\n | 'serif'\n | 'body'\n | 'body-wide'\n | 'heading'\n | 'heading-lg'\n | 'heading-xl';\n\nconst fontVariantsMap = {\n serif: 'font-serif',\n body: 'text-base',\n 'body-wide': 'text-sm tracking-[0.40em] font-medium',\n heading: 'text-[1.5rem] md:text-4xl tracking-[-0.04em] font-medium',\n 'heading-lg':\n 'text-[2.5rem] md:text-[4rem] tracking-[-0.04em] font-medium leading-[2.75rem] md:leading-[4.5rem]',\n 'heading-xl':\n 'text-[4rem] md:text-[7rem] tracking-[-0.04em] leading-[3.5rem] md:leading-[5.5rem] font-medium',\n} satisfies Record<FontVariants, string>;\n\nexport const PTypographyVariants = cva('font-sans', {\n variants: {\n variant: fontVariantsMap,\n },\n defaultVariants: {\n variant: 'body',\n },\n});\n","import { VariantProps } from 'class-variance-authority';\nimport { HTMLAttributes } from 'react';\nimport '../../index.css';\nimport cn from '../../utils/cn';\nimport { PTypographyVariants } from './PTypography.constants';\n\nexport interface PTypographyProps\n extends VariantProps<typeof PTypographyVariants>,\n HTMLAttributes<HTMLElement> {\n as?: React.ElementType;\n children: React.ReactNode;\n}\n\nexport default function PTypography({\n as: Element = 'p',\n children,\n className = '',\n variant,\n ...props\n}: PTypographyProps) {\n return (\n <Element\n className={cn(PTypographyVariants({ variant, className }))}\n {...props}\n >\n {children}\n </Element>\n );\n}\n","import { Stack } from '../PContainers';\nimport { PTypography } from '../PTypography';\n\ninterface Props {\n title: string;\n}\n\nexport default function PSectionHeader({ title }: Props) {\n return (\n <Stack className='pt-2 border-t border-white text-white'>\n <PTypography className='uppercase' variant='body-wide'>\n {title}\n </PTypography>\n </Stack>\n );\n}\n","import { forwardRef, type InputHTMLAttributes, type ReactNode, useId, useState } from 'react';\nimport '../../index.css';\nimport cn from '../../utils/cn';\n\nexport type PTextInputRef = HTMLInputElement;\n\nexport type PTextInputProps = {\n /** Applied to the root wrapper element. */\n className?: string;\n /** Applied to the inner `<input>` element for layout / spacing overrides. */\n inputClassName?: string;\n /** Visible label — doubles as the floating label and the placeholder. */\n label: string;\n /** Shown below the field when there is no error. */\n helperText?: string;\n isError?: boolean;\n /** Shown below the field when `isError` is true. Announced immediately via `role=\"alert\"`. */\n errorMessage?: string;\n /** Decorative element placed on the trailing edge. Ignored when `type=\"password\"`. */\n rightAdornment?: ReactNode;\n} & Omit<\n InputHTMLAttributes<HTMLInputElement>,\n 'className' | 'placeholder' | 'aria-label' | 'aria-describedby'\n>;\n\n// ─── Inline SVG icons ────────────────────────────────────────────────────────\n\nfunction EyeIcon() {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n aria-hidden=\"true\"\n focusable=\"false\"\n >\n <path d=\"M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z\" />\n <circle cx=\"12\" cy=\"12\" r=\"3\" />\n </svg>\n );\n}\n\nfunction EyeOffIcon() {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n aria-hidden=\"true\"\n focusable=\"false\"\n >\n <path d=\"M9.88 9.88a3 3 0 1 0 4.24 4.24\" />\n <path d=\"M10.73 5.08A10.43 10.43 0 0 1 12 5c7 0 10 7 10 7a13.16 13.16 0 0 1-1.67 2.68\" />\n <path d=\"M6.61 6.61A13.526 13.526 0 0 0 2 12s3 7 10 7a9.74 9.74 0 0 0 5.39-1.61\" />\n <line x1=\"2\" x2=\"22\" y1=\"2\" y2=\"22\" />\n </svg>\n );\n}\n\n// ─── Component ───────────────────────────────────────────────────────────────\n\nexport const PTextInput = forwardRef<PTextInputRef, PTextInputProps>(\n (\n {\n className,\n inputClassName,\n type,\n label,\n helperText,\n id,\n isError = false,\n errorMessage,\n rightAdornment,\n disabled,\n readOnly,\n style,\n ...props\n },\n ref,\n ) => {\n const generatedId = useId();\n const inputId = id ?? generatedId;\n const errorId = `${inputId}-error`;\n const helperId = `${inputId}-helper`;\n\n const isPassword = type === 'password';\n const hasRightAdornment = Boolean(rightAdornment) && !isPassword;\n const [showPassword, setShowPassword] = useState(false);\n\n const inputType = isPassword ? (showPassword ? 'text' : 'password') : (type ?? 'text');\n\n const describedBy = [\n isError && errorMessage ? errorId : null,\n !isError && helperText ? helperId : null,\n ]\n .filter(Boolean)\n .join(' ') || undefined;\n\n return (\n <div className={cn('relative w-full', className)} style={style}>\n <input\n {...props}\n id={inputId}\n ref={ref}\n type={inputType}\n disabled={disabled}\n readOnly={readOnly}\n // Empty string required for the CSS peer-not-placeholder-shown trick.\n placeholder=\" \"\n // Accessibility\n aria-invalid={isError || undefined}\n aria-describedby={describedBy}\n aria-required={props.required}\n aria-disabled={disabled}\n aria-readonly={readOnly}\n autoComplete={props.autoComplete ?? (isPassword ? 'current-password' : undefined)}\n className={cn(\n // Layout — tall enough for the floating label + value\n 'peer h-16 w-full rounded px-4 pt-6 pb-2',\n (isPassword || hasRightAdornment) && 'pr-12',\n // Visuals\n 'bg-white text-black',\n 'font-sans text-sm outline-none',\n 'border border-black focus:border-black',\n // Focus\n 'focus:ring-2 focus:ring-primary',\n // Motion\n 'transition-all duration-150 ease-in',\n // States\n 'disabled:cursor-not-allowed disabled:opacity-50',\n 'read-only:cursor-default read-only:bg-gray-lighter',\n isError && 'ring-2 ring-red-500',\n // Date — hide native picker chrome so rightAdornment can replace it\n hasRightAdornment &&\n type === 'date' &&\n '[&::-webkit-calendar-picker-indicator]:absolute [&::-webkit-calendar-picker-indicator]:right-0 [&::-webkit-calendar-picker-indicator]:h-full [&::-webkit-calendar-picker-indicator]:w-full [&::-webkit-calendar-picker-indicator]:cursor-pointer [&::-webkit-calendar-picker-indicator]:opacity-0',\n inputClassName,\n )}\n />\n\n {/*\n * Floating label — shown above the value when focused or filled.\n * aria-hidden: the <label> below already provides the accessible name.\n */}\n <span\n aria-hidden=\"true\"\n className={cn(\n 'pointer-events-none absolute top-2 left-4',\n 'font-sans text-xs',\n 'origin-left transition-all duration-150 ease-in',\n // Hidden by default\n 'scale-0 opacity-0',\n isError\n ? 'text-red-500'\n : 'text-gray-darker peer-focus:text-primary',\n // Reveal when focused or filled\n 'peer-focus:scale-100 peer-focus:opacity-100',\n 'peer-not-placeholder-shown:scale-100 peer-not-placeholder-shown:opacity-100',\n )}\n >\n {label}\n </span>\n\n {/*\n * Placeholder label — centered in the field when empty and unfocused.\n * pointer-events-none lets clicks fall through to the input beneath;\n * htmlFor still wires up the accessible name correctly.\n */}\n <label\n htmlFor={inputId}\n className={cn(\n 'pointer-events-none absolute top-1/2 left-4 -translate-y-1/2',\n 'font-sans text-sm text-black',\n 'origin-left transition-all duration-150 ease-in',\n // Collapse when focused or filled\n 'peer-focus:scale-0 peer-focus:opacity-0',\n 'peer-not-placeholder-shown:scale-0 peer-not-placeholder-shown:opacity-0',\n disabled && 'opacity-50',\n )}\n >\n {label}\n </label>\n\n {/* Password toggle */}\n {isPassword && (\n <button\n type=\"button\"\n onClick={() => setShowPassword((v) => !v)}\n disabled={disabled}\n className={cn(\n 'absolute top-1/2 right-4 -translate-y-1/2',\n 'text-gray-darker hover:text-black',\n 'transition-colors duration-150',\n 'focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary',\n 'disabled:pointer-events-none disabled:opacity-50',\n )}\n aria-label={showPassword ? 'Hide password' : 'Show password'}\n aria-pressed={showPassword}\n aria-controls={inputId}\n >\n {showPassword ? <EyeIcon /> : <EyeOffIcon />}\n </button>\n )}\n\n {/* Right adornment — decorative, hidden from assistive tech */}\n {hasRightAdornment && (\n <span\n aria-hidden=\"true\"\n className=\"pointer-events-none absolute top-1/2 right-4 -translate-y-1/2 text-gray-darker\"\n >\n {rightAdornment}\n </span>\n )}\n\n {/* Error message — announced immediately via role=\"alert\" */}\n {isError && errorMessage && (\n <p id={errorId} role=\"alert\" className=\"mt-1 px-4 font-sans text-xs text-red-500\">\n {errorMessage}\n </p>\n )}\n\n {/* Helper text — visible only when there is no error */}\n {!isError && helperText && (\n <p id={helperId} className=\"mt-1 px-4 font-sans text-xs text-gray-darker\">\n {helperText}\n </p>\n )}\n </div>\n );\n },\n);\n\nPTextInput.displayName = 'PTextInput';\n"],"names":["Row","children","gap","alignItems","justifyContent","className","jsx","cn","Stack","r","e","t","f","n","clsx","falsyToString","value","cx","cva","base","config","props","ref","variants","defaultVariants","getVariantClassNames","variant","variantProp","defaultVariantProp","variantKey","propsWithoutUndefined","acc","param","key","getCompoundVariantClassNames","param1","cvClass","cvClassName","compoundVariantOptions","fontVariantsMap","PTypographyVariants","PTypography","Element","PSectionHeader","title","EyeIcon","jsxs","EyeOffIcon","PTextInput","forwardRef","inputClassName","type","label","helperText","id","isError","errorMessage","rightAdornment","disabled","readOnly","style","generatedId","useId","inputId","errorId","helperId","isPassword","hasRightAdornment","showPassword","setShowPassword","useState","inputType","describedBy","v"],"mappings":"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","x_google_ignoreList":[2,3]}
|
|
1
|
+
{"version":3,"file":"index.cjs.js","sources":["../src/components/PContainers/Row/Row.tsx","../src/components/PContainers/Stack/Stack.tsx","../node_modules/class-variance-authority/node_modules/clsx/dist/clsx.mjs","../node_modules/class-variance-authority/dist/index.mjs","../src/components/PTypography/PTypography.constants.ts","../src/components/PTypography/PTypography.tsx","../src/components/PSectionHeader/PSectionHeader.tsx","../src/components/PTextInput/PTextInput.tsx"],"sourcesContent":["import { CSSProperties, FC, ReactNode } from 'react';\nimport cn from '../../../utils/cn';\n\nexport type RowProps = {\n children: ReactNode;\n gap?: CSSProperties['gap'];\n alignItems?: CSSProperties['alignItems'];\n justifyContent?: CSSProperties['justifyContent'];\n className?: string;\n};\n\nconst Row: FC<RowProps> = ({\n children,\n gap = undefined,\n alignItems = undefined,\n justifyContent = undefined,\n className = '',\n}) => {\n return (\n <div\n className={cn('flex flex-row', className)}\n style={{\n gap,\n alignItems,\n justifyContent,\n }}\n >\n {children}\n </div>\n );\n};\n\nexport default Row;\n","import { CSSProperties, FC, ReactNode } from 'react';\nimport cn from '../../../utils/cn';\n\nexport type StackProps = {\n children: ReactNode;\n gap?: CSSProperties['gap'];\n alignItems?: CSSProperties['alignItems'];\n justifyContent?: CSSProperties['justifyContent'];\n className?: string;\n};\n\nconst Stack: FC<StackProps> = ({\n children,\n gap = undefined,\n alignItems = undefined,\n justifyContent = undefined,\n className = '',\n}) => {\n return (\n <div\n className={cn('flex flex-col', className)}\n style={{\n gap,\n alignItems,\n justifyContent,\n }}\n >\n {children}\n </div>\n );\n};\n\nexport default Stack;\n","function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e))for(t=0;t<e.length;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f);else for(t in e)e[t]&&(n&&(n+=\" \"),n+=t);return n}export function clsx(){for(var e,t,f=0,n=\"\";f<arguments.length;)(e=arguments[f++])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","import { clsx } from \"clsx\";\nconst falsyToString = (value)=>typeof value === \"boolean\" ? \"\".concat(value) : value === 0 ? \"0\" : value;\nexport const cx = clsx;\nexport const cva = (base, config)=>{\n return (props)=>{\n var ref;\n if ((config === null || config === void 0 ? void 0 : config.variants) == null) return cx(base, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);\n const { variants , defaultVariants } = config;\n const getVariantClassNames = Object.keys(variants).map((variant)=>{\n const variantProp = props === null || props === void 0 ? void 0 : props[variant];\n const defaultVariantProp = defaultVariants === null || defaultVariants === void 0 ? void 0 : defaultVariants[variant];\n if (variantProp === null) return null;\n const variantKey = falsyToString(variantProp) || falsyToString(defaultVariantProp);\n return variants[variant][variantKey];\n });\n const propsWithoutUndefined = props && Object.entries(props).reduce((acc, param)=>{\n let [key, value] = param;\n if (value === undefined) {\n return acc;\n }\n acc[key] = value;\n return acc;\n }, {});\n const getCompoundVariantClassNames = config === null || config === void 0 ? void 0 : (ref = config.compoundVariants) === null || ref === void 0 ? void 0 : ref.reduce((acc, param1)=>{\n let { class: cvClass , className: cvClassName , ...compoundVariantOptions } = param1;\n return Object.entries(compoundVariantOptions).every((param)=>{\n let [key, value] = param;\n return Array.isArray(value) ? value.includes({\n ...defaultVariants,\n ...propsWithoutUndefined\n }[key]) : ({\n ...defaultVariants,\n ...propsWithoutUndefined\n })[key] === value;\n }) ? [\n ...acc,\n cvClass,\n cvClassName\n ] : acc;\n }, []);\n return cx(base, getVariantClassNames, getCompoundVariantClassNames, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);\n };\n};\n\n\n//# sourceMappingURL=index.mjs.map","import { cva } from 'class-variance-authority';\n\ntype FontVariants =\n | 'serif'\n | 'body'\n | 'body-wide'\n | 'heading'\n | 'heading-lg'\n | 'heading-xl';\n\nconst fontVariantsMap = {\n serif: 'font-serif',\n body: 'text-base',\n 'body-wide': 'text-sm tracking-[0.40em] font-medium',\n heading: 'text-[1.5rem] md:text-4xl tracking-[-0.04em] font-medium',\n 'heading-lg':\n 'text-[2.5rem] md:text-[4rem] tracking-[-0.04em] font-medium leading-[2.75rem] md:leading-[4.5rem]',\n 'heading-xl':\n 'text-[4rem] md:text-[7rem] tracking-[-0.04em] leading-[3.5rem] md:leading-[5.5rem] font-medium',\n} satisfies Record<FontVariants, string>;\n\nexport const PTypographyVariants = cva('font-sans', {\n variants: {\n variant: fontVariantsMap,\n },\n defaultVariants: {\n variant: 'body',\n },\n});\n","import { VariantProps } from 'class-variance-authority';\nimport { HTMLAttributes } from 'react';\nimport '../../index.css';\nimport cn from '../../utils/cn';\nimport { PTypographyVariants } from './PTypography.constants';\n\nexport interface PTypographyProps\n extends VariantProps<typeof PTypographyVariants>,\n HTMLAttributes<HTMLElement> {\n as?: React.ElementType;\n children: React.ReactNode;\n}\n\nexport default function PTypography({\n as: Element = 'p',\n children,\n className = '',\n variant,\n ...props\n}: PTypographyProps) {\n return (\n <Element\n className={cn(PTypographyVariants({ variant, className }))}\n {...props}\n >\n {children}\n </Element>\n );\n}\n","import { Stack } from '../PContainers';\nimport { PTypography } from '../PTypography';\n\ninterface Props {\n title: string;\n}\n\nexport default function PSectionHeader({ title }: Props) {\n return (\n <Stack className='pt-2 border-t border-white text-white'>\n <PTypography className='uppercase' variant='body-wide'>\n {title}\n </PTypography>\n </Stack>\n );\n}\n","import { forwardRef, type InputHTMLAttributes, type ReactNode, useId, useState } from 'react';\nimport './PTextInput.css';\nimport cn from '../../utils/cn';\n\nexport type PTextInputRef = HTMLInputElement;\n\nexport type PTextInputProps = {\n /**\n * Applied to the root wrapper element.\n * Override design tokens via CSS custom properties, e.g.:\n * `[--p-input-ring:blue] [--p-input-bg:#f5f5f5]`\n */\n className?: string;\n /** Applied to the inner `<input>` element for layout / spacing overrides. */\n inputClassName?: string;\n /** Visible label — doubles as the floating label and the placeholder. */\n label: string;\n /** Shown below the field when there is no error. */\n helperText?: string;\n isError?: boolean;\n /** Shown below the field when `isError` is true. Announced immediately via `role=\"alert\"`. */\n errorMessage?: string;\n /** Decorative element placed on the trailing edge. Ignored when `type=\"password\"`. */\n rightAdornment?: ReactNode;\n} & Omit<\n InputHTMLAttributes<HTMLInputElement>,\n 'className' | 'placeholder' | 'aria-label' | 'aria-describedby'\n>;\n\n// ─── Inline SVG icons ────────────────────────────────────────────────────────\n\nfunction EyeIcon() {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n aria-hidden=\"true\"\n focusable=\"false\"\n >\n <path d=\"M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z\" />\n <circle cx=\"12\" cy=\"12\" r=\"3\" />\n </svg>\n );\n}\n\nfunction EyeOffIcon() {\n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n aria-hidden=\"true\"\n focusable=\"false\"\n >\n <path d=\"M9.88 9.88a3 3 0 1 0 4.24 4.24\" />\n <path d=\"M10.73 5.08A10.43 10.43 0 0 1 12 5c7 0 10 7 10 7a13.16 13.16 0 0 1-1.67 2.68\" />\n <path d=\"M6.61 6.61A13.526 13.526 0 0 0 2 12s3 7 10 7a9.74 9.74 0 0 0 5.39-1.61\" />\n <line x1=\"2\" x2=\"22\" y1=\"2\" y2=\"22\" />\n </svg>\n );\n}\n\n// ─── Component ───────────────────────────────────────────────────────────────\n\nexport const PTextInput = forwardRef<PTextInputRef, PTextInputProps>(\n (\n {\n className,\n inputClassName,\n type,\n label,\n helperText,\n id,\n isError = false,\n errorMessage,\n rightAdornment,\n disabled,\n readOnly,\n style,\n ...props\n },\n ref,\n ) => {\n const generatedId = useId();\n const inputId = id ?? generatedId;\n const errorId = `${inputId}-error`;\n const helperId = `${inputId}-helper`;\n\n const isPassword = type === 'password';\n const hasRightAdornment = Boolean(rightAdornment) && !isPassword;\n const [showPassword, setShowPassword] = useState(false);\n\n const inputType = isPassword ? (showPassword ? 'text' : 'password') : (type ?? 'text');\n\n const describedBy = [\n isError && errorMessage ? errorId : null,\n !isError && helperText ? helperId : null,\n ]\n .filter(Boolean)\n .join(' ') || undefined;\n\n return (\n <div className={cn('p-text-input relative w-full', className)} style={style}>\n <input\n {...props}\n id={inputId}\n ref={ref}\n type={inputType}\n disabled={disabled}\n readOnly={readOnly}\n // Empty string required for the CSS peer-not-placeholder-shown trick.\n placeholder=\" \"\n // Accessibility\n aria-invalid={isError || undefined}\n aria-describedby={describedBy}\n aria-required={props.required}\n aria-disabled={disabled}\n aria-readonly={readOnly}\n autoComplete={props.autoComplete ?? (isPassword ? 'current-password' : undefined)}\n className={cn(\n // Layout — tall enough for the floating label + value\n 'peer h-16 w-full rounded px-4 pt-6 pb-2',\n (isPassword || hasRightAdornment) && 'pr-12',\n // Visuals\n 'bg-(--p-input-bg) text-(--p-input-text)',\n 'font-sans text-sm outline-none',\n 'border border-(--p-input-border) focus:border-(--p-input-border-focus)',\n // Focus\n 'focus:bg-(--p-input-bg-focus)',\n 'focus:ring-2 focus:ring-(--p-input-ring)',\n // Motion\n 'transition-all duration-150 ease-in',\n // States\n 'disabled:cursor-not-allowed disabled:opacity-50',\n 'read-only:cursor-default read-only:bg-(--p-input-bg-readonly)',\n isError && 'ring-2 ring-red-500',\n // Date — hide native picker chrome so rightAdornment can replace it\n hasRightAdornment &&\n type === 'date' &&\n '[&::-webkit-calendar-picker-indicator]:absolute [&::-webkit-calendar-picker-indicator]:right-0 [&::-webkit-calendar-picker-indicator]:h-full [&::-webkit-calendar-picker-indicator]:w-full [&::-webkit-calendar-picker-indicator]:cursor-pointer [&::-webkit-calendar-picker-indicator]:opacity-0',\n inputClassName,\n )}\n />\n\n {/*\n * Floating label — shown above the value when focused or filled.\n * aria-hidden: the <label> below already provides the accessible name.\n */}\n <span\n aria-hidden=\"true\"\n className={cn(\n 'pointer-events-none absolute top-2 left-4',\n 'font-sans text-xs',\n 'origin-left transition-all duration-150 ease-in',\n // Hidden by default\n 'scale-0 opacity-0',\n isError\n ? 'text-red-500'\n : 'text-(--p-input-label) peer-focus:text-(--p-input-label-focus)',\n // Reveal when focused or filled\n 'peer-focus:scale-100 peer-focus:opacity-100',\n 'peer-not-placeholder-shown:scale-100 peer-not-placeholder-shown:opacity-100',\n )}\n >\n {label}\n </span>\n\n {/*\n * Placeholder label — centered in the field when empty and unfocused.\n * pointer-events-none lets clicks fall through to the input beneath;\n * htmlFor still wires up the accessible name correctly.\n */}\n <label\n htmlFor={inputId}\n className={cn(\n 'pointer-events-none absolute top-1/2 left-4 -translate-y-1/2',\n 'font-sans text-sm text-(--p-input-text)',\n 'origin-left transition-all duration-150 ease-in',\n // Collapse when focused or filled\n 'peer-focus:scale-0 peer-focus:opacity-0',\n 'peer-not-placeholder-shown:scale-0 peer-not-placeholder-shown:opacity-0',\n disabled && 'opacity-50',\n )}\n >\n {label}\n </label>\n\n {/* Password toggle */}\n {isPassword && (\n <button\n type=\"button\"\n onClick={() => setShowPassword((v) => !v)}\n disabled={disabled}\n className={cn(\n 'absolute top-1/2 right-4 -translate-y-1/2',\n 'text-(--p-input-label) hover:text-(--p-input-text)',\n 'transition-colors duration-150',\n 'focus-visible:outline-2 focus-visible:outline-offset-2',\n 'focus-visible:outline-(--p-input-ring)',\n 'disabled:pointer-events-none disabled:opacity-50',\n )}\n aria-label={showPassword ? 'Hide password' : 'Show password'}\n aria-pressed={showPassword}\n aria-controls={inputId}\n >\n {showPassword ? <EyeIcon /> : <EyeOffIcon />}\n </button>\n )}\n\n {/* Right adornment — decorative, hidden from assistive tech */}\n {hasRightAdornment && (\n <span\n aria-hidden=\"true\"\n className=\"pointer-events-none absolute top-1/2 right-4 -translate-y-1/2 text-(--p-input-label)\"\n >\n {rightAdornment}\n </span>\n )}\n\n {/* Error message — announced immediately via role=\"alert\" */}\n {isError && errorMessage && (\n <p id={errorId} role=\"alert\" className=\"mt-1 px-4 font-sans text-xs text-red-500\">\n {errorMessage}\n </p>\n )}\n\n {/* Helper text — visible only when there is no error */}\n {!isError && helperText && (\n <p id={helperId} className=\"mt-1 px-4 font-sans text-xs text-(--p-input-text-helper)\">\n {helperText}\n </p>\n )}\n </div>\n );\n },\n);\n\nPTextInput.displayName = 'PTextInput';\n"],"names":["Row","children","gap","alignItems","justifyContent","className","jsx","cn","Stack","r","e","t","f","n","clsx","falsyToString","value","cx","cva","base","config","props","ref","variants","defaultVariants","getVariantClassNames","variant","variantProp","defaultVariantProp","variantKey","propsWithoutUndefined","acc","param","key","getCompoundVariantClassNames","param1","cvClass","cvClassName","compoundVariantOptions","fontVariantsMap","PTypographyVariants","PTypography","Element","PSectionHeader","title","EyeIcon","jsxs","EyeOffIcon","PTextInput","forwardRef","inputClassName","type","label","helperText","id","isError","errorMessage","rightAdornment","disabled","readOnly","style","generatedId","useId","inputId","errorId","helperId","isPassword","hasRightAdornment","showPassword","setShowPassword","useState","inputType","describedBy","v"],"mappings":"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","x_google_ignoreList":[2,3]}
|
package/dist/index.d.ts
CHANGED
|
@@ -16,7 +16,11 @@ declare interface Props {
|
|
|
16
16
|
export declare function PSectionHeader({ title }: Props): JSX.Element;
|
|
17
17
|
|
|
18
18
|
export declare const PTextInput: ForwardRefExoticComponent< {
|
|
19
|
-
/**
|
|
19
|
+
/**
|
|
20
|
+
* Applied to the root wrapper element.
|
|
21
|
+
* Override design tokens via CSS custom properties, e.g.:
|
|
22
|
+
* `[--p-input-ring:blue] [--p-input-bg:#f5f5f5]`
|
|
23
|
+
*/
|
|
20
24
|
className?: string;
|
|
21
25
|
/** Applied to the inner `<input>` element for layout / spacing overrides. */
|
|
22
26
|
inputClassName?: string;
|
|
@@ -32,7 +36,11 @@ rightAdornment?: ReactNode;
|
|
|
32
36
|
} & Omit<InputHTMLAttributes<HTMLInputElement>, "className" | "aria-describedby" | "aria-label" | "placeholder"> & RefAttributes<HTMLInputElement>>;
|
|
33
37
|
|
|
34
38
|
export declare type PTextInputProps = {
|
|
35
|
-
/**
|
|
39
|
+
/**
|
|
40
|
+
* Applied to the root wrapper element.
|
|
41
|
+
* Override design tokens via CSS custom properties, e.g.:
|
|
42
|
+
* `[--p-input-ring:blue] [--p-input-bg:#f5f5f5]`
|
|
43
|
+
*/
|
|
36
44
|
className?: string;
|
|
37
45
|
/** Applied to the inner `<input>` element for layout / spacing overrides. */
|
|
38
46
|
inputClassName?: string;
|
package/dist/index.es.js
CHANGED
|
@@ -1,81 +1,81 @@
|
|
|
1
|
-
import { jsx as
|
|
1
|
+
import { jsx as i, jsxs as k } from "react/jsx-runtime";
|
|
2
2
|
import { cn as u } from "./utils.es.js";
|
|
3
3
|
import { forwardRef as B, useId as L, useState as O } from "react";
|
|
4
4
|
const D = ({
|
|
5
5
|
children: t,
|
|
6
|
-
gap:
|
|
6
|
+
gap: n = void 0,
|
|
7
7
|
alignItems: e = void 0,
|
|
8
|
-
justifyContent:
|
|
8
|
+
justifyContent: a = void 0,
|
|
9
9
|
className: o = ""
|
|
10
|
-
}) => /* @__PURE__ */
|
|
10
|
+
}) => /* @__PURE__ */ i(
|
|
11
11
|
"div",
|
|
12
12
|
{
|
|
13
13
|
className: u("flex flex-row", o),
|
|
14
14
|
style: {
|
|
15
|
-
gap:
|
|
15
|
+
gap: n,
|
|
16
16
|
alignItems: e,
|
|
17
|
-
justifyContent:
|
|
17
|
+
justifyContent: a
|
|
18
18
|
},
|
|
19
19
|
children: t
|
|
20
20
|
}
|
|
21
21
|
), T = ({
|
|
22
22
|
children: t,
|
|
23
|
-
gap:
|
|
23
|
+
gap: n = void 0,
|
|
24
24
|
alignItems: e = void 0,
|
|
25
|
-
justifyContent:
|
|
25
|
+
justifyContent: a = void 0,
|
|
26
26
|
className: o = ""
|
|
27
|
-
}) => /* @__PURE__ */
|
|
27
|
+
}) => /* @__PURE__ */ i(
|
|
28
28
|
"div",
|
|
29
29
|
{
|
|
30
30
|
className: u("flex flex-col", o),
|
|
31
31
|
style: {
|
|
32
|
-
gap:
|
|
32
|
+
gap: n,
|
|
33
33
|
alignItems: e,
|
|
34
|
-
justifyContent:
|
|
34
|
+
justifyContent: a
|
|
35
35
|
},
|
|
36
36
|
children: t
|
|
37
37
|
}
|
|
38
38
|
);
|
|
39
39
|
function j(t) {
|
|
40
|
-
var
|
|
41
|
-
if (typeof t == "string" || typeof t == "number")
|
|
42
|
-
else if (typeof t == "object") if (Array.isArray(t)) for (
|
|
43
|
-
else for (
|
|
44
|
-
return
|
|
40
|
+
var n, e, a = "";
|
|
41
|
+
if (typeof t == "string" || typeof t == "number") a += t;
|
|
42
|
+
else if (typeof t == "object") if (Array.isArray(t)) for (n = 0; n < t.length; n++) t[n] && (e = j(t[n])) && (a && (a += " "), a += e);
|
|
43
|
+
else for (n in t) t[n] && (a && (a += " "), a += n);
|
|
44
|
+
return a;
|
|
45
45
|
}
|
|
46
46
|
function M() {
|
|
47
|
-
for (var t,
|
|
48
|
-
return
|
|
47
|
+
for (var t, n, e = 0, a = ""; e < arguments.length; ) (t = arguments[e++]) && (n = j(t)) && (a && (a += " "), a += n);
|
|
48
|
+
return a;
|
|
49
49
|
}
|
|
50
|
-
const C = (t) => typeof t == "boolean" ? "".concat(t) : t === 0 ? "0" : t, P = M, R = (t,
|
|
51
|
-
var
|
|
52
|
-
if ((
|
|
53
|
-
const { variants: o, defaultVariants:
|
|
54
|
-
const d = e == null ? void 0 : e[
|
|
50
|
+
const C = (t) => typeof t == "boolean" ? "".concat(t) : t === 0 ? "0" : t, P = M, R = (t, n) => (e) => {
|
|
51
|
+
var a;
|
|
52
|
+
if ((n == null ? void 0 : n.variants) == null) return P(t, e == null ? void 0 : e.class, e == null ? void 0 : e.className);
|
|
53
|
+
const { variants: o, defaultVariants: p } = n, l = Object.keys(o).map((r) => {
|
|
54
|
+
const d = e == null ? void 0 : e[r], f = p == null ? void 0 : p[r];
|
|
55
55
|
if (d === null) return null;
|
|
56
|
-
const s = C(d) || C(
|
|
57
|
-
return o[
|
|
58
|
-
}),
|
|
59
|
-
let [
|
|
60
|
-
return s === void 0 || (
|
|
61
|
-
}, {}),
|
|
62
|
-
let { class:
|
|
63
|
-
return Object.entries(
|
|
56
|
+
const s = C(d) || C(f);
|
|
57
|
+
return o[r][s];
|
|
58
|
+
}), m = e && Object.entries(e).reduce((r, d) => {
|
|
59
|
+
let [f, s] = d;
|
|
60
|
+
return s === void 0 || (r[f] = s), r;
|
|
61
|
+
}, {}), x = n == null || (a = n.compoundVariants) === null || a === void 0 ? void 0 : a.reduce((r, d) => {
|
|
62
|
+
let { class: f, className: s, ...y } = d;
|
|
63
|
+
return Object.entries(y).every((w) => {
|
|
64
64
|
let [c, h] = w;
|
|
65
65
|
return Array.isArray(h) ? h.includes({
|
|
66
|
-
...
|
|
67
|
-
...
|
|
66
|
+
...p,
|
|
67
|
+
...m
|
|
68
68
|
}[c]) : {
|
|
69
|
-
...
|
|
70
|
-
...
|
|
69
|
+
...p,
|
|
70
|
+
...m
|
|
71
71
|
}[c] === h;
|
|
72
72
|
}) ? [
|
|
73
|
-
...
|
|
74
|
-
|
|
73
|
+
...r,
|
|
74
|
+
f,
|
|
75
75
|
s
|
|
76
|
-
] :
|
|
76
|
+
] : r;
|
|
77
77
|
}, []);
|
|
78
|
-
return P(t, l,
|
|
78
|
+
return P(t, l, x, e == null ? void 0 : e.class, e == null ? void 0 : e.className);
|
|
79
79
|
}, W = {
|
|
80
80
|
serif: "font-serif",
|
|
81
81
|
body: "text-base",
|
|
@@ -93,22 +93,22 @@ const C = (t) => typeof t == "boolean" ? "".concat(t) : t === 0 ? "0" : t, P = M
|
|
|
93
93
|
});
|
|
94
94
|
function H({
|
|
95
95
|
as: t = "p",
|
|
96
|
-
children:
|
|
96
|
+
children: n,
|
|
97
97
|
className: e = "",
|
|
98
|
-
variant:
|
|
98
|
+
variant: a,
|
|
99
99
|
...o
|
|
100
100
|
}) {
|
|
101
|
-
return /* @__PURE__ */
|
|
101
|
+
return /* @__PURE__ */ i(
|
|
102
102
|
t,
|
|
103
103
|
{
|
|
104
|
-
className: u(q({ variant:
|
|
104
|
+
className: u(q({ variant: a, className: e })),
|
|
105
105
|
...o,
|
|
106
|
-
children:
|
|
106
|
+
children: n
|
|
107
107
|
}
|
|
108
108
|
);
|
|
109
109
|
}
|
|
110
110
|
function G({ title: t }) {
|
|
111
|
-
return /* @__PURE__ */
|
|
111
|
+
return /* @__PURE__ */ i(T, { className: "pt-2 border-t border-white text-white", children: /* @__PURE__ */ i(H, { className: "uppercase", variant: "body-wide", children: t }) });
|
|
112
112
|
}
|
|
113
113
|
function $() {
|
|
114
114
|
return /* @__PURE__ */ k(
|
|
@@ -126,8 +126,8 @@ function $() {
|
|
|
126
126
|
"aria-hidden": "true",
|
|
127
127
|
focusable: "false",
|
|
128
128
|
children: [
|
|
129
|
-
/* @__PURE__ */
|
|
130
|
-
/* @__PURE__ */
|
|
129
|
+
/* @__PURE__ */ i("path", { d: "M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z" }),
|
|
130
|
+
/* @__PURE__ */ i("circle", { cx: "12", cy: "12", r: "3" })
|
|
131
131
|
]
|
|
132
132
|
}
|
|
133
133
|
);
|
|
@@ -148,10 +148,10 @@ function F() {
|
|
|
148
148
|
"aria-hidden": "true",
|
|
149
149
|
focusable: "false",
|
|
150
150
|
children: [
|
|
151
|
-
/* @__PURE__ */
|
|
152
|
-
/* @__PURE__ */
|
|
153
|
-
/* @__PURE__ */
|
|
154
|
-
/* @__PURE__ */
|
|
151
|
+
/* @__PURE__ */ i("path", { d: "M9.88 9.88a3 3 0 1 0 4.24 4.24" }),
|
|
152
|
+
/* @__PURE__ */ i("path", { d: "M10.73 5.08A10.43 10.43 0 0 1 12 5c7 0 10 7 10 7a13.16 13.16 0 0 1-1.67 2.68" }),
|
|
153
|
+
/* @__PURE__ */ i("path", { d: "M6.61 6.61A13.526 13.526 0 0 0 2 12s3 7 10 7a9.74 9.74 0 0 0 5.39-1.61" }),
|
|
154
|
+
/* @__PURE__ */ i("line", { x1: "2", x2: "22", y1: "2", y2: "22" })
|
|
155
155
|
]
|
|
156
156
|
}
|
|
157
157
|
);
|
|
@@ -159,38 +159,38 @@ function F() {
|
|
|
159
159
|
const K = B(
|
|
160
160
|
({
|
|
161
161
|
className: t,
|
|
162
|
-
inputClassName:
|
|
162
|
+
inputClassName: n,
|
|
163
163
|
type: e,
|
|
164
|
-
label:
|
|
164
|
+
label: a,
|
|
165
165
|
helperText: o,
|
|
166
|
-
id:
|
|
166
|
+
id: p,
|
|
167
167
|
isError: l = !1,
|
|
168
|
-
errorMessage:
|
|
169
|
-
rightAdornment:
|
|
170
|
-
disabled:
|
|
168
|
+
errorMessage: m,
|
|
169
|
+
rightAdornment: x,
|
|
170
|
+
disabled: r,
|
|
171
171
|
readOnly: d,
|
|
172
|
-
style:
|
|
172
|
+
style: f,
|
|
173
173
|
...s
|
|
174
|
-
},
|
|
175
|
-
const w = L(), c =
|
|
176
|
-
l &&
|
|
174
|
+
}, y) => {
|
|
175
|
+
const w = L(), c = p ?? w, h = `${c}-error`, N = `${c}-helper`, v = e === "password", g = !!x && !v, [b, I] = O(!1), V = v ? b ? "text" : "password" : e ?? "text", A = [
|
|
176
|
+
l && m ? h : null,
|
|
177
177
|
!l && o ? N : null
|
|
178
178
|
].filter(Boolean).join(" ") || void 0;
|
|
179
|
-
return /* @__PURE__ */ k("div", { className: u("relative w-full", t), style:
|
|
180
|
-
/* @__PURE__ */
|
|
179
|
+
return /* @__PURE__ */ k("div", { className: u("p-text-input relative w-full", t), style: f, children: [
|
|
180
|
+
/* @__PURE__ */ i(
|
|
181
181
|
"input",
|
|
182
182
|
{
|
|
183
183
|
...s,
|
|
184
184
|
id: c,
|
|
185
|
-
ref:
|
|
185
|
+
ref: y,
|
|
186
186
|
type: V,
|
|
187
|
-
disabled:
|
|
187
|
+
disabled: r,
|
|
188
188
|
readOnly: d,
|
|
189
189
|
placeholder: " ",
|
|
190
190
|
"aria-invalid": l || void 0,
|
|
191
191
|
"aria-describedby": A,
|
|
192
192
|
"aria-required": s.required,
|
|
193
|
-
"aria-disabled":
|
|
193
|
+
"aria-disabled": r,
|
|
194
194
|
"aria-readonly": d,
|
|
195
195
|
autoComplete: s.autoComplete ?? (v ? "current-password" : void 0),
|
|
196
196
|
className: u(
|
|
@@ -198,24 +198,25 @@ const K = B(
|
|
|
198
198
|
"peer h-16 w-full rounded px-4 pt-6 pb-2",
|
|
199
199
|
(v || g) && "pr-12",
|
|
200
200
|
// Visuals
|
|
201
|
-
"bg-
|
|
201
|
+
"bg-(--p-input-bg) text-(--p-input-text)",
|
|
202
202
|
"font-sans text-sm outline-none",
|
|
203
|
-
"border border-
|
|
203
|
+
"border border-(--p-input-border) focus:border-(--p-input-border-focus)",
|
|
204
204
|
// Focus
|
|
205
|
-
"focus:
|
|
205
|
+
"focus:bg-(--p-input-bg-focus)",
|
|
206
|
+
"focus:ring-2 focus:ring-(--p-input-ring)",
|
|
206
207
|
// Motion
|
|
207
208
|
"transition-all duration-150 ease-in",
|
|
208
209
|
// States
|
|
209
210
|
"disabled:cursor-not-allowed disabled:opacity-50",
|
|
210
|
-
"read-only:cursor-default read-only:bg-
|
|
211
|
+
"read-only:cursor-default read-only:bg-(--p-input-bg-readonly)",
|
|
211
212
|
l && "ring-2 ring-red-500",
|
|
212
213
|
// Date — hide native picker chrome so rightAdornment can replace it
|
|
213
214
|
g && e === "date" && "[&::-webkit-calendar-picker-indicator]:absolute [&::-webkit-calendar-picker-indicator]:right-0 [&::-webkit-calendar-picker-indicator]:h-full [&::-webkit-calendar-picker-indicator]:w-full [&::-webkit-calendar-picker-indicator]:cursor-pointer [&::-webkit-calendar-picker-indicator]:opacity-0",
|
|
214
|
-
|
|
215
|
+
n
|
|
215
216
|
)
|
|
216
217
|
}
|
|
217
218
|
),
|
|
218
|
-
/* @__PURE__ */
|
|
219
|
+
/* @__PURE__ */ i(
|
|
219
220
|
"span",
|
|
220
221
|
{
|
|
221
222
|
"aria-hidden": "true",
|
|
@@ -225,59 +226,60 @@ const K = B(
|
|
|
225
226
|
"origin-left transition-all duration-150 ease-in",
|
|
226
227
|
// Hidden by default
|
|
227
228
|
"scale-0 opacity-0",
|
|
228
|
-
l ? "text-red-500" : "text-
|
|
229
|
+
l ? "text-red-500" : "text-(--p-input-label) peer-focus:text-(--p-input-label-focus)",
|
|
229
230
|
// Reveal when focused or filled
|
|
230
231
|
"peer-focus:scale-100 peer-focus:opacity-100",
|
|
231
232
|
"peer-not-placeholder-shown:scale-100 peer-not-placeholder-shown:opacity-100"
|
|
232
233
|
),
|
|
233
|
-
children:
|
|
234
|
+
children: a
|
|
234
235
|
}
|
|
235
236
|
),
|
|
236
|
-
/* @__PURE__ */
|
|
237
|
+
/* @__PURE__ */ i(
|
|
237
238
|
"label",
|
|
238
239
|
{
|
|
239
240
|
htmlFor: c,
|
|
240
241
|
className: u(
|
|
241
242
|
"pointer-events-none absolute top-1/2 left-4 -translate-y-1/2",
|
|
242
|
-
"font-sans text-sm text-
|
|
243
|
+
"font-sans text-sm text-(--p-input-text)",
|
|
243
244
|
"origin-left transition-all duration-150 ease-in",
|
|
244
245
|
// Collapse when focused or filled
|
|
245
246
|
"peer-focus:scale-0 peer-focus:opacity-0",
|
|
246
247
|
"peer-not-placeholder-shown:scale-0 peer-not-placeholder-shown:opacity-0",
|
|
247
|
-
|
|
248
|
+
r && "opacity-50"
|
|
248
249
|
),
|
|
249
|
-
children:
|
|
250
|
+
children: a
|
|
250
251
|
}
|
|
251
252
|
),
|
|
252
|
-
v && /* @__PURE__ */
|
|
253
|
+
v && /* @__PURE__ */ i(
|
|
253
254
|
"button",
|
|
254
255
|
{
|
|
255
256
|
type: "button",
|
|
256
257
|
onClick: () => I((S) => !S),
|
|
257
|
-
disabled:
|
|
258
|
+
disabled: r,
|
|
258
259
|
className: u(
|
|
259
260
|
"absolute top-1/2 right-4 -translate-y-1/2",
|
|
260
|
-
"text-
|
|
261
|
+
"text-(--p-input-label) hover:text-(--p-input-text)",
|
|
261
262
|
"transition-colors duration-150",
|
|
262
|
-
"focus-visible:outline-2 focus-visible:outline-offset-2
|
|
263
|
+
"focus-visible:outline-2 focus-visible:outline-offset-2",
|
|
264
|
+
"focus-visible:outline-(--p-input-ring)",
|
|
263
265
|
"disabled:pointer-events-none disabled:opacity-50"
|
|
264
266
|
),
|
|
265
|
-
"aria-label":
|
|
266
|
-
"aria-pressed":
|
|
267
|
+
"aria-label": b ? "Hide password" : "Show password",
|
|
268
|
+
"aria-pressed": b,
|
|
267
269
|
"aria-controls": c,
|
|
268
|
-
children:
|
|
270
|
+
children: b ? /* @__PURE__ */ i($, {}) : /* @__PURE__ */ i(F, {})
|
|
269
271
|
}
|
|
270
272
|
),
|
|
271
|
-
g && /* @__PURE__ */
|
|
273
|
+
g && /* @__PURE__ */ i(
|
|
272
274
|
"span",
|
|
273
275
|
{
|
|
274
276
|
"aria-hidden": "true",
|
|
275
|
-
className: "pointer-events-none absolute top-1/2 right-4 -translate-y-1/2 text-
|
|
276
|
-
children:
|
|
277
|
+
className: "pointer-events-none absolute top-1/2 right-4 -translate-y-1/2 text-(--p-input-label)",
|
|
278
|
+
children: x
|
|
277
279
|
}
|
|
278
280
|
),
|
|
279
|
-
l &&
|
|
280
|
-
!l && o && /* @__PURE__ */
|
|
281
|
+
l && m && /* @__PURE__ */ i("p", { id: h, role: "alert", className: "mt-1 px-4 font-sans text-xs text-red-500", children: m }),
|
|
282
|
+
!l && o && /* @__PURE__ */ i("p", { id: N, className: "mt-1 px-4 font-sans text-xs text-(--p-input-text-helper)", children: o })
|
|
281
283
|
] });
|
|
282
284
|
}
|
|
283
285
|
);
|