UNPKG

vagaro-tw-components

Version:

Tailwind CSS React TypeScript components for Vagaro

3 lines 4.67 kB
'use strict';var react=require('react'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),jsxRuntime=require('react/jsx-runtime');function n(...e){return tailwindMerge.twMerge(clsx.clsx(e))}var R={primary:"bg-vagaro-primary text-white hover:bg-blue-700 focus:ring-blue-500",secondary:"bg-vagaro-secondary text-white hover:bg-red-600 focus:ring-red-500",outline:"border-2 border-vagaro-primary text-vagaro-primary hover:bg-vagaro-primary hover:text-white focus:ring-vagaro-primary",ghost:"text-vagaro-dark hover:bg-gray-100 focus:ring-gray-500",danger:"bg-red-600 text-white hover:bg-red-700 focus:ring-red-500"},P={sm:"px-3 py-1.5 text-sm",md:"px-4 py-2 text-base",lg:"px-6 py-3 text-lg"},u=react.forwardRef(({className:e,variant:o="primary",size:r="md",fullWidth:t=false,loading:a=false,disabled:s,children:l,...m},i)=>jsxRuntime.jsxs("button",{ref:i,className:n("inline-flex items-center justify-center font-medium rounded-md transition-colors focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed",R[o],P[r],t&&"w-full",a&&"cursor-wait",e),disabled:s||a,...m,children:[a&&jsxRuntime.jsxs("svg",{className:"animate-spin -ml-1 mr-2 h-4 w-4",xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",children:[jsxRuntime.jsx("circle",{className:"opacity-25",cx:"12",cy:"12",r:"10",stroke:"currentColor",strokeWidth:"4"}),jsxRuntime.jsx("path",{className:"opacity-75",fill:"currentColor",d:"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"})]}),l]}));u.displayName="Button";var B={default:"bg-white",bordered:"bg-white border border-gray-200",shadow:"bg-white shadow-lg"},k={none:"",sm:"p-3",md:"p-6",lg:"p-8"},x=react.forwardRef(({className:e,variant:o="default",padding:r="md",children:t,...a},s)=>jsxRuntime.jsx("div",{ref:s,className:n("rounded-lg",B[o],k[r],e),...a,children:t}));x.displayName="Card";var b=react.forwardRef(({className:e,label:o,error:r,helperText:t,fullWidth:a=false,id:s,...l},m)=>{let i=s||`input-${Math.random().toString(36).substr(2,9)}`;return jsxRuntime.jsxs("div",{className:n("flex flex-col gap-1",a&&"w-full"),children:[o&&jsxRuntime.jsx("label",{htmlFor:i,className:"text-sm font-medium text-gray-700",children:o}),jsxRuntime.jsx("input",{ref:m,id:i,className:n("px-3 py-2 border rounded-md transition-colors focus:outline-none focus:ring-2 focus:ring-offset-2",r?"border-red-500 focus:ring-red-500":"border-gray-300 focus:border-vagaro-primary focus:ring-vagaro-primary",a&&"w-full",e),"aria-invalid":!!r,"aria-describedby":r?`${i}-error`:t?`${i}-helper`:void 0,...l}),r&&jsxRuntime.jsx("p",{id:`${i}-error`,className:"text-sm text-red-600",children:r}),t&&!r&&jsxRuntime.jsx("p",{id:`${i}-helper`,className:"text-sm text-gray-500",children:t})]})});b.displayName="Input";var V={default:"bg-gray-100 text-gray-800",primary:"bg-blue-100 text-blue-800",secondary:"bg-purple-100 text-purple-800",success:"bg-green-100 text-green-800",warning:"bg-yellow-100 text-yellow-800",danger:"bg-red-100 text-red-800"},z={sm:"px-2 py-0.5 text-xs",md:"px-2.5 py-1 text-sm",lg:"px-3 py-1.5 text-base"},y=react.forwardRef(({className:e,variant:o="default",size:r="md",children:t,...a},s)=>jsxRuntime.jsx("span",{ref:s,className:n("inline-flex items-center font-medium rounded-full",V[o],z[r],e),...a,children:t}));y.displayName="Badge";var H=({fillClass:e,width:o="1em",height:r="1em",ariaLabel:t="Right arrow icon"})=>jsxRuntime.jsx("svg",{"aria-label":t,xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 448 512",className:e,width:o,height:r,children:jsxRuntime.jsx("path",{d:"M438.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L338.8 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l306.7 0L233.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160z",fill:"currentColor"})}),d=H;var $=({text:e,href:o,linkComponent:r="a",linkProps:t={},openInNewTab:a=true})=>{let s={href:o,...a&&{target:"_blank",rel:"noopener noreferrer"},className:"group",...t};return jsxRuntime.jsx(r,{...s,children:jsxRuntime.jsxs("div",{className:"mt-16 flex h-24 items-center justify-center rounded bg-inkLightest p-4 text-center text-lg font-semibold text-primary transition-all duration-300 group-hover:bg-primary group-hover:text-white md:text-2xl",children:[jsxRuntime.jsx("div",{className:"div",children:e}),jsxRuntime.jsx(d,{fillClass:"text-primary group-hover:text-white ml-2",width:"16",height:"16"})]})})}; exports.Badge=y;exports.Button=u;exports.Card=x;exports.Input=b;exports.PageBanner=$;exports.RightArrow=d;exports.cn=n;//# sourceMappingURL=index.js.map //# sourceMappingURL=index.js.map