phx-uikit 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022 Igor Gaponov (gapon2401)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,11 @@
+## Installation:
+
+```bash
+npm install phx-react --save-dev
+```
+
+or
+
+```bash
+yarn add -D phx-react
+```

package/dist/cjs/commons/ErrorMessage.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+interface Props {
+    message: string;
+}
+declare function ErrorMessage({ message }: Props): React.JSX.Element;
+export default ErrorMessage;

package/dist/cjs/commons/ErrorMessage.js

@@ -0,0 +1,13 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+function ErrorMessage(_a) {
+    var message = _a.message;
+    return (react_1["default"].createElement("div", { className: 'ml-1 mt-1 flex items-center' },
+        react_1["default"].createElement("svg", { className: 'mr-1 h-4 w-4 text-red-500', fill: 'none', stroke: 'currentColor', strokeWidth: '2', viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg' },
+            react_1["default"].createElement("path", { d: 'M12 9v3.75m9-.75a9 9 0 11-18 0 9 9 0 0118 0zm-9 3.75h.008v.008H12v-.008z', strokeLinecap: 'round', strokeLinejoin: 'round' })),
+        react_1["default"].createElement("p", { className: 'text-xs text-red-800' }, message)));
+}
+exports["default"] = ErrorMessage;
+//# sourceMappingURL=ErrorMessage.js.map

package/dist/cjs/commons/ErrorMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorMessage.js","sourceRoot":"","sources":["../../../src/commons/ErrorMessage.tsx"],"names":[],"mappings":";;;AAAA,wDAAyB;AAMzB,SAAS,YAAY,CAAC,EAAkB;QAAhB,OAAO,aAAA;IAC7B,OAAO,CACL,0CAAK,SAAS,EAAC,6BAA6B;QAC1C,0CACE,SAAS,EAAC,2BAA2B,EACrC,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,GAAG,EACf,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B;YAElC,2CACE,CAAC,EAAC,0EAA0E,EAC5E,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,GACtB,CACE;QAEN,wCAAG,SAAS,EAAC,sBAAsB,IAAE,OAAO,CAAK,CAC7C,CACP,CAAA;AACH,CAAC;AAED,qBAAe,YAAY,CAAA"}

package/dist/cjs/commons/IconLoading.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+export interface IconLoadingProps {
+    color?: 'bg-gray-50' | 'text-white' | 'text-red-50' | 'bg-transparent';
+}
+export declare const IconLoading: ({ color }: IconLoadingProps) => React.JSX.Element;

package/dist/cjs/commons/IconLoading.js

@@ -0,0 +1,20 @@
+"use strict";
+exports.__esModule = true;
+exports.IconLoading = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var IconLoading = function (_a) {
+    var _b = _a.color, color = _b === void 0 ? 'text-white' : _b;
+    function classNames() {
+        var classes = [];
+        for (var _i = 0; _i < arguments.length; _i++) {
+            classes[_i] = arguments[_i];
+        }
+        return classes.filter(Boolean).join(' ');
+    }
+    return (react_1["default"].createElement("svg", { className: classNames('animate-spin -ml-1 mr-3 h-5 w-5', color), xmlns: 'http://www.w3.org/2000/svg', fill: 'none', viewBox: '0 0 24 24' },
+        react_1["default"].createElement("circle", { className: 'opacity-25', cx: '12', cy: '12', r: '10', stroke: 'currentColor', strokeWidth: '4' }),
+        react_1["default"].createElement("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' })));
+};
+exports.IconLoading = IconLoading;
+//# sourceMappingURL=IconLoading.js.map

package/dist/cjs/commons/IconLoading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconLoading.js","sourceRoot":"","sources":["../../../src/commons/IconLoading.tsx"],"names":[],"mappings":";;;;AAAA,wDAAyB;AAMlB,IAAM,WAAW,GAAG,UAAC,EAA0C;QAAxC,aAAoB,EAApB,KAAK,mBAAG,YAAY,KAAA;IAChD,SAAS,UAAU;QAAC,iBAAoB;aAApB,UAAoB,EAApB,qBAAoB,EAApB,IAAoB;YAApB,4BAAoB;;QACtC,OAAO,OAAO,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;IAC1C,CAAC;IAED,OAAO,CACL,0CACE,SAAS,EAAE,UAAU,CAAC,iCAAiC,EAAE,KAAK,CAAC,EAC/D,KAAK,EAAC,4BAA4B,EAClC,IAAI,EAAC,MAAM,EACX,OAAO,EAAC,WAAW;QAEnB,6CAAQ,SAAS,EAAC,YAAY,EAAC,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,CAAC,EAAC,IAAI,EAAC,MAAM,EAAC,cAAc,EAAC,WAAW,EAAC,GAAG,GAAU;QACrG,2CACE,SAAS,EAAC,YAAY,EACtB,IAAI,EAAC,cAAc,EACnB,CAAC,EAAC,iHAAiH,GAC7G,CACJ,CACP,CAAA;AACH,CAAC,CAAA;AApBY,QAAA,WAAW,eAoBvB"}

package/dist/cjs/components/App.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const MyCounter: () => React.JSX.Element;
+export default MyCounter;

package/dist/cjs/components/App.js

@@ -0,0 +1,69 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var solid_1 = require("@heroicons/react/20/solid");
+var react_2 = require("@headlessui/react");
+var moods = [
+    { name: 'Excited', value: 'excited', icon: solid_1.FireIcon, iconColor: 'text-white', bgColor: 'bg-red-500' },
+    { name: 'Loved', value: 'loved', icon: solid_1.HeartIcon, iconColor: 'text-white', bgColor: 'bg-pink-400' },
+    { name: 'Happy', value: 'happy', icon: solid_1.FaceSmileIcon, iconColor: 'text-white', bgColor: 'bg-green-400' },
+    { name: 'Sad', value: 'sad', icon: solid_1.FaceFrownIcon, iconColor: 'text-white', bgColor: 'bg-yellow-400' },
+    { name: 'Thumbsy', value: 'thumbsy', icon: solid_1.HandThumbUpIcon, iconColor: 'text-white', bgColor: 'bg-blue-500' },
+    { name: 'I feel nothing', value: null, icon: solid_1.XMarkIcon, iconColor: 'text-gray-400', bgColor: 'bg-transparent' },
+];
+function classNames() {
+    var classes = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        classes[_i] = arguments[_i];
+    }
+    return classes.filter(Boolean).join(' ');
+}
+var MyCounter = function () {
+    var _a = (0, react_1.useState)(moods[5]), selected = _a[0], setSelected = _a[1];
+    return (react_1["default"].createElement("div", null,
+        react_1["default"].createElement("div", { className: 'flex items-start space-x-4' },
+            react_1["default"].createElement("div", { className: 'flex-shrink-0' },
+                react_1["default"].createElement("img", { className: 'inline-block h-10 w-10 rounded-full', src: 'https://images.unsplash.com/photo-1550525811-e5869dd03032?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80', alt: '' })),
+            react_1["default"].createElement("div", { className: 'min-w-0 flex-1' },
+                react_1["default"].createElement("form", { action: '#', className: 'relative' },
+                    react_1["default"].createElement("div", { className: 'overflow-hidden rounded-lg shadow-sm ring-1 ring-inset ring-gray-300 focus-within:ring-2 focus-within:ring-indigo-600' },
+                        react_1["default"].createElement("label", { htmlFor: 'comment', className: 'sr-only' }, "Add your comment"),
+                        react_1["default"].createElement("textarea", { rows: 3, name: 'comment', id: 'comment', className: 'block w-full resize-none border-0 bg-transparent py-1.5 text-gray-900 placeholder:text-gray-400 focus:ring-0 sm:text-sm sm:leading-6', placeholder: 'Add your comment...', defaultValue: '' }),
+                        react_1["default"].createElement("div", { className: 'py-2', "aria-hidden": 'true' },
+                            react_1["default"].createElement("div", { className: 'py-px' },
+                                react_1["default"].createElement("div", { className: 'h-9' })))),
+                    react_1["default"].createElement("div", { className: 'absolute inset-x-0 bottom-0 flex justify-between py-2 pl-3 pr-2' },
+                        react_1["default"].createElement("div", { className: 'flex items-center space-x-5' },
+                            react_1["default"].createElement("div", { className: 'flex items-center' },
+                                react_1["default"].createElement("button", { type: 'button', className: '-m-2.5 flex h-10 w-10 items-center justify-center rounded-full text-gray-400 hover:text-gray-500' },
+                                    react_1["default"].createElement(solid_1.PaperClipIcon, { className: 'h-5 w-5', "aria-hidden": 'true' }),
+                                    react_1["default"].createElement("span", { className: 'sr-only' }, "Attach a file"))),
+                            react_1["default"].createElement("div", { className: 'flex items-center' },
+                                react_1["default"].createElement(react_2.Listbox, { value: selected, onChange: setSelected }, function (_a) {
+                                    var open = _a.open;
+                                    return (react_1["default"].createElement(react_1["default"].Fragment, null,
+                                        react_1["default"].createElement(react_2.Listbox.Label, { className: 'sr-only' }, "Your mood"),
+                                        react_1["default"].createElement("div", { className: 'relative' },
+                                            react_1["default"].createElement(react_2.Listbox.Button, { className: 'relative -m-2.5 flex h-10 w-10 items-center justify-center rounded-full text-gray-400 hover:text-gray-500' },
+                                                react_1["default"].createElement("span", { className: 'flex items-center justify-center' }, selected.value === null ? (react_1["default"].createElement("span", null,
+                                                    react_1["default"].createElement(solid_1.FaceSmileIcon, { className: 'h-5 w-5 flex-shrink-0', "aria-hidden": 'true' }),
+                                                    react_1["default"].createElement("span", { className: 'sr-only' }, "Add your mood"))) : (react_1["default"].createElement("span", null,
+                                                    react_1["default"].createElement("span", { className: classNames(selected.bgColor, 'flex h-8 w-8 items-center justify-center rounded-full') },
+                                                        react_1["default"].createElement(selected.icon, { className: 'h-5 w-5 flex-shrink-0 text-white', "aria-hidden": 'true' })),
+                                                    react_1["default"].createElement("span", { className: 'sr-only' }, selected.name))))),
+                                            react_1["default"].createElement(react_2.Transition, { show: open, as: react_1.Fragment, leave: 'transition ease-in duration-100', leaveFrom: 'opacity-100', leaveTo: 'opacity-0' },
+                                                react_1["default"].createElement(react_2.Listbox.Options, { className: 'absolute z-10 -ml-6 mt-1 w-60 rounded-lg bg-white py-3 text-base shadow ring-1 ring-black ring-opacity-5 focus:outline-none sm:ml-auto sm:w-64 sm:text-sm' }, moods.map(function (mood) { return (react_1["default"].createElement(react_2.Listbox.Option, { key: mood.value, className: function (_a) {
+                                                        var active = _a.active;
+                                                        return classNames(active ? 'bg-gray-100' : 'bg-white', 'relative cursor-default select-none px-3 py-2');
+                                                    }, value: mood },
+                                                    react_1["default"].createElement("div", { className: 'flex items-center' },
+                                                        react_1["default"].createElement("div", { className: classNames(mood.bgColor, 'flex h-8 w-8 items-center justify-center rounded-full') },
+                                                            react_1["default"].createElement(mood.icon, { className: classNames(mood.iconColor, 'h-5 w-5 flex-shrink-0'), "aria-hidden": 'true' })),
+                                                        react_1["default"].createElement("span", { className: 'ml-3 block truncate font-medium' }, mood.name)))); }))))));
+                                }))),
+                        react_1["default"].createElement("div", { className: 'flex-shrink-0' },
+                            react_1["default"].createElement("button", { type: 'submit', className: 'inline-flex items-center rounded-md bg-indigo-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600' }, "Post"))))))));
+};
+exports["default"] = MyCounter;
+//# sourceMappingURL=App.js.map

package/dist/cjs/components/App.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"App.js","sourceRoot":"","sources":["../../../src/components/App.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/Badge/Badge.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export interface BadgeProps {
+    type?: 'default' | 'informational' | 'success' | 'attention' | 'warning' | 'danger';
+    text?: string;
+    className?: string;
+    removeButton?: boolean;
+    onClick?(): void;
+}
+export declare function PHXBadge({ text, type, className, removeButton, onClick }: BadgeProps): React.JSX.Element;

package/dist/cjs/components/Badge/Badge.js

@@ -0,0 +1,17 @@
+"use strict";
+exports.__esModule = true;
+exports.PHXBadge = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var types_1 = require("../types");
+function PHXBadge(_a) {
+    var text = _a.text, _b = _a.type, type = _b === void 0 ? 'default' : _b, className = _a.className, removeButton = _a.removeButton, onClick = _a.onClick;
+    var typeClassName = (0, types_1.classNames)(type === 'default' && 'bg-[#e4e4e4] text-[#616161]', type === 'success' && 'bg-[#cdfee1] text-[#0c5132]', type === 'informational' && 'bg-[#e0f0ff] text-[#00527c]', type === 'attention' && 'bg-[#ffef9d] text-[#4f4700]', type === 'warning' && 'bg-[#ffd6a4] text-[#5e4200]', type === 'danger' && 'bg-[#fedad9] text-[#8e1f0b]');
+    return (react_1["default"].createElement("span", { className: (0, types_1.classNames)("rounded-lg py-0.5 text-xs font-normal leading-4 ".concat(typeClassName, " ").concat(className), removeButton ? 'pl-2 pr-0 flex items-center w-fit' : 'px-2') },
+        text,
+        removeButton && (react_1["default"].createElement("button", { onClick: onClick, className: 'px-0.5 ml-1 py-0.5 rounded-lg hover:bg-gray-300' },
+            react_1["default"].createElement("svg", { xmlns: 'http://www.w3.org/2000/svg', fill: 'none', viewBox: '0 0 24 24', strokeWidth: '1.5', stroke: 'currentColor', className: 'w-3 h-3' },
+                react_1["default"].createElement("path", { strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M6 18L18 6M6 6l12 12' }))))));
+}
+exports.PHXBadge = PHXBadge;
+//# sourceMappingURL=Badge.js.map

package/dist/cjs/components/Badge/Badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.js","sourceRoot":"","sources":["../../../../src/components/Badge/Badge.tsx"],"names":[],"mappings":";;;;AAAA,wDAAyB;AACzB,kCAAqC;AAUrC,SAAgB,QAAQ,CAAC,EAAwE;QAAtE,IAAI,UAAA,EAAE,YAAgB,EAAhB,IAAI,mBAAG,SAAS,KAAA,EAAE,SAAS,eAAA,EAAE,YAAY,kBAAA,EAAE,OAAO,aAAA;IACjF,IAAM,aAAa,GAAG,IAAA,kBAAU,EAC9B,IAAI,KAAK,SAAS,IAAI,6BAA6B,EACnD,IAAI,KAAK,SAAS,IAAI,6BAA6B,EACnD,IAAI,KAAK,eAAe,IAAI,6BAA6B,EACzD,IAAI,KAAK,WAAW,IAAI,6BAA6B,EACrD,IAAI,KAAK,SAAS,IAAI,6BAA6B,EACnD,IAAI,KAAK,QAAQ,IAAI,6BAA6B,CACnD,CAAA;IACD,OAAO,CACL,2CACE,SAAS,EAAE,IAAA,kBAAU,EACnB,0DAAmD,aAAa,cAAI,SAAS,CAAE,EAC/E,YAAY,CAAC,CAAC,CAAC,mCAAmC,CAAC,CAAC,CAAC,MAAM,CAC5D;QAEA,IAAI;QACJ,YAAY,IAAI,CACf,6CAAQ,OAAO,EAAE,OAAO,EAAE,SAAS,EAAC,iDAAiD;YACnF,0CACE,KAAK,EAAC,4BAA4B,EAClC,IAAI,EAAC,MAAM,EACX,OAAO,EAAC,WAAW,EACnB,WAAW,EAAC,KAAK,EACjB,MAAM,EAAC,cAAc,EACrB,SAAS,EAAC,SAAS;gBAEnB,2CAAM,aAAa,EAAC,OAAO,EAAC,cAAc,EAAC,OAAO,EAAC,CAAC,EAAC,sBAAsB,GAAG,CAC1E,CACC,CACV,CACI,CACR,CAAA;AACH,CAAC;AAjCD,4BAiCC"}

package/dist/cjs/components/Badge/index.d.ts

@@ -0,0 +1 @@
+export * from './Badge';

package/dist/cjs/components/Badge/index.js

@@ -0,0 +1,5 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./Badge"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Badge/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Badge/index.ts"],"names":[],"mappings":";;;AAAA,kDAAuB"}

package/dist/cjs/components/Banner/Banner.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { ComplexAction } from '../types';
+export interface BannerProps {
+    type?: 'informational' | 'success' | 'warning' | 'danger';
+    title?: string;
+    description?: string;
+    className?: string;
+    onClose?(): void;
+    show?: boolean;
+    action?: ComplexAction;
+    primaryAction?: ComplexAction;
+    secondaryAction?: ComplexAction;
+    dangerAction?: ComplexAction;
+    children?: any;
+    hideCloseButton?: boolean;
+}
+export declare const PHXBanner: ({ type, className, title, description, hideCloseButton, onClose, show, action, primaryAction, secondaryAction, dangerAction, children, }: BannerProps) => React.JSX.Element;

package/dist/cjs/components/Banner/Banner.js

@@ -0,0 +1,41 @@
+"use strict";
+'use client';
+exports.__esModule = true;
+exports.PHXBanner = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var types_1 = require("../types");
+var Button_1 = require("../Button");
+var PHXBanner = function (_a) {
+    var _b = _a.type, type = _b === void 0 ? 'informational' : _b, className = _a.className, title = _a.title, description = _a.description, _c = _a.hideCloseButton, hideCloseButton = _c === void 0 ? false : _c, onClose = _a.onClose, show = _a.show, action = _a.action, primaryAction = _a.primaryAction, secondaryAction = _a.secondaryAction, dangerAction = _a.dangerAction, children = _a.children;
+    var classNameType = (0, types_1.classNames)(type === 'informational' && 'bg-[#91d0ff]', type === 'success' && 'bg-[#29845a] text-white', type === 'warning' && 'bg-[#ffb800]', type === 'danger' && 'bg-[#e51c00] text-white');
+    var Icon = function () { return (react_1["default"].createElement(react_1["default"].Fragment, null,
+        type === 'informational' && (react_1["default"].createElement("svg", { className: 'mr-2 h-4 w-4', fill: 'none', stroke: 'currentColor', strokeWidth: '2', viewBox: '0 0 22 22', xmlns: 'http://www.w3.org/2000/svg' },
+            react_1["default"].createElement("path", { d: 'M12 9v3.75m9-.75a9 9 0 11-18 0 9 9 0 0118 0zm-9 3.75h.008v.008H12v-.008z', strokeLinecap: 'round', strokeLinejoin: 'round' }))),
+        type === 'success' && (react_1["default"].createElement("svg", { className: 'mr-2 h-3 w-3', fill: 'none', stroke: 'currentColor', strokeWidth: '3', viewBox: '0 0 22 22', xmlns: 'http://www.w3.org/2000/svg' },
+            react_1["default"].createElement("path", { d: 'M4.5 12.75l6 6 9-13.5', strokeLinecap: 'round', strokeLinejoin: 'round' }))),
+        type === 'warning' && (react_1["default"].createElement("svg", { className: 'mr-2 h-4 w-4', fill: 'none', stroke: 'currentColor', strokeWidth: '2', viewBox: '0 0 22 22', xmlns: 'http://www.w3.org/2000/svg' },
+            react_1["default"].createElement("path", { d: 'M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126zM12 15.75h.007v.008H12v-.008z', strokeLinecap: 'round', strokeLinejoin: 'round' }))),
+        type === 'danger' && (react_1["default"].createElement("svg", { className: 'mr-2 h-4 w-4', fill: 'none', stroke: 'currentColor', strokeWidth: '2', viewBox: '0 0 22 22', xmlns: 'http://www.w3.org/2000/svg' },
+            react_1["default"].createElement("path", { d: 'M12 9v3.75m0-10.036A11.959 11.959 0 013.598 6 11.99 11.99 0 003 9.75c0 5.592 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.31-.21-2.57-.598-3.75h-.152c-3.196 0-6.1-1.249-8.25-3.286zm0 13.036h.008v.008H12v-.008z', strokeLinecap: 'round', strokeLinejoin: 'round' }))))); };
+    return show ? (react_1["default"].createElement("div", { className: "flex w-full flex-col rounded-lg border bg-white text-xs shadow-[0rem_0.1rem_0rem_#00000012] ".concat(className) },
+        react_1["default"].createElement("div", { className: "flex items-center justify-between rounded-tl-lg rounded-tr-lg bg-[#29845a] px-3 py-2 font-medium leading-3 ".concat(classNameType) },
+            react_1["default"].createElement("div", { className: 'flex items-center' },
+                react_1["default"].createElement(Icon, null),
+                react_1["default"].createElement("span", null, title)),
+            react_1["default"].createElement("div", null,
+                react_1["default"].createElement("button", { className: "rounded-md p-1 hover:bg-[#1a1a1a0d] hover:text-gray-600 ".concat(hideCloseButton ? 'invisible' : ''), type: 'button', onClick: onClose },
+                    react_1["default"].createElement("span", { className: 'sr-only' }, "Close"),
+                    react_1["default"].createElement("svg", { className: 'h-4 w-4', fill: 'none', stroke: 'currentColor', strokeWidth: '2', viewBox: '0 0 24 24', xmlns: 'http://www.w3.org/2000/svg' },
+                        react_1["default"].createElement("path", { d: 'M6 18L18 6M6 6l12 12', strokeLinecap: 'round', strokeLinejoin: 'round' }))))),
+        react_1["default"].createElement("div", { className: 'px-4' },
+            react_1["default"].createElement("div", { className: 'pb-3 pt-3.5 text-gray-600' }, description),
+            children && react_1["default"].createElement("div", { className: 'pb-3' }, children),
+            action || primaryAction || secondaryAction || dangerAction ? (react_1["default"].createElement("div", { className: 'pb-4 flex gap-x-2' },
+                action && (react_1["default"].createElement(Button_1.PHXButton, { size: 'small', secondary: true, onClick: action.onClick }, action.content)),
+                primaryAction && (react_1["default"].createElement(Button_1.PHXButton, { size: 'small', primary: true, onClick: primaryAction.onClick }, primaryAction.content)),
+                secondaryAction && (react_1["default"].createElement(Button_1.PHXButton, { size: 'small', secondary: true, onClick: secondaryAction.onClick }, secondaryAction.content)),
+                dangerAction && (react_1["default"].createElement(Button_1.PHXButton, { size: 'small', danger2: true, onClick: dangerAction.onClick }, dangerAction.content)))) : (react_1["default"].createElement(react_1["default"].Fragment, null))))) : (react_1["default"].createElement(react_1["default"].Fragment, null));
+};
+exports.PHXBanner = PHXBanner;
+//# sourceMappingURL=Banner.js.map

package/dist/cjs/components/Banner/Banner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Banner.js","sourceRoot":"","sources":["../../../../src/components/Banner/Banner.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAA;;;;AACZ,wDAAyB;AACzB,kCAAoD;AACpD,oCAAqC;AAiB9B,IAAM,SAAS,GAAG,UAAC,EAaZ;QAZZ,YAAsB,EAAtB,IAAI,mBAAG,eAAe,KAAA,EACtB,SAAS,eAAA,EACT,KAAK,WAAA,EACL,WAAW,iBAAA,EACX,uBAAuB,EAAvB,eAAe,mBAAG,KAAK,KAAA,EACvB,OAAO,aAAA,EACP,IAAI,UAAA,EACJ,MAAM,YAAA,EACN,aAAa,mBAAA,EACb,eAAe,qBAAA,EACf,YAAY,kBAAA,EACZ,QAAQ,cAAA;IAER,IAAM,aAAa,GAAG,IAAA,kBAAU,EAC9B,IAAI,KAAK,eAAe,IAAI,cAAc,EAC1C,IAAI,KAAK,SAAS,IAAI,yBAAyB,EAC/C,IAAI,KAAK,SAAS,IAAI,cAAc,EACpC,IAAI,KAAK,QAAQ,IAAI,yBAAyB,CAC/C,CAAA;IAED,IAAM,IAAI,GAAG,cAAM,OAAA,CACjB;QACG,IAAI,KAAK,eAAe,IAAI,CAC3B,0CACE,SAAS,EAAC,cAAc,EACxB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,GAAG,EACf,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B;YAElC,2CACE,CAAC,EAAC,0EAA0E,EAC5E,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,GACtB,CACE,CACP;QACA,IAAI,KAAK,SAAS,IAAI,CACrB,0CACE,SAAS,EAAC,cAAc,EACxB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,GAAG,EACf,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B;YAElC,2CAAM,CAAC,EAAC,uBAAuB,EAAC,aAAa,EAAC,OAAO,EAAC,cAAc,EAAC,OAAO,GAAG,CAC3E,CACP;QACA,IAAI,KAAK,SAAS,IAAI,CACrB,0CACE,SAAS,EAAC,cAAc,EACxB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,GAAG,EACf,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B;YAElC,2CACE,CAAC,EAAC,kLAAkL,EACpL,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,GACtB,CACE,CACP;QACA,IAAI,KAAK,QAAQ,IAAI,CACpB,0CACE,SAAS,EAAC,cAAc,EACxB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,GAAG,EACf,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B;YAElC,2CACE,CAAC,EAAC,2NAA2N,EAC7N,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,GACtB,CACE,CACP,CACA,CACJ,EA/DkB,CA+DlB,CAAA;IAED,OAAO,IAAI,CAAC,CAAC,CAAC,CACZ,0CACE,SAAS,EAAE,sGAA+F,SAAS,CAAE;QAErH,0CACE,SAAS,EAAE,qHAA8G,aAAa,CAAE;YAExI,0CAAK,SAAS,EAAC,mBAAmB;gBAChC,iCAAC,IAAI,OAAG;gBACR,+CAAO,KAAK,CAAQ,CAChB;YACN;gBACE,6CACE,SAAS,EAAE,kEAA2D,eAAe,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAE,EAC1G,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,OAAO;oBAEhB,2CAAM,SAAS,EAAC,SAAS,YAAa;oBACtC,0CACE,SAAS,EAAC,SAAS,EACnB,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,GAAG,EACf,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B;wBAElC,2CAAM,CAAC,EAAC,sBAAsB,EAAC,aAAa,EAAC,OAAO,EAAC,cAAc,EAAC,OAAO,GAAG,CAC1E,CACC,CACL,CACF;QACN,0CAAK,SAAS,EAAC,MAAM;YACnB,0CAAK,SAAS,EAAC,2BAA2B,IAAE,WAAW,CAAO;YAC7D,QAAQ,IAAI,0CAAK,SAAS,EAAC,MAAM,IAAE,QAAQ,CAAO;YAClD,MAAM,IAAI,aAAa,IAAI,eAAe,IAAI,YAAY,CAAC,CAAC,CAAC,CAC5D,0CAAK,SAAS,EAAC,mBAAmB;gBAC/B,MAAM,IAAI,CACT,iCAAC,kBAAS,IAAC,IAAI,EAAC,OAAO,EAAC,SAAS,QAAC,OAAO,EAAE,MAAM,CAAC,OAAO,IACtD,MAAM,CAAC,OAAO,CACL,CACb;gBACA,aAAa,IAAI,CAChB,iCAAC,kBAAS,IAAC,IAAI,EAAC,OAAO,EAAC,OAAO,QAAC,OAAO,EAAE,aAAa,CAAC,OAAO,IAC3D,aAAa,CAAC,OAAO,CACZ,CACb;gBACA,eAAe,IAAI,CAClB,iCAAC,kBAAS,IAAC,IAAI,EAAC,OAAO,EAAC,SAAS,QAAC,OAAO,EAAE,eAAe,CAAC,OAAO,IAC/D,eAAe,CAAC,OAAO,CACd,CACb;gBACA,YAAY,IAAI,CACf,iCAAC,kBAAS,IAAC,IAAI,EAAC,OAAO,EAAC,OAAO,QAAC,OAAO,EAAE,YAAY,CAAC,OAAO,IAC1D,YAAY,CAAC,OAAO,CACX,CACb,CACG,CACP,CAAC,CAAC,CAAC,CACF,mEAAK,CACN,CACG,CACF,CACP,CAAC,CAAC,CAAC,CACF,mEAAK,CACN,CAAA;AACH,CAAC,CAAA;AAvJY,QAAA,SAAS,aAuJrB"}

package/dist/cjs/components/Banner/index.d.ts

@@ -0,0 +1 @@
+export * from './Banner';

package/dist/cjs/components/Banner/index.js

@@ -0,0 +1,5 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./Banner"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Banner/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Banner/index.ts"],"names":[],"mappings":";;;AAAA,mDAAwB"}

package/dist/cjs/components/Button/Button.d.ts

@@ -0,0 +1,32 @@
+import React from 'react';
+import * as SolidIcons from '@heroicons/react/24/solid';
+import * as OutlineIcons from '@heroicons/react/24/outline';
+import { BaseButton } from '../types';
+export type IconName = keyof typeof SolidIcons | keyof typeof OutlineIcons;
+export interface ButtonProps extends BaseButton {
+    primary?: boolean;
+    secondary?: boolean;
+    danger?: boolean;
+    danger2?: boolean;
+    soft?: boolean;
+    plain?: boolean;
+    tertiary?: boolean;
+    plainCritical?: boolean;
+    primaryCritical?: boolean;
+    split?: boolean;
+    options?: Array<{
+        name: string;
+        onClick(): any;
+    }>;
+    deleted?: boolean;
+    deletedButton?: boolean;
+    rounded?: boolean;
+    size?: 'micro' | 'small' | 'medium' | 'large' | 'extra-large' | 'extra-micro';
+    children?: string | string[];
+    icon?: IconName;
+    iconClassName?: string;
+    iconOutline?: boolean;
+    iconPosition?: 'before' | 'after';
+    style?: any;
+}
+export declare const PHXButton: ({ primary, secondary, danger, danger2, plain, tertiary, plainCritical, primaryCritical, split, options, soft, deleted, deletedButton, rounded, submit, size, children, icon, iconClassName, iconOutline, iconPosition, disabled, loading, id, onClick, className, style, }: ButtonProps) => React.JSX.Element;

package/dist/cjs/components/Button/Button.js

@@ -0,0 +1,91 @@
+"use strict";
+exports.__esModule = true;
+exports.PHXButton = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var SolidIcons = tslib_1.__importStar(require("@heroicons/react/24/solid"));
+var OutlineIcons = tslib_1.__importStar(require("@heroicons/react/24/outline"));
+var IconLoading_1 = require("../../commons/IconLoading");
+var types_1 = require("../types");
+var use_disable_interaction_1 = require("../../utils/use-disable-interaction");
+var ButtonStyle_1 = tslib_1.__importDefault(require("./styles/ButtonStyle"));
+var react_2 = require("@headlessui/react");
+var PHXButton = function (_a) {
+    var primary = _a.primary, secondary = _a.secondary, danger = _a.danger, danger2 = _a.danger2, plain = _a.plain, tertiary = _a.tertiary, plainCritical = _a.plainCritical, primaryCritical = _a.primaryCritical, split = _a.split, options = _a.options, soft = _a.soft, deleted = _a.deleted, _b = _a.deletedButton, deletedButton = _b === void 0 ? true : _b, rounded = _a.rounded, submit = _a.submit, _c = _a.size, size = _c === void 0 ? 'medium' : _c, children = _a.children, icon = _a.icon, iconClassName = _a.iconClassName, _d = _a.iconOutline, iconOutline = _d === void 0 ? false : _d, _e = _a.iconPosition, iconPosition = _e === void 0 ? 'before' : _e, _f = _a.disabled, disabled = _f === void 0 ? false : _f, _g = _a.loading, loading = _g === void 0 ? false : _g, id = _a.id, onClick = _a.onClick, className = _a.className, style = _a.style;
+    var Icon;
+    if (icon) {
+        Icon = iconOutline ? OutlineIcons[icon] : SolidIcons[icon];
+    }
+    var commonProps = {
+        id: id,
+        onClick: onClick
+    };
+    var interactiveProps = tslib_1.__assign({}, commonProps);
+    var handleClick = (0, use_disable_interaction_1.useDisableClick)(disabled, onClick);
+    var isNew = !plain && !tertiary && !plainCritical;
+    var binClassNames = (0, types_1.classNames)(primary &&
+        "primary bg-indigo-700 font-normal text-white shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600 ".concat(!disabled
+            ? 'hover:bg-indigo-800 hover:text-gray-200 active:text-gray-400 active:shadow-[0rem_0.125rem_0.1rem_0rem_#0004_inset] active:bg-indigo-900'
+            : ''), split &&
+        "bg-indigo-800 font-normal text-white shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600 ".concat(!disabled
+            ? 'hover:bg-indigo-900 hover:text-gray-200 active:text-gray-400 active:shadow-[0rem_0.125rem_0.1rem_0rem_#0004_inset] active:bg-indigo-900'
+            : ''), secondary &&
+        "bg-white font-normal text-gray-900 shadow-sm border border-gray-300 border-b-gray-400 ".concat(!disabled
+            ? 'hover:bg-gray-100 active:bg-gray-200 active:border-b-gray-300 active:shadow-[0rem_0.125rem_0.1rem_0rem_#0004_inset]'
+            : ''), primaryCritical &&
+        "bg-[#d80b0b] font-normal text-white shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600 ".concat(!disabled
+            ? 'hover:bg-[#a91212] hover:text-gray-200 active:text-gray-400 active:shadow-[0rem_0.125rem_0.1rem_0rem_#0004_inset] active:bg-[#8d0606]'
+            : ''), plain && "active:text-[#4d5c86] hover:text-[#0e339f] hover:underline text-[#0f3dc7]", tertiary && "hover:bg-gray-100 rounded-lg active:bg-gray-200 ", plainCritical && 'active:text-[#9e5b5b] hover:text-[#900d0d] hover:underline text-[#b30f0f]', danger &&
+        "bg-[#e51c00] font-normal text-white shadow-sm danger ".concat(!disabled ? 'hover:bg-[#b5260b] active:bg-[#8e1f0b] active:shadow-[0rem_0.125rem_0rem_0rem_#414141_inset]' : ''), danger2 &&
+        "font-normal text-red-600 shadow-sm ring-1 ring-inset ring-red-600 ".concat(!disabled ? 'hover:bg-red-100 active:bg-red-200 active:shadow-[0rem_0.125rem_0rem_0rem_#e73737_inset]' : ''), deleted &&
+        "bg-indigo-50 font-normal text-red-800 shadow-sm ".concat(!disabled ? 'hover:bg-indigo-100 active:shadow-[0rem_0.125rem_0.1rem_0rem_#0004_inset]' : ''), rounded && 'rounded-full', soft &&
+        "bg-indigo-50 font-normal text-gray-700 shadow-sm ".concat(!disabled ? 'hover:bg-indigo-100 active:shadow-[0rem_0.125rem_0.1rem_0rem_#0004_inset]' : ''), size === 'micro' &&
+        isNew &&
+        "px-2 py-1 text-xs rounded-lg ".concat(!disabled ? 'active:pt-[0.3rem] active:pb-[0.2rem]' : ''), size === 'small' &&
+        isNew &&
+        "px-2.5 py-1.5 text-xs rounded-lg ".concat(!disabled ? 'active:pt-[0.45rem] active:pb-[0.3rem]' : ''), size === 'medium' &&
+        isNew &&
+        "px-2.5 py-1.5 text-sm rounded-lg ".concat(!disabled ? 'active:pt-[0.45rem] active:pb-[0.3rem]' : ''), size === 'large' &&
+        isNew &&
+        "px-3 py-2 text-sm rounded-lg ".concat(!disabled ? 'active:pt-[0.55rem] active:pb-[0.45rem]' : ''), size === 'extra-large' &&
+        isNew &&
+        "px-3.5 py-2.5 text-sm rounded-lg ".concat(!disabled ? 'active:pt-[0.7rem] active:pb-[0.55rem]' : ''), size === 'micro' && "px-2 py-1 text-xs rounded-lg", size === 'small' && "px-2.5 py-1.5 text-xs rounded-lg ", size === 'extra-micro' && "px-1.5 py-1 text-xs rounded-lg ", size === 'medium' && "px-2.5 py-1.5 text-sm rounded-lg ", size === 'large' && "px-3 py-2 text-sm rounded-lg", size === 'extra-large' && "px-3.5 py-2.5 text-sm rounded-lg ", icon && (size === 'medium' || size === 'large') && 'inline-flex items-center gap-x-1.5', icon && size === 'extra-large' && 'inline-flex items-center gap-x-2', loading && 'opacity-30', 'relative', disabled && 'opacity-30 cursor-default', className);
+    var iconClass = (0, types_1.classNames)(icon && iconPosition === 'before' && size !== 'extra-micro' && 'h-5 w-5', icon && iconPosition === 'after' && size !== 'extra-micro' && 'h-5 w-5', icon && iconPosition === 'before' && size === 'extra-micro' && 'h-4 w-4', icon && iconPosition === 'after' && size === 'extra-micro' && 'h-4 w-4', iconClassName);
+    // Icon markup
+    var iconMarkup = Icon && react_1["default"].createElement(Icon, { className: iconClass });
+    // Loading markup
+    var loadingMarkup = loading ? (react_1["default"].createElement("span", { className: 'w-3 absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2' },
+        react_1["default"].createElement(IconLoading_1.IconLoading, { color: primary ? 'text-white' : danger ? 'text-red-50' : 'bg-transparent' }))) : (react_1["default"].createElement(react_1["default"].Fragment, null));
+    var buttonMarkup = (react_1["default"].createElement(react_1["default"].Fragment, null,
+        react_1["default"].createElement(ButtonStyle_1["default"], null),
+        react_1["default"].createElement("button", tslib_1.__assign({ style: style }, interactiveProps, { type: submit ? 'submit' : 'button', onClick: handleClick, className: binClassNames, disabled: loading ? true : disabled }),
+            react_1["default"].createElement("div", { className: "".concat(icon && children ? 'flex space-x-1 justify-between' : '') },
+                loadingMarkup,
+                iconPosition === 'before' ? iconMarkup : react_1["default"].createElement(react_1["default"].Fragment, null),
+                react_1["default"].createElement("span", { className: (0, types_1.classNames)(loading ? 'invisible' : '', deleted ? 'flex items-center' : '') },
+                    deleted && (react_1["default"].createElement(react_1["default"].Fragment, null, deletedButton ? (react_1["default"].createElement("svg", { xmlns: 'http://www.w3.org/2000/svg', fill: 'none', viewBox: '0 0 24 24', strokeWidth: '2.5', stroke: 'currentColor', className: 'w-3.5 h-3.5 mr-1' },
+                        react_1["default"].createElement("path", { strokeLinecap: 'round', strokeLinejoin: 'round', d: 'M14.74 9l-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 01-2.244 2.077H8.084a2.25 2.25 0 01-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 00-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 013.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 00-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 00-7.5 0' }))) : (react_1["default"].createElement(react_1["default"].Fragment, null)))),
+                    children),
+                iconPosition === 'after' ? iconMarkup : react_1["default"].createElement(react_1["default"].Fragment, null)))));
+    var styleBtnSplit = (0, types_1.classNames)(size === 'small' && 'px-2.5 py-1.5 text-xs', size === 'micro' && 'px-2 py-1 text-xs', size === 'medium' && 'px-2.5 py-1.5 text-sm', size === 'extra-large' && 'px-3.5 py-2.5 text-sm', size === 'large' && 'px-3 py-2 text-sm', 'flex items-center border font-normal  shadow-sm ', primary &&
+        'hover:bg-indigo-800 text-white border-gray-800 hover:text-gray-200 active:text-gray-400 bg-indigo-700 active:shadow-[0rem_0.125rem_0.1rem_0rem_#a3a3a344_inset]', !primary && 'bg-white hover:bg-slate-50 text-gray-900 active:shadow-[0rem_0.125rem_0.1rem_0rem_#0004_inset]');
+    var sizeIcon = (0, types_1.classNames)(size === 'small' && 'px-2.5 py-[7px]', size === 'micro' && 'px-2 py-1.5', size === 'medium' && 'px-2.5 py-2', size === 'extra-large' && 'px-3.5 py-3', size === 'large' && 'px-3 py-2.5');
+    var buttonSplit = (react_1["default"].createElement(react_1["default"].Fragment, null,
+        react_1["default"].createElement("div", { className: "flex ".concat(className) },
+            react_1["default"].createElement("button", tslib_1.__assign({}, interactiveProps, { type: submit ? 'submit' : 'button', onClick: handleClick, className: "".concat(styleBtnSplit, " rounded-l-lg") }), children),
+            react_1["default"].createElement(react_2.Menu, { as: 'div' },
+                react_1["default"].createElement(react_2.Menu.Button, null,
+                    react_1["default"].createElement("button", { className: "".concat(styleBtnSplit, " ").concat(sizeIcon, " rounded-r-lg border-l-0") },
+                        react_1["default"].createElement("svg", { xmlns: 'http://www.w3.org/2000/svg', fill: 'none', viewBox: '0 0 24 24', strokeWidth: '1.5', stroke: 'currentColor', className: 'w-4 h-4' },
+                            react_1["default"].createElement("path", { strokeLinecap: 'round', strokeLinejoin: 'round', d: 'm19.5 8.25-7.5 7.5-7.5-7.5' })))),
+                react_1["default"].createElement(react_2.Transition, { as: react_1.Fragment, enter: 'transition ease-out duration-100', enterFrom: 'transform opacity-0 scale-95', enterTo: 'transform opacity-100 scale-100', leave: 'transition ease-in duration-75', leaveFrom: 'transform opacity-100 scale-100', leaveTo: 'transform opacity-0 scale-95' },
+                    react_1["default"].createElement(react_2.Menu.Items, { className: (0, types_1.classNames)('whitespace-nowrap border px-1 absolute z-10 max-h-96 overflow-y-auto mt-1.5 min-w-[5.2rem] rounded-lg bg-white focus:outline-none shadow-[0rem_0.25rem_0.375rem_-0.125rem_rgba(26,26,26,.2)]') },
+                        react_1["default"].createElement(react_1["default"].Fragment, null,
+                            react_1["default"].createElement("div", { className: 'py-1' }, options === null || options === void 0 ? void 0 : options.map(function (item) { return (react_1["default"].createElement(react_2.Menu.Item, { key: item.content }, function (_a) {
+                                var active = _a.active;
+                                return (react_1["default"].createElement("div", { className: (0, types_1.classNames)(active ? 'bg-gray-100 text-gray-900 rounded-lg cursor-pointer' : 'text-gray-700', 'block px-2 py-1.5 text-xs'), onClick: item.onClick }, item.name));
+                            })); })))))))));
+    return react_1["default"].createElement(react_1["default"].Fragment, null, split ? buttonSplit : buttonMarkup);
+};
+exports.PHXButton = PHXButton;
+//# sourceMappingURL=Button.js.map

package/dist/cjs/components/Button/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../../src/components/Button/Button.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/Button/index.d.ts

@@ -0,0 +1 @@
+export * from './Button';

package/dist/cjs/components/Button/index.js

@@ -0,0 +1,5 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./Button"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/Button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Button/index.ts"],"names":[],"mappings":";;;AAAA,mDAAwB"}

package/dist/cjs/components/Button/styles/ButtonStyle.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const StyleButtonLayout: () => React.JSX.Element;
+export default StyleButtonLayout;

package/dist/cjs/components/Button/styles/ButtonStyle.js

@@ -0,0 +1,9 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importDefault(require("react"));
+var StyleButtonLayout = function () {
+    return (react_1["default"].createElement("style", null, "\n        .primary {\n            box-shadow: 0rem -0.0625rem 0rem 0.0625rem rgba(0, 0, 0, 0.8) inset, 0rem 0rem 0rem 0.0625rem #303030 inset,\n              0rem 0.03125rem 0rem 0.09375rem hsla(0, 0%, 100%, 0.25) inset;\n          }\n        .danger {\n            box-shadow: 0rem -0.0625rem 0rem 0.0625rem rgba(142,31,11,.8) inset,0rem 0rem 0rem 0.0625rem rgba(181,38,11,.8) inset,0rem 0.03125rem 0rem 0.09375rem hsla(0,0%,100%,.349) inset\n        }\n    "));
+};
+exports["default"] = StyleButtonLayout;
+//# sourceMappingURL=ButtonStyle.js.map

package/dist/cjs/components/Button/styles/ButtonStyle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonStyle.js","sourceRoot":"","sources":["../../../../../src/components/Button/styles/ButtonStyle.tsx"],"names":[],"mappings":";;;AAAA,wDAAyB;AAEzB,IAAM,iBAAiB,GAAG;IACxB,OAAO,CACL,gDACG,6cAQF,CACO,CACT,CAAA;AACH,CAAC,CAAA;AAED,qBAAe,iBAAiB,CAAA"}

package/dist/cjs/components/ButtonGroup/ButtonGroup.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+export interface ButtonGroupProps {
+    className?: string;
+    size?: 'micro' | 'small' | 'medium' | 'large' | 'extra-large';
+    dataGroups: Array<{
+        buttonText: string;
+        onClick?(): void;
+        defaultActive?: boolean;
+    }>;
+    type?: 'default' | 'active-button';
+}
+export declare function PHXButtonGroup({ className, size, dataGroups, type }: ButtonGroupProps): React.JSX.Element;

package/dist/cjs/components/ButtonGroup/ButtonGroup.js

@@ -0,0 +1,44 @@
+"use strict";
+exports.__esModule = true;
+exports.PHXButtonGroup = void 0;
+var tslib_1 = require("tslib");
+var react_1 = tslib_1.__importStar(require("react"));
+var Button_1 = require("../Button/Button");
+var types_1 = require("../types");
+function PHXButtonGroup(_a) {
+    var className = _a.className, size = _a.size, dataGroups = _a.dataGroups, type = _a.type;
+    var _b = (0, react_1.useState)(''), active = _b[0], setActive = _b[1];
+    var _c = (0, react_1.useState)(false), current = _c[0], setCurrent = _c[1];
+    var setIsActive = function (item) {
+        item.onClick();
+        if (type === 'active-button') {
+            setActive(item.buttonText);
+            if (item.buttonText === active) {
+                setCurrent(false);
+                setActive('');
+            }
+            else {
+                setCurrent(true);
+            }
+        }
+        else {
+            return;
+        }
+    };
+    (0, react_1.useEffect)(function () {
+        for (var _i = 0, dataGroups_1 = dataGroups; _i < dataGroups_1.length; _i++) {
+            var item = dataGroups_1[_i];
+            if (item.defaultActive) {
+                setActive(item.buttonText);
+                setCurrent(true);
+            }
+        }
+    }, [dataGroups]);
+    return (react_1["default"].createElement("div", { className: "flex justify-start w-fit rounded-lg ".concat(className) }, dataGroups.map(function (item, index) { return (react_1["default"].createElement(Button_1.PHXButton, { key: item.buttonText, className: (0, types_1.classNames)(index === 0 ? 'rounded-none rounded-tl-lg rounded-bl-lg border-l' : 'rounded-none', index === dataGroups.length - 1 ? 'rounded-none rounded-tr-lg rounded-br-lg' : 'rounded-none', type === 'active-button' && active === item.buttonText && current
+            ? '!bg-gray-200 !shadow-[0rem_0.125rem_0.1rem_0rem_#0004_inset] !border-b-gray-300'
+            : '', '!ring-0 border-y border-r border-gray-300 leading-4 border-b-gray-400 hover:border-b-gray-300'), secondary: true, size: size, onClick: function () {
+            setIsActive(item);
+        } }, item.buttonText)); })));
+}
+exports.PHXButtonGroup = PHXButtonGroup;
+//# sourceMappingURL=ButtonGroup.js.map

package/dist/cjs/components/ButtonGroup/ButtonGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonGroup.js","sourceRoot":"","sources":["../../../../src/components/ButtonGroup/ButtonGroup.tsx"],"names":[],"mappings":";;;;AAAA,qDAAkD;AAClD,2CAA4C;AAC5C,kCAAqC;AASrC,SAAgB,cAAc,CAAC,EAAuD;QAArD,SAAS,eAAA,EAAE,IAAI,UAAA,EAAE,UAAU,gBAAA,EAAE,IAAI,UAAA;IAC1D,IAAA,KAAsB,IAAA,gBAAQ,EAAC,EAAE,CAAC,EAAjC,MAAM,QAAA,EAAE,SAAS,QAAgB,CAAA;IAClC,IAAA,KAAwB,IAAA,gBAAQ,EAAC,KAAK,CAAC,EAAtC,OAAO,QAAA,EAAE,UAAU,QAAmB,CAAA;IAC7C,IAAM,WAAW,GAAG,UAAC,IAAS;QAC5B,IAAI,CAAC,OAAO,EAAE,CAAA;QACd,IAAI,IAAI,KAAK,eAAe,EAAE;YAC5B,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC,CAAA;YAC1B,IAAI,IAAI,CAAC,UAAU,KAAK,MAAM,EAAE;gBAC9B,UAAU,CAAC,KAAK,CAAC,CAAA;gBACjB,SAAS,CAAC,EAAE,CAAC,CAAA;aACd;iBAAM;gBACL,UAAU,CAAC,IAAI,CAAC,CAAA;aACjB;SACF;aAAM;YACL,OAAM;SACP;IACH,CAAC,CAAA;IAED,IAAA,iBAAS,EAAC;QACR,KAAmB,UAAU,EAAV,yBAAU,EAAV,wBAAU,EAAV,IAAU,EAAE;YAA1B,IAAM,IAAI,mBAAA;YACb,IAAI,IAAI,CAAC,aAAa,EAAE;gBACtB,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC,CAAA;gBAC1B,UAAU,CAAC,IAAI,CAAC,CAAA;aACjB;SACF;IACH,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAA;IAEhB,OAAO,CACL,0CAAK,SAAS,EAAE,8CAAuC,SAAS,CAAE,IAC/D,UAAU,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,KAAK,IAAK,OAAA,CAC/B,iCAAC,kBAAS,IACR,GAAG,EAAE,IAAI,CAAC,UAAU,EACpB,SAAS,EAAE,IAAA,kBAAU,EACnB,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,mDAAmD,CAAC,CAAC,CAAC,cAAc,EAClF,KAAK,KAAK,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,0CAA0C,CAAC,CAAC,CAAC,cAAc,EAC7F,IAAI,KAAK,eAAe,IAAI,MAAM,KAAK,IAAI,CAAC,UAAU,IAAI,OAAO;YAC/D,CAAC,CAAC,iFAAiF;YACnF,CAAC,CAAC,EAAE,EACN,+FAA+F,CAChG,EACD,SAAS,QACT,IAAI,EAAE,IAAI,EACV,OAAO,EAAE;YACP,WAAW,CAAC,IAAI,CAAC,CAAA;QACnB,CAAC,IAEA,IAAI,CAAC,UAAU,CACN,CACb,EAnBgC,CAmBhC,CAAC,CACE,CACP,CAAA;AACH,CAAC;AAnDD,wCAmDC"}

package/dist/cjs/components/ButtonGroup/index.d.ts

@@ -0,0 +1 @@
+export * from './ButtonGroup';

package/dist/cjs/components/ButtonGroup/index.js

@@ -0,0 +1,5 @@
+"use strict";
+exports.__esModule = true;
+var tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./ButtonGroup"), exports);
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/ButtonGroup/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/ButtonGroup/index.ts"],"names":[],"mappings":";;;AAAA,wDAA6B"}