@frontend-kasplo/kasplo-ui-components/dist/index.esm.js

UI Components Library

import e,{useState as t}from"react";var a=function(t){var a=t.label,o=t.variant,n=void 0===o?"primary":o,l=t.size,r=void 0===l?"medium":l,c=t.disabled,i=void 0!==c&&c,m=t.onClick,s=t.className,d=void 0===s?"":s,u=i?"opacity-50 cursor-not-allowed":"cursor-pointer";return e.createElement("button",{className:"".concat("rounded-md font-semibold transition-colors duration-200"," ").concat({primary:"bg-blue-600 text-white hover:bg-blue-700",secondary:"bg-gray-200 text-gray-800 hover:bg-gray-300"}[n]," ").concat({small:"px-3 py-1 text-sm",medium:"px-4 py-2 text-base",large:"px-6 py-3 text-lg"}[r]," ").concat(u," ").concat(d),disabled:i,onClick:m},a)},o=function(a){var o=a.initialValue,n=void 0===o?0:o,l=a.min,r=void 0===l?Number.MIN_SAFE_INTEGER:l,c=a.max,i=void 0===c?Number.MAX_SAFE_INTEGER:c,m=a.step,s=void 0===m?1:m,d=a.label,u=void 0===d?"Counter":d,b=a.className,x=void 0===b?"":b,v=t(n),f=v[0],p=v[1],g="px-4 py-2 rounded-md font-semibold transition-colors duration-200",h="bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 disabled:cursor-not-allowed";return e.createElement("div",{className:"flex flex-col items-center gap-4 ".concat(x)},e.createElement("label",{className:"text-lg font-medium"},u),e.createElement("div",{className:"flex items-center gap-4"},e.createElement("button",{className:"".concat(g," ").concat(h),onClick:function(){p((function(e){return Math.max(e-s,r)}))},disabled:f<=r},"-"),e.createElement("span",{className:"text-2xl font-bold min-w-[3rem] text-center"},f),e.createElement("button",{className:"".concat(g," ").concat(h),onClick:function(){p((function(e){return Math.min(e+s,i)}))},disabled:f>=i},"+")),e.createElement("button",{className:"".concat(g," ").concat("bg-gray-200 text-gray-800 hover:bg-gray-300"),onClick:function(){p(n)},disabled:f===n},"Reset"))},n=function(t){var a=t.label,o=t.backgroundColor,n=void 0===o?"#D27231":o,l=t.textColor,r=void 0===l?"#fff":l,c=t.borderColor,i=t.className,m=void 0===i?"":i,s=t.variant,d=void 0===s?"pill":s,u=t.size,b=void 0===u?"large":u,x=t.fontSize,v=void 0===x?"small":x,f=t.width,p=void 0===f?"medium":f,g=c?"border border-solid border-[".concat(c,"]"):"";return e.createElement("div",{className:"".concat("inline-flex items-center justify-center px-2 sm:px-3 overflow-hidden whitespace-nowrap max-w-full transition-all duration-200"," ").concat({small:"h-5 sm:h-6 md:h-6",medium:"h-6 sm:h-7 md:h-8",large:"h-8 sm:h-9 md:h-10"}[b]," ").concat({small:"w-20 sm:w-24 md:w-24",medium:"w-24 sm:w-28 md:w-32",large:"w-32 sm:w-36 md:w-40",auto:"w-auto min-w-[80px] sm:min-w-[96px]"}[p]," ").concat({rounded:"rounded-md",pill:"rounded-full"}[d]," ").concat(g," ").concat(m),style:{backgroundColor:n,color:r}},e.createElement("span",{className:"font-medium truncate ".concat({small:"text-xs sm:text-xs md:text-sm",medium:"text-sm sm:text-sm md:text-base",large:"text-base sm:text-lg md:text-lg"}[v]),style:{maxWidth:"15ch",transform:"scale(var(--chip-scale, 1))",transformOrigin:"left center"}},a))};export{a as Button,n as Chip,o as Counter};
//# sourceMappingURL=index.esm.js.map