pge-front-common 14.0.53 → 14.0.54

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.
@@ -1,6 +1,6 @@
1
1
  import React from "react";
2
2
  export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
3
- variant: "primary" | "secondary";
3
+ variant: "primary" | "secondary" | "outline-danger";
4
4
  text: string;
5
5
  leftIcon?: React.ReactNode;
6
6
  }
@@ -5,4 +5,5 @@ export default meta;
5
5
  type Story = StoryObj<typeof meta>;
6
6
  export declare const Primary: Story;
7
7
  export declare const Secondary: Story;
8
+ export declare const OutlineDanger: Story;
8
9
  export declare const WithIcon: Story;
package/lib/index.d.ts CHANGED
@@ -3,7 +3,7 @@ import React__default, { InputHTMLAttributes, ReactNode, HtmlHTMLAttributes, Cha
3
3
  import { Control } from 'react-hook-form';
4
4
 
5
5
  interface ButtonProps extends React__default.ButtonHTMLAttributes<HTMLButtonElement> {
6
- variant: "primary" | "secondary";
6
+ variant: "primary" | "secondary" | "outline-danger";
7
7
  text: string;
8
8
  leftIcon?: React__default.ReactNode;
9
9
  }
package/lib/index.esm.js CHANGED
@@ -86,8 +86,8 @@ function styleInject(css, ref) {
86
86
  }
87
87
  }
88
88
 
89
- var css_248z$C = ".button-module__button___JyfZW {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 4px;\r\n cursor: pointer;\r\n padding: 12px 16px;\r\n border-radius: 8px;\r\n min-width: 70px;\r\n height: 38px;\r\n width: 100%;\r\n}\r\n\r\n.button-module__button___JyfZW.button-module__primary___ggjlO {\r\n border: 1px solid #005a92;\r\n background: #005a92;\r\n color: #ffffff;\r\n font-weight: 400;\r\n}\r\n\r\n.button-module__button___JyfZW.button-module__primary___ggjlO:hover {\r\n opacity: 1;\r\n background-color: rgb(0 67 109);\r\n}\r\n\r\n.button-module__button___JyfZW.button-module__secondary___Q4I1z {\r\n border: 1px solid #005a92;\r\n background: transparent;\r\n color: #005a92;\r\n font-weight: 400;\r\n}\r\n\r\n.button-module__button___JyfZW:disabled {\r\n cursor: not-allowed;\r\n}\r\n";
90
- var styles$z = {"button":"button-module__button___JyfZW","primary":"button-module__primary___ggjlO","secondary":"button-module__secondary___Q4I1z"};
89
+ var css_248z$C = ".button-module__button___JyfZW {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 4px;\r\n cursor: pointer;\r\n padding: 12px 16px;\r\n border-radius: 8px;\r\n min-width: 70px;\r\n height: 38px;\r\n width: 100%;\r\n}\r\n\r\n.button-module__button___JyfZW.button-module__primary___ggjlO {\r\n border: 1px solid #005a92;\r\n background: #005a92;\r\n color: #ffffff;\r\n font-weight: 400;\r\n}\r\n\r\n.button-module__button___JyfZW.button-module__primary___ggjlO:hover {\r\n opacity: 1;\r\n background-color: rgb(0 67 109);\r\n}\r\n\r\n.button-module__button___JyfZW.button-module__secondary___Q4I1z {\r\n border: 1px solid #005a92;\r\n background: transparent;\r\n color: #005a92;\r\n font-weight: 400;\r\n}\r\n\r\n.button-module__button___JyfZW.button-module__outline-danger___lK8Xt {\r\n border: 1px solid #dc3545;\r\n background: transparent;\r\n color: #dc3545;\r\n font-weight: 400;\r\n}\r\n\r\n.button-module__button___JyfZW.button-module__outline-danger___lK8Xt:hover {\r\n background-color: #dc3545;\r\n color: #ffffff;\r\n}\r\n\r\n.button-module__button___JyfZW:disabled {\r\n cursor: not-allowed;\r\n}\r\n";
90
+ var styles$z = {"button":"button-module__button___JyfZW","primary":"button-module__primary___ggjlO","secondary":"button-module__secondary___Q4I1z","outline-danger":"button-module__outline-danger___lK8Xt"};
91
91
  styleInject(css_248z$C);
92
92
 
