@a1rman/ui
Version:
A simple UI components library with Tailwind CSS and TypeScript.
196 lines (179 loc) • 22.6 kB
JavaScript
'use strict';
Object.defineProperty(exports, '__esModule', { value: true });
var React = require('react');
var ReactDOM = require('react-dom');
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
function styleInject(css, ref) {
if ( ref === void 0 ) ref = {};
var insertAt = ref.insertAt;
if (!css || typeof document === 'undefined') { return; }
var head = document.head || document.getElementsByTagName('head')[0];
var style = document.createElement('style');
style.type = 'text/css';
if (insertAt === 'top') {
if (head.firstChild) {
head.insertBefore(style, head.firstChild);
} else {
head.appendChild(style);
}
} else {
head.appendChild(style);
}
if (style.styleSheet) {
style.styleSheet.cssText = css;
} else {
style.appendChild(document.createTextNode(css));
}
}
var css_248z = "/* src/styles/tailwind.css */\r\n/* ! tailwindcss v3.4.3 | MIT License | https://tailwindcss.com */\r\n/*\n1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)\n2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)\n*/\r\n*,\n::before,\n::after {\n box-sizing: border-box; /* 1 */\n border-width: 0; /* 2 */\n border-style: solid; /* 2 */\n border-color: #e5e7eb; /* 2 */\n}\r\n::before,\n::after {\n --tw-content: '';\n}\r\n/*\n1. Use a consistent sensible line-height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n3. Use a more readable tab size.\n4. Use the user's configured `sans` font-family by default.\n5. Use the user's configured `sans` font-feature-settings by default.\n6. Use the user's configured `sans` font-variation-settings by default.\n7. Disable tap highlights on iOS\n*/\r\nhtml,\n:host {\n line-height: 1.5; /* 1 */\n -webkit-text-size-adjust: 100%; /* 2 */\n -moz-tab-size: 4; /* 3 */\n -o-tab-size: 4;\n tab-size: 4; /* 3 */\n font-family: ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"; /* 4 */\n font-feature-settings: normal; /* 5 */\n font-variation-settings: normal; /* 6 */\n -webkit-tap-highlight-color: transparent; /* 7 */\n}\r\n/*\n1. Remove the margin in all browsers.\n2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.\n*/\r\nbody {\n margin: 0; /* 1 */\n line-height: inherit; /* 2 */\n}\r\n/*\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n3. Ensure horizontal rules are visible by default.\n*/\r\nhr {\n height: 0; /* 1 */\n color: inherit; /* 2 */\n border-top-width: 1px; /* 3 */\n}\r\n/*\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\r\nabbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n}\r\n/*\nRemove the default font size and weight for headings.\n*/\r\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n font-size: inherit;\n font-weight: inherit;\n}\r\n/*\nReset links to optimize for opt-in styling instead of opt-out.\n*/\r\na {\n color: inherit;\n text-decoration: inherit;\n}\r\n/*\nAdd the correct font weight in Edge and Safari.\n*/\r\nb,\nstrong {\n font-weight: bolder;\n}\r\n/*\n1. Use the user's configured `mono` font-family by default.\n2. Use the user's configured `mono` font-feature-settings by default.\n3. Use the user's configured `mono` font-variation-settings by default.\n4. Correct the odd `em` font sizing in all browsers.\n*/\r\ncode,\nkbd,\nsamp,\npre {\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace; /* 1 */\n font-feature-settings: normal; /* 2 */\n font-variation-settings: normal; /* 3 */\n font-size: 1em; /* 4 */\n}\r\n/*\nAdd the correct font size in all browsers.\n*/\r\nsmall {\n font-size: 80%;\n}\r\n/*\nPrevent `sub` and `sup` elements from affecting the line height in all browsers.\n*/\r\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\r\nsub {\n bottom: -0.25em;\n}\r\nsup {\n top: -0.5em;\n}\r\n/*\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n3. Remove gaps between table borders by default.\n*/\r\ntable {\n text-indent: 0; /* 1 */\n border-color: inherit; /* 2 */\n border-collapse: collapse; /* 3 */\n}\r\n/*\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n3. Remove default padding in all browsers.\n*/\r\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit; /* 1 */\n font-feature-settings: inherit; /* 1 */\n font-variation-settings: inherit; /* 1 */\n font-size: 100%; /* 1 */\n font-weight: inherit; /* 1 */\n line-height: inherit; /* 1 */\n letter-spacing: inherit; /* 1 */\n color: inherit; /* 1 */\n margin: 0; /* 2 */\n padding: 0; /* 3 */\n}\r\n/*\nRemove the inheritance of text transform in Edge and Firefox.\n*/\r\nbutton,\nselect {\n text-transform: none;\n}\r\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Remove default button styles.\n*/\r\nbutton,\ninput:where([type='button']),\ninput:where([type='reset']),\ninput:where([type='submit']) {\n -webkit-appearance: button; /* 1 */\n background-color: transparent; /* 2 */\n background-image: none; /* 2 */\n}\r\n/*\nUse the modern Firefox focus style for all focusable elements.\n*/\r\n:-moz-focusring {\n outline: auto;\n}\r\n/*\nRemove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)\n*/\r\n:-moz-ui-invalid {\n box-shadow: none;\n}\r\n/*\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\r\nprogress {\n vertical-align: baseline;\n}\r\n/*\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\r\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n height: auto;\n}\r\n/*\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\r\n[type='search'] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\r\n/*\nRemove the inner padding in Chrome and Safari on macOS.\n*/\r\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\r\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to `inherit` in Safari.\n*/\r\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\r\n/*\nAdd the correct display in Chrome and Safari.\n*/\r\nsummary {\n display: list-item;\n}\r\n/*\nRemoves the default spacing and border for appropriate elements.\n*/\r\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n margin: 0;\n}\r\nfieldset {\n margin: 0;\n padding: 0;\n}\r\nlegend {\n padding: 0;\n}\r\nol,\nul,\nmenu {\n list-style: none;\n margin: 0;\n padding: 0;\n}\r\n/*\nReset default styling for dialogs.\n*/\r\ndialog {\n padding: 0;\n}\r\n/*\nPrevent resizing textareas horizontally by default.\n*/\r\ntextarea {\n resize: vertical;\n}\r\n/*\n1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)\n2. Set the default placeholder color to the user's configured gray 400 color.\n*/\r\ninput::-moz-placeholder, textarea::-moz-placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\r\ninput::placeholder,\ntextarea::placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\r\n/*\nSet the default cursor for buttons.\n*/\r\nbutton,\n[role=\"button\"] {\n cursor: pointer;\n}\r\n/*\nMake sure disabled buttons don't get the pointer cursor.\n*/\r\n:disabled {\n cursor: default;\n}\r\n/*\n1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)\n2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)\n This can trigger a poorly considered lint error in some tools but is included by design.\n*/\r\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n display: block; /* 1 */\n vertical-align: middle; /* 2 */\n}\r\n/*\nConstrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)\n*/\r\nimg,\nvideo {\n max-width: 100%;\n height: auto;\n}\r\n/* Make elements with the HTML hidden attribute stay hidden by default */\r\n[hidden] {\n display: none;\n}\r\n*, ::before, ::after {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(59 130 246 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n --tw-contain-size: ;\n --tw-contain-layout: ;\n --tw-contain-paint: ;\n --tw-contain-style: ;\n}\r\n::backdrop {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(59 130 246 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n --tw-contain-size: ;\n --tw-contain-layout: ;\n --tw-contain-paint: ;\n --tw-contain-style: ;\n}\r\n.fixed {\n position: fixed;\n}\r\n.left-0 {\n left: 0px;\n}\r\n.top-0 {\n top: 0px;\n}\r\n.z-\\[1000\\] {\n z-index: 1000;\n}\r\n.flex {\n display: flex;\n}\r\n.h-full {\n height: 100%;\n}\r\n.min-h-\\[35svh\\] {\n min-height: 35svh;\n}\r\n.w-fit {\n width: -moz-fit-content;\n width: fit-content;\n}\r\n.w-full {\n width: 100%;\n}\r\n.min-w-\\[45svw\\] {\n min-width: 45svw;\n}\r\n.flex-col {\n flex-direction: column;\n}\r\n.items-center {\n align-items: center;\n}\r\n.justify-center {\n justify-content: center;\n}\r\n.justify-between {\n justify-content: space-between;\n}\r\n.rounded-lg {\n border-radius: 0.5rem;\n}\r\n.rounded-md {\n border-radius: 0.375rem;\n}\r\n.bg-black\\/60 {\n background-color: rgb(0 0 0 / 0.6);\n}\r\n.bg-blue-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(37 99 235 / var(--tw-bg-opacity));\n}\r\n.bg-gray-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(75 85 99 / var(--tw-bg-opacity));\n}\r\n.bg-green-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(22 163 74 / var(--tw-bg-opacity));\n}\r\n.bg-purple-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(147 51 234 / var(--tw-bg-opacity));\n}\r\n.bg-red-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(220 38 38 / var(--tw-bg-opacity));\n}\r\n.bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity));\n}\r\n.px-10 {\n padding-left: 2.5rem;\n padding-right: 2.5rem;\n}\r\n.px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n}\r\n.px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\r\n.px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\r\n.px-5 {\n padding-left: 1.25rem;\n padding-right: 1.25rem;\n}\r\n.px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\r\n.px-8 {\n padding-left: 2rem;\n padding-right: 2rem;\n}\r\n.py-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n}\r\n.py-1\\.5 {\n padding-top: 0.375rem;\n padding-bottom: 0.375rem;\n}\r\n.py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\r\n.py-3 {\n padding-top: 0.75rem;\n padding-bottom: 0.75rem;\n}\r\n.py-4 {\n padding-top: 1rem;\n padding-bottom: 1rem;\n}\r\n.py-5 {\n padding-top: 1.25rem;\n padding-bottom: 1.25rem;\n}\r\n.align-middle {\n vertical-align: middle;\n}\r\n.text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n}\r\n.text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\r\n.text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n}\r\n.text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\r\n.text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n}\r\n.text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n}\r\n.text-black {\n --tw-text-opacity: 1;\n color: rgb(0 0 0 / var(--tw-text-opacity));\n}\r\n.text-blue-600 {\n --tw-text-opacity: 1;\n color: rgb(37 99 235 / var(--tw-text-opacity));\n}\r\n.text-gray-600 {\n --tw-text-opacity: 1;\n color: rgb(75 85 99 / var(--tw-text-opacity));\n}\r\n.text-green-600 {\n --tw-text-opacity: 1;\n color: rgb(22 163 74 / var(--tw-text-opacity));\n}\r\n.text-purple-600 {\n --tw-text-opacity: 1;\n color: rgb(147 51 234 / var(--tw-text-opacity));\n}\r\n.text-red-600 {\n --tw-text-opacity: 1;\n color: rgb(220 38 38 / var(--tw-text-opacity));\n}\r\n.text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity));\n}\r\n.text-yellow-600 {\n --tw-text-opacity: 1;\n color: rgb(202 138 4 / var(--tw-text-opacity));\n}\r\n.transition-colors {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\r\n.hover\\:bg-blue-700:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(29 78 216 / var(--tw-bg-opacity));\n}\r\n.hover\\:bg-gray-700:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(55 65 81 / var(--tw-bg-opacity));\n}\r\n.hover\\:bg-green-700:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(21 128 61 / var(--tw-bg-opacity));\n}\r\n.hover\\:bg-purple-700:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(126 34 206 / var(--tw-bg-opacity));\n}\r\n.hover\\:bg-red-700:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(185 28 28 / var(--tw-bg-opacity));\n}\r\n";
styleInject(css_248z);
function _defineProperty(e, r, t) {
return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
value: t,
enumerable: !0,
configurable: !0,
writable: !0
}) : e[r] = t, e;
}
function _toPrimitive(t, r) {
if ("object" != typeof t || !t) return t;
var e = t[Symbol.toPrimitive];
if (void 0 !== e) {
var i = e.call(t, r || "default");
if ("object" != typeof i) return i;
throw new TypeError("@@toPrimitive must return a primitive value.");
}
return ("string" === r ? String : Number)(t);
}
function _toPropertyKey(t) {
var i = _toPrimitive(t, "string");
return "symbol" == typeof i ? i : i + "";
}
var ButtonSize = /*#__PURE__*/function (ButtonSize) {
ButtonSize["XSmall"] = "xs";
ButtonSize["Small"] = "sm";
ButtonSize["Medium"] = "md";
ButtonSize["Large"] = "lg";
ButtonSize["XLarge"] = "xl";
ButtonSize["XXLarge"] = "2xl";
return ButtonSize;
}({});
var RedirectButton = function RedirectButton(_ref) {
var children = _ref.children,
color = _ref.color,
path = _ref.path,
size = _ref.size,
textColor = _ref.textColor;
if (!children || children === null) throw new Error("children are missing");
if (!path || path === null) throw new Error("path is missing");
var getColorClasses = function getColorClasses(color) {
if (!color || color === null) throw new Error("Color is missing");
var colorMap = {
blue: 'bg-blue-600 hover:bg-blue-700',
red: 'bg-red-600 hover:bg-red-700',
green: 'bg-green-600 hover:bg-green-700',
purple: 'bg-purple-600 hover:bg-purple-700',
gray: 'bg-gray-600 hover:bg-gray-700'
};
return colorMap[color] || 'bg-blue-600 hover:bg-blue-700';
};
var getTextColorClasses = function getTextColorClasses(textColor) {
if (!textColor) return 'text-white';
var textColorMap = {
white: 'text-white',
black: 'text-black',
blue: 'text-blue-600',
red: 'text-red-600',
green: 'text-green-600',
purple: 'text-purple-600',
gray: 'text-gray-600',
yellow: 'text-yellow-600'
};
return textColorMap[textColor] || 'text-white';
};
var getSizeClasses = function getSizeClasses(size) {
var sizeMap = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, ButtonSize.XSmall, 'px-2 py-1 text-xs'), ButtonSize.Small, 'px-3 py-1.5 text-sm'), ButtonSize.Medium, 'px-4 py-2 text-base'), ButtonSize.Large, 'px-6 py-3 text-lg'), ButtonSize.XLarge, 'px-8 py-4 text-xl'), ButtonSize.XXLarge, 'px-10 py-5 text-2xl');
return sizeMap[size] || sizeMap[ButtonSize.Medium];
};
return /*#__PURE__*/React__default["default"].createElement("button", {
onClick: function onClick(e) {
window.location.href = "".concat(path);
},
className: "".concat(getColorClasses(color), " ").concat(getSizeClasses(size), " ").concat(getTextColorClasses(textColor), " rounded-lg transition-colors")
}, children);
};
var Button = function Button(_ref) {
var children = _ref.children,
color = _ref.color,
callback = _ref.callback,
size = _ref.size,
textColor = _ref.textColor;
if (!children || children === null) throw new Error("children are missing");
if (!callback || callback === null) throw new Error("callback are missing");
var getColorClasses = function getColorClasses(color) {
if (!color || color === null) throw new Error("Color is missing");
var colorMap = {
blue: 'bg-blue-600 hover:bg-blue-700',
red: 'bg-red-600 hover:bg-red-700',
green: 'bg-green-600 hover:bg-green-700',
purple: 'bg-purple-600 hover:bg-purple-700',
gray: 'bg-gray-600 hover:bg-gray-700'
};
return colorMap[color] || 'bg-blue-600 hover:bg-blue-700';
};
var getTextColorClasses = function getTextColorClasses(textColor) {
if (!textColor) return 'text-white';
var textColorMap = {
white: 'text-white',
black: 'text-black',
blue: 'text-blue-600',
red: 'text-red-600',
green: 'text-green-600',
purple: 'text-purple-600',
gray: 'text-gray-600',
yellow: 'text-yellow-600'
};
return textColorMap[textColor] || 'text-white';
};
var getSizeClasses = function getSizeClasses(size) {
var sizeMap = _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, ButtonSize.XSmall, 'px-2 py-1 text-xs'), ButtonSize.Small, 'px-3 py-1.5 text-sm'), ButtonSize.Medium, 'px-4 py-2 text-base'), ButtonSize.Large, 'px-6 py-3 text-lg'), ButtonSize.XLarge, 'px-8 py-4 text-xl'), ButtonSize.XXLarge, 'px-10 py-5 text-2xl');
return sizeMap[size] || sizeMap[ButtonSize.Medium];
};
return /*#__PURE__*/React__default["default"].createElement("button", {
onClick: function onClick() {
return callback();
},
className: "".concat(getColorClasses(color), " ").concat(getSizeClasses(size), " ").concat(getTextColorClasses(textColor), " rounded-lg transition-colors")
}, children);
};
var Modal = function Modal(_ref) {
var children = _ref.children,
isOpen = _ref.isOpen,
close = _ref.close,
portalPath = _ref.portalPath;
var rootDiv = document.getElementById("".concat(portalPath));
if (!rootDiv) {
throw new Error("Portal element with id '".concat(portalPath, "' not found"));
}
if (!isOpen) return null;
return /*#__PURE__*/ReactDOM__default["default"].createPortal(/*#__PURE__*/React__default["default"].createElement("div", {
className: "fixed top-0 left-0 w-full h-full bg-black/60 flex justify-center items-center z-[1000]"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "flex flex-col justify-between items-center bg-white py-4 px-5 rounded-md min-w-[45svw] min-h-[35svh]"
}, /*#__PURE__*/React__default["default"].createElement("div", {
className: "w-full flex align-middle justify-center"
}, children), /*#__PURE__*/React__default["default"].createElement("div", {
className: "w-fit flex align-middle justify-center"
}, /*#__PURE__*/React__default["default"].createElement(Button, {
size: ButtonSize.Small,
color: "red",
callback: close
}, "Close")))), document.getElementById("".concat(portalPath)));
};
exports.Button = Button;
exports.ButtonSize = ButtonSize;
exports.Modal = Modal;
exports.RedirectButton = RedirectButton;
//# sourceMappingURL=index.js.map