flowbite-react
Version:
Official React components built for Flowbite and Tailwind CSS
1 lines • 4.02 kB
Source Map (JSON)
{"version":3,"file":"FloatingLabel.cjs","sources":["../../../src/components/FloatingLabel/FloatingLabel.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ComponentPropsWithoutRef } from \"react\";\nimport { forwardRef, useId } from \"react\";\nimport { get } from \"../../helpers/get\";\nimport { resolveProps } from \"../../helpers/resolve-props\";\nimport { useResolveTheme } from \"../../helpers/resolve-theme\";\nimport { twMerge } from \"../../helpers/tailwind-merge\";\nimport { useThemeProvider } from \"../../theme/provider\";\nimport type { ThemingProps } from \"../../types\";\nimport { floatingLabelTheme, type FloatingLabelTheme } from \"./theme\";\n\nexport type FloatingLabelColor = \"default\" | \"success\" | \"error\";\nexport type FloatingLabelSizing = \"sm\" | \"md\";\nexport type FloatingLabelVariant = \"filled\" | \"outlined\" | \"standard\";\n\nexport interface FloatingLabelProps extends ComponentPropsWithoutRef<\"input\">, ThemingProps<FloatingLabelTheme> {\n label: string;\n color?: FloatingLabelColor;\n sizing?: FloatingLabelSizing;\n variant: FloatingLabelVariant;\n disabled?: boolean;\n}\n\nexport const FloatingLabel = forwardRef<HTMLInputElement, FloatingLabelProps>((props, ref) => {\n const randomId = useId();\n\n const provider = useThemeProvider();\n const theme = useResolveTheme(\n [floatingLabelTheme, provider.theme?.floatingLabel, props.theme],\n [get(provider.clearTheme, \"floatingLabel\"), props.clearTheme],\n [get(provider.applyTheme, \"floatingLabel\"), props.applyTheme],\n );\n\n const {\n label,\n color = \"default\",\n sizing = \"md\",\n variant,\n disabled = false,\n className,\n ...restProps\n } = resolveProps(props, provider.props?.floatingLabel);\n\n return (\n <div className={twMerge(\"relative\", variant === \"standard\" ? \"z-0\" : \"\")}>\n <input\n type=\"text\"\n id={\"floatingLabel\" + randomId}\n aria-describedby=\"outlined_success_help\"\n className={twMerge(theme.input[color][variant][sizing], className)}\n placeholder=\" \"\n data-testid=\"floating-label\"\n disabled={disabled}\n {...restProps}\n ref={ref}\n />\n <label htmlFor={\"floatingLabel\" + randomId} className={twMerge(theme.label[color][variant][sizing], className)}>\n {label}\n </label>\n </div>\n );\n});\n\nFloatingLabel.displayName = \"FloatingLabel\";\n"],"names":["forwardRef","useId","provider","useThemeProvider","theme","useResolveTheme","floatingLabelTheme","get","resolveProps","jsxs","twMerge","jsx"],"mappings":";;;;;;;;;;;AAUY,MAAC,aAAa,GAAGA,gBAAU,CAAC,CAAC,KAAK,EAAE,GAAG,KAAK;AACxD,EAAE,MAAM,QAAQ,GAAGC,WAAK,EAAE;AAC1B,EAAE,MAAMC,UAAQ,GAAGC,yBAAgB,EAAE;AACrC,EAAE,MAAMC,OAAK,GAAGC,4BAAe;AAC/B,IAAI,CAACC,wBAAkB,EAAEJ,UAAQ,CAAC,KAAK,EAAE,aAAa,EAAE,KAAK,CAAC,KAAK,CAAC;AACpE,IAAI,CAACK,OAAG,CAACL,UAAQ,CAAC,UAAU,EAAE,eAAe,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC;AACjE,IAAI,CAACK,OAAG,CAACL,UAAQ,CAAC,UAAU,EAAE,eAAe,CAAC,EAAE,KAAK,CAAC,UAAU;AAChE,GAAG;AACH,EAAE,MAAM;AACR,IAAI,KAAK;AACT,IAAI,KAAK,GAAG,SAAS;AACrB,IAAI,MAAM,GAAG,IAAI;AACjB,IAAI,OAAO;AACX,IAAI,QAAQ,GAAG,KAAK;AACpB,IAAI,SAAS;AACb,IAAI,GAAG;AACP,GAAG,GAAGM,yBAAY,CAAC,KAAK,EAAEN,UAAQ,CAAC,KAAK,EAAE,aAAa,CAAC;AACxD,EAAE,uBAAuBO,eAAI,CAAC,KAAK,EAAE,EAAE,SAAS,EAAEC,qBAAO,CAAC,UAAU,EAAE,OAAO,KAAK,UAAU,GAAG,KAAK,GAAG,EAAE,CAAC,EAAE,QAAQ,EAAE;AACtH,oBAAoBC,cAAG;AACvB,MAAM,OAAO;AACb,MAAM;AACN,QAAQ,IAAI,EAAE,MAAM;AACpB,QAAQ,EAAE,EAAE,eAAe,GAAG,QAAQ;AACtC,QAAQ,kBAAkB,EAAE,uBAAuB;AACnD,QAAQ,SAAS,EAAED,qBAAO,CAACN,OAAK,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,EAAE,SAAS,CAAC;AAC1E,QAAQ,WAAW,EAAE,GAAG;AACxB,QAAQ,aAAa,EAAE,gBAAgB;AACvC,QAAQ,QAAQ;AAChB,QAAQ,GAAG,SAAS;AACpB,QAAQ;AACR;AACA,KAAK;AACL,oBAAoBO,cAAG,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,eAAe,GAAG,QAAQ,EAAE,SAAS,EAAED,qBAAO,CAACN,OAAK,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,EAAE,SAAS,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE;AAC7J,GAAG,EAAE,CAAC;AACN,CAAC;AACD,aAAa,CAAC,WAAW,GAAG,eAAe;;;;"}