UNPKG

@frontend-kasplo/kasplo-ui-components

Version:
3 lines (2 loc) 3.07 kB
"use strict";var e=require("react");exports.Button=function(t){var a=t.label,o=t.variant,n=void 0===o?"primary":o,r=t.size,l=void 0===r?"medium":r,c=t.disabled,i=void 0!==c&&c,s=t.onClick,m=t.className,d=void 0===m?"":m,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"}[l]," ").concat(u," ").concat(d),disabled:i,onClick:s},a)},exports.Chip=function(t){var a=t.label,o=t.backgroundColor,n=void 0===o?"#D27231":o,r=t.textColor,l=void 0===r?"#fff":r,c=t.borderColor,i=t.className,s=void 0===i?"":i,m=t.variant,d=void 0===m?"pill":m,u=t.size,x=void 0===u?"large":u,b=t.fontSize,v=void 0===b?"small":b,p=t.width,f=void 0===p?"medium":p,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"}[x]," ").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]"}[f]," ").concat({rounded:"rounded-md",pill:"rounded-full"}[d]," ").concat(g," ").concat(s),style:{backgroundColor:n,color:l}},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))},exports.Counter=function(t){var a=t.initialValue,o=void 0===a?0:a,n=t.min,r=void 0===n?Number.MIN_SAFE_INTEGER:n,l=t.max,c=void 0===l?Number.MAX_SAFE_INTEGER:l,i=t.step,s=void 0===i?1:i,m=t.label,d=void 0===m?"Counter":m,u=t.className,x=void 0===u?"":u,b=e.useState(o),v=b[0],p=b[1],f="px-4 py-2 rounded-md font-semibold transition-colors duration-200",g="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"},d),e.createElement("div",{className:"flex items-center gap-4"},e.createElement("button",{className:"".concat(f," ").concat(g),onClick:function(){p((function(e){return Math.max(e-s,r)}))},disabled:v<=r},"-"),e.createElement("span",{className:"text-2xl font-bold min-w-[3rem] text-center"},v),e.createElement("button",{className:"".concat(f," ").concat(g),onClick:function(){p((function(e){return Math.min(e+s,c)}))},disabled:v>=c},"+")),e.createElement("button",{className:"".concat(f," ").concat("bg-gray-200 text-gray-800 hover:bg-gray-300"),onClick:function(){p(o)},disabled:v===o},"Reset"))}; //# sourceMappingURL=index.js.map