infinity-forge 11.5.7 → 11.5.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -39,11 +39,12 @@ var icons_1 = require("../../../ui/icons/index.js");
|
|
|
39
39
|
var tooltip_1 = require("../tooltip/index.js");
|
|
40
40
|
var S = __importStar(require("./styles.js"));
|
|
41
41
|
function UserMenu(_a) {
|
|
42
|
+
var _b;
|
|
42
43
|
var name = _a.name, subtitle = _a.subtitle, avatar = _a.avatar, email = _a.email, onEditProfile = _a.onEditProfile, onLogout = _a.onLogout, customOptions = _a.customOptions;
|
|
43
44
|
function UserMenuContent() {
|
|
44
45
|
var _a;
|
|
45
46
|
return ((0, jsx_runtime_1.jsxs)(S.UserMenuContent, { children: [(0, jsx_runtime_1.jsxs)("div", { className: 'top', children: [avatar && (0, jsx_runtime_1.jsx)("img", { src: avatar, alt: name }), !avatar && (0, jsx_runtime_1.jsx)("div", { className: 'img', children: (_a = name === null || name === void 0 ? void 0 : name.charAt(0)) === null || _a === void 0 ? void 0 : _a.toUpperCase() }), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h5", { className: 'title', children: name }), (0, jsx_runtime_1.jsx)("span", { className: 'subtext', children: email })] })] }), (0, jsx_runtime_1.jsx)("div", { className: 'separator' }), (0, jsx_runtime_1.jsxs)("div", { className: 'options', children: [customOptions === null || customOptions === void 0 ? void 0 : customOptions.map(function (option) { return ((0, jsx_runtime_1.jsxs)("button", { className: 'option', onClick: option.onClick, children: [option.icon, (0, jsx_runtime_1.jsx)("span", { children: option.label })] })); }), onEditProfile && ((0, jsx_runtime_1.jsxs)("button", { className: 'option', onClick: onEditProfile, children: [(0, jsx_runtime_1.jsx)(icons_1.Icon, { name: 'IconEditProfile' }), (0, jsx_runtime_1.jsx)("span", { children: "Editar Perfil" })] })), onLogout && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: 'separator' }), (0, jsx_runtime_1.jsxs)("button", { className: 'option red', onClick: onLogout, children: [(0, jsx_runtime_1.jsx)(icons_1.Icon, { name: 'IconExit' }), (0, jsx_runtime_1.jsx)("span", { children: "Sair" })] })] }))] })] }));
|
|
46
47
|
}
|
|
47
|
-
return ((0, jsx_runtime_1.jsxs)(S.UserMenu, { children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h5", { className: 'title', children: name }), (0, jsx_runtime_1.jsx)("span", { className: 'subtext', children: subtitle })] }), (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { idTooltip: 'user-menu-tooltip', trigger: (0, jsx_runtime_1.jsx)("img", { src: avatar, alt: name }), content: (0, jsx_runtime_1.jsx)(UserMenuContent, {}) })] }));
|
|
48
|
+
return ((0, jsx_runtime_1.jsxs)(S.UserMenu, { children: [(0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h5", { className: 'title', children: name }), (0, jsx_runtime_1.jsx)("span", { className: 'subtext', children: subtitle })] }), (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { idTooltip: 'user-menu-tooltip', trigger: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [avatar && (0, jsx_runtime_1.jsx)("img", { src: avatar, alt: name }), !avatar && (0, jsx_runtime_1.jsx)("div", { className: 'img', children: (_b = name === null || name === void 0 ? void 0 : name.charAt(0)) === null || _b === void 0 ? void 0 : _b.toUpperCase() })] }), content: (0, jsx_runtime_1.jsx)(UserMenuContent, {}) })] }));
|
|
48
49
|
}
|
|
49
50
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/ui/components/user-menu/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/ui/components/user-menu/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,4BAqEC;;AAxFD,oCAAiC;AACjC,sCAAoC;AAEpC,0CAA6B;AAgB7B,SAAgB,QAAQ,CAAC,EAAyF;;QAAvF,IAAI,UAAA,EAAE,QAAQ,cAAA,EAAE,MAAM,YAAA,EAAE,KAAK,WAAA,EAAE,aAAa,mBAAA,EAAE,QAAQ,cAAA,EAAE,aAAa,mBAAA;IAC9F,SAAS,eAAe;;QACtB,OAAO,CACL,wBAAC,CAAC,CAAC,eAAe,eAChB,iCAAK,SAAS,EAAC,KAAK,aACjB,MAAM,IAAI,gCAAK,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,IAAI,GAAI,EAEzC,CAAC,MAAM,IAAI,gCAAK,SAAS,EAAC,KAAK,YAAE,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,MAAM,CAAC,CAAC,CAAC,0CAAE,WAAW,EAAE,GAAO,EAEvE,4CACE,+BAAI,SAAS,EAAC,OAAO,YAAE,IAAI,GAAM,EACjC,iCAAM,SAAS,EAAC,SAAS,YAAE,KAAK,GAAQ,IACpC,IACF,EAEN,gCAAK,SAAS,EAAC,WAAW,GAAG,EAE7B,iCAAK,SAAS,EAAC,SAAS,aACrB,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,GAAG,CAAC,UAAC,MAAM,IAAK,OAAA,CAC9B,oCAAQ,SAAS,EAAC,QAAQ,EAAC,OAAO,EAAE,MAAM,CAAC,OAAO,aAC/C,MAAM,CAAC,IAAI,EACZ,2CAAO,MAAM,CAAC,KAAK,GAAQ,IACpB,CACV,EAL+B,CAK/B,CAAC,EAED,aAAa,IAAI,CAChB,oCAAQ,SAAS,EAAC,QAAQ,EAAC,OAAO,EAAE,aAAa,aAC/C,uBAAC,YAAI,IAAC,IAAI,EAAC,iBAAiB,GAAG,EAE/B,6DAA0B,IACnB,CACV,EAEA,QAAQ,IAAI,CACX,6DACE,gCAAK,SAAS,EAAC,WAAW,GAAG,EAE7B,oCAAQ,SAAS,EAAC,YAAY,EAAC,OAAO,EAAE,QAAQ,aAC9C,uBAAC,YAAI,IAAC,IAAI,EAAC,UAAU,GAAG,EAExB,oDAAiB,IACV,IACR,CACJ,IACG,IACY,CACrB,CAAA;IACH,CAAC;IAED,OAAO,CACL,wBAAC,CAAC,CAAC,QAAQ,eACT,4CACE,+BAAI,SAAS,EAAC,OAAO,YAAE,IAAI,GAAM,EACjC,iCAAM,SAAS,EAAC,SAAS,YAAE,QAAQ,GAAQ,IACvC,EAEN,uBAAC,iBAAO,IACN,SAAS,EAAC,mBAAmB,EAC7B,OAAO,EACL,6DACG,MAAM,IAAI,gCAAK,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,IAAI,GAAI,EAEzC,CAAC,MAAM,IAAI,gCAAK,SAAS,EAAC,KAAK,YAAE,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,MAAM,CAAC,CAAC,CAAC,0CAAE,WAAW,EAAE,GAAO,IACtE,EAEL,OAAO,EAAE,uBAAC,eAAe,KAAG,GAC5B,IACS,CACd,CAAA;AACH,CAAC"}
|
|
@@ -9,7 +9,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
9
9
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
10
10
|
exports.UserMenuContent = exports.UserMenu = void 0;
|
|
11
11
|
var styled_components_1 = __importDefault(require("styled-components"));
|
|
12
|
-
exports.UserMenu = (0, styled_components_1.default)('div')(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: fit-content;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 1rem;\n\n .title {\n font-size: 1.4rem;\n font-weight: 600;\n color: #111827;\n line-height: 1.2;\n }\n\n .subtext {\n font-size: 1.2rem;\n font-weight: 400;\n color: #6b7280;\n line-height: 1.2;\n }\n\n button {\n }\n\n img,\n .img {\n min-width: 100%;\n min-height: 100%;\n object-fit: cover;\n border-radius: 99999px;\n\n max-width: 40px;\n max-height: 40px;\n width: 40px;\n height: 40px;\n min-width: 40px;\n min-height: 40px;\n border-radius: 99999px;\n padding: 0;\n border: none;\n overflow: hidden;\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 0.1s;\n background-color: #ccc;\n\n &:hover {\n outline: 2px solid currentColor;\n outline-offset: 2px;\n box-shadow: 0 0 4px rgba(0, 0, 0, 0.25);\n }\n }\n"], ["\n width: fit-content;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 1rem;\n\n .title {\n font-size: 1.4rem;\n font-weight: 600;\n color: #111827;\n line-height: 1.2;\n }\n\n .subtext {\n font-size: 1.2rem;\n font-weight: 400;\n color: #6b7280;\n line-height: 1.2;\n }\n\n button {\n }\n\n img,\n .img {\n min-width: 100%;\n min-height: 100%;\n object-fit: cover;\n border-radius: 99999px;\n\n max-width: 40px;\n max-height: 40px;\n width: 40px;\n height: 40px;\n min-width: 40px;\n min-height: 40px;\n border-radius: 99999px;\n padding: 0;\n border: none;\n overflow: hidden;\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 0.1s;\n background-color: #ccc;\n\n &:hover {\n outline: 2px solid currentColor;\n outline-offset: 2px;\n box-shadow: 0 0 4px rgba(0, 0, 0, 0.25);\n }\n }\n"])));
|
|
12
|
+
exports.UserMenu = (0, styled_components_1.default)('div')(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n width: fit-content;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 1rem;\n\n .title {\n font-size: 1.4rem;\n font-weight: 600;\n color: #111827;\n line-height: 1.2;\n }\n\n .subtext {\n font-size: 1.2rem;\n font-weight: 400;\n color: #6b7280;\n line-height: 1.2;\n }\n\n button {\n }\n\n img,\n .img {\n min-width: 100%;\n min-height: 100%;\n object-fit: cover;\n border-radius: 99999px;\n\n max-width: 40px;\n max-height: 40px;\n width: 40px;\n height: 40px;\n min-width: 40px;\n min-height: 40px;\n border-radius: 99999px;\n padding: 0;\n border: none;\n overflow: hidden;\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 0.1s;\n background-color: #ccc;\n\n display: flex;\n align-items: center;\n justify-content: center;\n font-weight: 600;\n font-size: 1.8rem;\n color: #ffffff;\n text-transform: uppercase;\n\n &:hover {\n outline: 2px solid currentColor;\n outline-offset: 2px;\n box-shadow: 0 0 4px rgba(0, 0, 0, 0.25);\n }\n }\n"], ["\n width: fit-content;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 1rem;\n\n .title {\n font-size: 1.4rem;\n font-weight: 600;\n color: #111827;\n line-height: 1.2;\n }\n\n .subtext {\n font-size: 1.2rem;\n font-weight: 400;\n color: #6b7280;\n line-height: 1.2;\n }\n\n button {\n }\n\n img,\n .img {\n min-width: 100%;\n min-height: 100%;\n object-fit: cover;\n border-radius: 99999px;\n\n max-width: 40px;\n max-height: 40px;\n width: 40px;\n height: 40px;\n min-width: 40px;\n min-height: 40px;\n border-radius: 99999px;\n padding: 0;\n border: none;\n overflow: hidden;\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 0.1s;\n background-color: #ccc;\n\n display: flex;\n align-items: center;\n justify-content: center;\n font-weight: 600;\n font-size: 1.8rem;\n color: #ffffff;\n text-transform: uppercase;\n\n &:hover {\n outline: 2px solid currentColor;\n outline-offset: 2px;\n box-shadow: 0 0 4px rgba(0, 0, 0, 0.25);\n }\n }\n"])));
|
|
13
13
|
exports.UserMenuContent = (0, styled_components_1.default)('div')(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n .top {\n display: flex;\n align-items: center;\n gap: 1rem;\n padding: 6px 8px;\n }\n\n .separator {\n width: 100%;\n height: 1px;\n background-color: #e5e7eb;\n margin: 4px 0;\n }\n\n img,\n .img {\n object-fit: cover;\n border-radius: 99999px;\n max-width: 40px;\n max-height: 40px;\n width: 40px;\n height: 40px;\n min-width: 40px;\n min-height: 40px;\n border-radius: 99999px;\n overflow: hidden;\n background-color: #ccc;\n\n display: flex;\n align-items: center;\n justify-content: center;\n font-weight: 600;\n font-size: 1.8rem;\n color: #ffffff;\n text-transform: uppercase;\n }\n\n .title {\n font-size: 1.4rem;\n font-weight: 600;\n color: #111827;\n line-height: 1.2;\n }\n\n .subtext {\n font-size: 1.2rem;\n font-weight: 400;\n color: #6b7280;\n line-height: 1.2;\n }\n\n .options {\n display: flex;\n flex-direction: column;\n gap: 4px;\n }\n\n .option {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 0;\n border: none;\n background: none;\n cursor: pointer;\n font-size: 14px;\n width: 100%;\n padding: 6px 8px;\n transition: background-color 0.1s ease-in-out;\n border-radius: 4px;\n\n &:hover {\n background-color: #f3f4f6;\n }\n\n svg {\n width: 16px;\n height: 16px;\n stroke: currentColor;\n }\n\n &.red {\n color: #dc2626;\n\n svg {\n stroke: currentColor;\n }\n\n &:hover {\n background-color: #dc262610;\n }\n }\n }\n"], ["\n .top {\n display: flex;\n align-items: center;\n gap: 1rem;\n padding: 6px 8px;\n }\n\n .separator {\n width: 100%;\n height: 1px;\n background-color: #e5e7eb;\n margin: 4px 0;\n }\n\n img,\n .img {\n object-fit: cover;\n border-radius: 99999px;\n max-width: 40px;\n max-height: 40px;\n width: 40px;\n height: 40px;\n min-width: 40px;\n min-height: 40px;\n border-radius: 99999px;\n overflow: hidden;\n background-color: #ccc;\n\n display: flex;\n align-items: center;\n justify-content: center;\n font-weight: 600;\n font-size: 1.8rem;\n color: #ffffff;\n text-transform: uppercase;\n }\n\n .title {\n font-size: 1.4rem;\n font-weight: 600;\n color: #111827;\n line-height: 1.2;\n }\n\n .subtext {\n font-size: 1.2rem;\n font-weight: 400;\n color: #6b7280;\n line-height: 1.2;\n }\n\n .options {\n display: flex;\n flex-direction: column;\n gap: 4px;\n }\n\n .option {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 0;\n border: none;\n background: none;\n cursor: pointer;\n font-size: 14px;\n width: 100%;\n padding: 6px 8px;\n transition: background-color 0.1s ease-in-out;\n border-radius: 4px;\n\n &:hover {\n background-color: #f3f4f6;\n }\n\n svg {\n width: 16px;\n height: 16px;\n stroke: currentColor;\n }\n\n &.red {\n color: #dc2626;\n\n svg {\n stroke: currentColor;\n }\n\n &:hover {\n background-color: #dc262610;\n }\n }\n }\n"])));
|
|
14
14
|
var templateObject_1, templateObject_2;
|
|
15
15
|
//# sourceMappingURL=styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../src/ui/components/user-menu/styles.ts"],"names":[],"mappings":";;;;;;;;;;AAAA,wEAAsC;AAEzB,QAAA,QAAQ,GAAG,IAAA,2BAAM,EAAC,KAAK,CAAC,
|
|
1
|
+
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../src/ui/components/user-menu/styles.ts"],"names":[],"mappings":";;;;;;;;;;AAAA,wEAAsC;AAEzB,QAAA,QAAQ,GAAG,IAAA,2BAAM,EAAC,KAAK,CAAC,utCAAA,opCA4DpC,KAAA;AAEY,QAAA,eAAe,GAAG,IAAA,2BAAM,EAAC,KAAK,CAAC,qoDAAA,kkDA8F3C,KAAA"}
|