93
93
  function Button$1(_a) {
@@ -724,7 +724,7 @@ var Tooltip$1 = function (_a) {
724
724
  React__default.createElement("span", { className: styles$s.textContent }, text)))));
725
725
  };
726
726
 
727
- var css_248z$u = ".textarea-module__inputContainer___lpM5d {\r\n color: var(--color-input);\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n width: 100%;\r\n}\r\n\r\n.textarea-module__label___qDTpX {\r\n color: var(--color-label);\r\n font-size: var(--font-size-16, 16px);\r\n font-weight: var(--input-font-weight);\r\n line-height: var(--input-line-height);\r\n width: 100%;\r\n}\r\n\r\n@media (max-width: 480px) {\r\n .textarea-module__label___qDTpX {\r\n font-size: var(--font-size-12, 12px);\r\n }\r\n}\r\n\r\n.textarea-module__labelRequired___bl2ew::after {\r\n content: \" *\";\r\n color: var(--color-danger);\r\n}\r\n\r\n.textarea-module__labelError___f0hpM {\r\n color: var(--color-danger);\r\n}\r\n\r\n.textarea-module__inputWrapper___WFx7P {\r\n background-color: #fff;\r\n cursor: pointer;\r\n width: 100%;\r\n border-radius: var(--input-border-radius);\r\n border: var(--input-border);\r\n font-family: var(--font-open-sans-serif);\r\n font-size: var(--input-font-size);\r\n font-weight: var(--input-font-weight);\r\n line-height: var(--input-line-height);\r\n text-align: left;\r\n}\r\n\r\n.textarea-module__inputWrapperError___0gA5w {\r\n border: var(--input-border-danger) !important;\r\n outline: var(--input-outline-danger) !important;\r\n}\r\n\r\n.textarea-module__inputWrapper___WFx7P:focus,\r\n.textarea-module__inputWrapper___WFx7P:focus-visible,\r\n.textarea-module__inputWrapper___WFx7P:focus-within {\r\n border: var(--input-border-focus);\r\n outline: var(--input-outline-focus);\r\n box-shadow: 0px 0px 0px 2px #0091ea80;\r\n}\r\n\r\n.textarea-module__inputContent___kdVmc {\r\n display: flex;\r\n align-items: flex-start;\r\n position: relative;\r\n width: 100%;\r\n}\r\n\r\n.textarea-module__inputContent___kdVmc textarea {\r\n padding: 8px 0;\r\n font-size: var(--font-size-14, 14px);\r\n font-weight: 700;\r\n flex: 1;\r\n background-color: var(--input-bg-color);\r\n color: var(--input-placeholder-focus, #303030cc);\r\n}\r\n\r\n@media (max-width: 480px) {\r\n .textarea-module__inputContent___kdVmc textarea {\r\n font-size: var(--font-size-12, 12px);\r\n }\r\n}\r\n\r\n\r\n.textarea-module__messageContainer___akVKQ {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n width: 100%;\r\n}\r\n\r\n.textarea-module__messageWrapper___2mdmw {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 4px;\r\n}\r\n\r\n.textarea-module__counter___zHZ86 {\r\n font-size: var(--font-size-12, 12px);\r\n color: var(--color-label);\r\n font-weight: 700;\r\n text-align: right;\r\n min-width: 60px;\r\n}\r\n\r\n.textarea-module__styledInput___fPp-f {\r\n color: var(--color-input);\r\n cursor: pointer;\r\n width: 100%;\r\n border: none;\r\n border-radius: 8px;\r\n padding: 8px 0;\r\n resize: none;\r\n font-size: var(--font-size-14, 14px);\r\n}\r\n\r\n.textarea-module__inputContent___kdVmc textarea::placeholder {\r\n font-weight: 700;\r\n color: var(--input-placeholder-color);\r\n font-size: var(--font-size-14, 14px);\r\n line-height: 24px;\r\n font-family: var(--font-open-sans-serif);\r\n}\r\n\r\n.textarea-module__inputContent___kdVmc textarea:focus {\r\n color: var(--input-placeholder-focus, #303030cc);\r\n outline: none;\r\n border: 1px solid #1a95b0;\r\n box-shadow: 0px 0px 0px 2px #0091ea80;\r\n font-size: var(--font-size-14, 14px);\r\n font-weight: 700;\r\n background-color: var(--input-bg-color);\r\n}\r\n\r\n@media (max-width: 480px) {\r\n .textarea-module__styledInput___fPp-f {\r\n font-size: var(--font-size-12, 12px);\r\n }\r\n\r\n .textarea-module__inputContent___kdVmc textarea::placeholder {\r\n font-size: var(--font-size-12, 12px);\r\n }\r\n\r\n .textarea-module__inputContent___kdVmc textarea:focus {\r\n font-size: var(--font-size-12, 12px);\r\n }\r\n \r\n}\r\n\r\n\r\n.textarea-module__inputContent___kdVmc textarea:disabled {\r\n background-color: #eeeeee;\r\n border-radius: 8px;\r\n cursor: not-allowed;\r\n}\r\n\r\n.textarea-module__styledInput___fPp-f:focus,\r\n.textarea-module__styledInput___fPp-f:focus-visible,\r\n.textarea-module__styledInput___fPp-f:focus-within {\r\n outline: none;\r\n}\r\n\r\n.textarea-module__message___ys-dL {\r\n color: var(--color-label);\r\n margin-left: 8px;\r\n font-family: var(--font-open-sans-serif);\r\n font-size: 12px;\r\n font-weight: 700;\r\n line-height: 15px;\r\n text-align: left;\r\n}\r\n\r\n.textarea-module__messageError___ubeLK {\r\n color: var(--color-danger);\r\n}\r\n\r\n.textarea-module__inputContent___kdVmc svg {\r\n padding-left: 8px;\r\n margin-top: 11px;\r\n}\r\n";
727
+ var css_248z$u = ".textarea-module__inputContainer___lpM5d {\r\n color: var(--color-input);\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n width: 100%;\r\n}\r\n\r\n.textarea-module__label___qDTpX {\r\n color: var(--color-label);\r\n font-size: var(--font-size-16, 16px);\r\n font-weight: var(--input-font-weight);\r\n line-height: var(--input-line-height);\r\n width: 100%;\r\n}\r\n\r\n@media (max-width: 480px) {\r\n .textarea-module__label___qDTpX {\r\n font-size: var(--font-size-12, 12px);\r\n }\r\n}\r\n\r\n.textarea-module__labelRequired___bl2ew::after {\r\n content: \" *\";\r\n color: var(--color-danger);\r\n}\r\n\r\n.textarea-module__labelError___f0hpM {\r\n color: var(--color-danger);\r\n}\r\n\r\n.textarea-module__inputWrapper___WFx7P {\r\n background-color: #fff;\r\n cursor: pointer;\r\n width: 100%;\r\n border-radius: var(--input-border-radius);\r\n border: var(--input-border);\r\n font-family: var(--font-open-sans-serif);\r\n font-size: var(--input-font-size);\r\n font-weight: var(--input-font-weight);\r\n line-height: var(--input-line-height);\r\n text-align: left;\r\n}\r\n\r\n.textarea-module__inputWrapperError___0gA5w {\r\n border: 1px solid #cb0a0a;\r\n box-shadow: 0px 0px 0px 2px #dc354580;\r\n}\r\n\r\n.textarea-module__inputWrapper___WFx7P:focus,\r\n.textarea-module__inputWrapper___WFx7P:focus-visible,\r\n.textarea-module__inputWrapper___WFx7P:focus-within {\r\n border: var(--input-border-focus);\r\n outline: var(--input-outline-focus);\r\n box-shadow: 0px 0px 0px 2px #0091ea80;\r\n}\r\n\r\n.textarea-module__inputContent___kdVmc {\r\n display: flex;\r\n align-items: flex-start;\r\n position: relative;\r\n width: 100%;\r\n}\r\n\r\n.textarea-module__inputContent___kdVmc textarea {\r\n padding: 8px 0;\r\n font-size: var(--font-size-14, 14px);\r\n font-weight: 700;\r\n flex: 1;\r\n background-color: var(--input-bg-color);\r\n color: var(--input-placeholder-focus, #303030cc);\r\n}\r\n\r\n@media (max-width: 480px) {\r\n .textarea-module__inputContent___kdVmc textarea {\r\n font-size: var(--font-size-12, 12px);\r\n }\r\n}\r\n\r\n.textarea-module__messageContainer___akVKQ {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n width: 100%;\r\n}\r\n\r\n.textarea-module__messageWrapper___2mdmw {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 4px;\r\n}\r\n\r\n.textarea-module__counter___zHZ86 {\r\n font-size: var(--font-size-12, 12px);\r\n color: var(--color-label);\r\n font-weight: 700;\r\n text-align: right;\r\n min-width: 60px;\r\n}\r\n\r\n.textarea-module__styledInput___fPp-f {\r\n color: var(--color-input);\r\n cursor: pointer;\r\n width: 100%;\r\n border: none;\r\n border-radius: 8px;\r\n padding: 8px 0;\r\n resize: none;\r\n font-size: var(--font-size-14, 14px);\r\n}\r\n\r\n.textarea-module__inputContent___kdVmc textarea::placeholder {\r\n font-weight: 700;\r\n color: var(--input-placeholder-color);\r\n font-size: var(--font-size-14, 14px);\r\n line-height: 24px;\r\n font-family: var(--font-open-sans-serif);\r\n}\r\n\r\n.textarea-module__inputContent___kdVmc textarea:focus {\r\n color: var(--input-placeholder-focus, #303030cc);\r\n outline: none;\r\n border: 1px solid #1a95b0;\r\n box-shadow: 0px 0px 0px 2px #0091ea80;\r\n font-size: var(--font-size-14, 14px);\r\n font-weight: 700;\r\n background-color: var(--input-bg-color);\r\n}\r\n\r\n@media (max-width: 480px) {\r\n .textarea-module__styledInput___fPp-f {\r\n font-size: var(--font-size-12, 12px);\r\n }\r\n\r\n .textarea-module__inputContent___kdVmc textarea::placeholder {\r\n font-size: var(--font-size-12, 12px);\r\n }\r\n\r\n .textarea-module__inputContent___kdVmc textarea:focus {\r\n font-size: var(--font-size-12, 12px);\r\n }\r\n}\r\n\r\n.textarea-module__inputContent___kdVmc textarea:disabled {\r\n background-color: #eeeeee;\r\n border-radius: 8px;\r\n cursor: not-allowed;\r\n}\r\n\r\n.textarea-module__styledInput___fPp-f:focus,\r\n.textarea-module__styledInput___fPp-f:focus-visible,\r\n.textarea-module__styledInput___fPp-f:focus-within {\r\n outline: none;\r\n}\r\n\r\n.textarea-module__message___ys-dL {\r\n color: var(--color-label);\r\n margin-left: 8px;\r\n font-family: var(--font-open-sans-serif);\r\n font-size: 12px;\r\n font-weight: 700;\r\n line-height: 15px;\r\n text-align: left;\r\n}\r\n\r\n.textarea-module__messageError___ubeLK {\r\n color: var(--color-danger);\r\n}\r\n\r\n.textarea-module__inputContent___kdVmc svg {\r\n padding-left: 8px;\r\n margin-top: 11px;\r\n}\r\n";
728
728
  var styles$r = {"inputContainer":"textarea-module__inputContainer___lpM5d","label":"textarea-module__label___qDTpX","labelRequired":"textarea-module__labelRequired___bl2ew","labelError":"textarea-module__labelError___f0hpM","inputWrapper":"textarea-module__inputWrapper___WFx7P","inputWrapperError":"textarea-module__inputWrapperError___0gA5w","inputContent":"textarea-module__inputContent___kdVmc","messageContainer":"textarea-module__messageContainer___akVKQ","messageWrapper":"textarea-module__messageWrapper___2mdmw","counter":"textarea-module__counter___zHZ86","styledInput":"textarea-module__styledInput___fPp-f","message":"textarea-module__message___ys-dL","messageError":"textarea-module__messageError___ubeLK"};
729
729
  styleInject(css_248z$u);
730
730
 
@@ -743,8 +743,8 @@ var TextareaBase = function (_a) {
743
743
  ? "8px"
744
744
  : "0"
745
745
  : "8px",
746
- }, rows: rows, required: required })))),
747
- (textError && hasError || !hasError && message || showCounter) && (React__default.createElement("div", { className: styles$r.messageContainer },
746
+ }, rows: rows })))),
747
+ ((textError && hasError) || (!hasError && message) || showCounter) && (React__default.createElement("div", { className: styles$r.messageContainer },
748
748
  React__default.createElement("div", { className: styles$r.messageWrapper },
749
749
  textError && hasError && (React__default.createElement("div", { className: "".concat(styles$r.message, " ").concat(styles$r.messageError) }, textError)),
750
750
  !hasError && message && (React__default.createElement("div", { className: styles$r.message }, message))),