@dev-blinq/ui-systems 1.0.3 → 1.0.5

package/dist/index.css

@@ -0,0 +1,418 @@
+/* src/components/CustomButton/css/customButton.css */
+.button {
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 14px;
+  font-weight: bold;
+  cursor: pointer;
+  transition: all 0.3s ease;
+  border: none;
+}
+
+/* src/components/CustomButton/css/size.css */
+.button[data-size=sm] {
+  padding: 8px 12px;
+  gap: 8px;
+  border-radius: 12px;
+}
+.button[data-size=md] {
+  padding: 10px 14px;
+  gap: 8px;
+  border-radius: 12px;
+}
+.button[data-size=lg] {
+  padding: 12px 16px;
+  gap: 10px;
+  border-radius: 12px;
+}
+.button[data-size=xl] {
+  padding: 16px 24px;
+  gap: 12px;
+  border-radius: 16px;
+}
+
+/* src/components/CustomButton/css/color/default.css */
+.button[data-colorHierarchy="brand/primary"] {
+  background-color: var(--primary-main);
+}
+.button[data-colorHierarchy="brand/primary"] .input-typography {
+  color: #fff;
+}
+.button[data-colorHierarchy="gray/secondary"] {
+  background-color: #f1f1f1;
+}
+.button[data-colorHierarchy="gray/secondary"] .input-typography {
+  color: #080808;
+}
+.button[data-colorHierarchy="white/secondary"] {
+  background-color: #fff;
+  box-shadow: 0px 1px 2px 0px rgba(23, 23, 23, 0.05);
+  border: var(--border-radius-radius-none, 1px) solid var(--border-default, #e6e6e6);
+}
+.button[data-colorHierarchy="white/secondary"] .input-typography {
+  color: #080808;
+}
+.button[data-colorHierarchy="gray/linkContainer"] {
+  background-color: #fff;
+}
+.button[data-colorHierarchy="gray/linkContainer"] .input-typography {
+  color: #080808;
+}
+.button[data-colorHierarchy="gray/link"] {
+  background-color: #fff;
+  padding: 0;
+}
+.button[data-colorHierarchy="gray/link"] .input-typography {
+  color: #080808;
+}
+.button[data-colorHierarchy="brand/link"] {
+  background-color: #fff;
+  padding: 0;
+}
+.button[data-colorHierarchy="brand/link"] .input-typography {
+  color: var(--primary-main);
+}
+.button[data-colorHierarchy="destructive/primary"] {
+  background: var(--surface-error, #ea4621);
+}
+.button[data-colorHierarchy="destructive/primary"] .input-typography {
+  color: #fff;
+}
+.button[data-colorHierarchy="destructive/secondary"] {
+  background: var(--surface-error-secondary, #fdece9);
+}
+.button[data-colorHierarchy="destructive/secondary"] .input-typography {
+  color: var(--text-error, #ea4621);
+}
+.button[data-colorHierarchy="destructive/linkContainer"] {
+  background-color: #fff;
+}
+.button[data-colorHierarchy="destructive/linkContainer"] .input-typography {
+  color: var(--text-error, #ea4621);
+}
+.button[data-colorHierarchy=""] {
+  background-color: #fff;
+  padding: 0;
+}
+.button[data-colorHierarchy=""] .input-typography {
+  color: var(--text-error, #ea4621);
+}
+
+/* src/components/CustomButton/css/color/hover.css */
+.button[data-colorHierarchy="brand/primary"]:hover {
+  background: var(--surface-primary-hover, #08379e);
+}
+.button[data-colorHierarchy="gray/secondary"]:hover {
+  background: var(--surface-secondary-hover, #ececed);
+}
+.button[data-colorHierarchy="white/secondary"]:hover {
+  background: var(--surface-white---hover, #f9f9f9);
+}
+.button[data-colorHierarchy="gray/linkContainer"]:hover {
+  background: var(--surface-secondary, #f1f1f1);
+}
+.button[data-colorHierarchy="gray/link"]:hover {
+  background-color: #fff;
+}
+.button[data-colorHierarchy="brand/link"]:hover {
+  background-color: #fff;
+}
+.button[data-colorHierarchy="destructive/primary"]:hover {
+  background: var(--surface-error-hover, #d33f1e);
+}
+.button[data-colorHierarchy="destructive/secondary"]:hover {
+  background: var(--surface-error-secondary-hover, #fbdad3);
+}
+.button[data-colorHierarchy="destructive/linkContainer"]:hover {
+  background: var(--colors-red-5, #fef6f4);
+}
+.button[data-colorHierarchy=""]:hover {
+  background-color: #fff;
+}
+
+/* src/components/CustomButton/css/color/focused.css */
+.button[data-colorHierarchy="brand/primary"]:focus {
+  box-shadow: 0px 0px 0px 4px var(--primary-30, #b5c5e7);
+}
+.button[data-colorHierarchy="gray/secondary"]:focus {
+  box-shadow: 0px 0px 0px 4px var(--neutural-50, #e6e6e6);
+}
+.button[data-colorHierarchy="white/secondary"]:focus {
+  box-shadow: 0px 0px 0px 4px var(--neutural-50, #e6e6e6);
+}
+.button[data-colorHierarchy="gray/linkContainer"]:focus {
+  box-shadow: 0px 0px 0px 4px var(--neutural-50, #e6e6e6);
+}
+.button[data-colorHierarchy="gray/link"]:focus {
+  box-shadow: 0px 0px 0px 4px var(--neutural-50, #e6e6e6);
+}
+.button[data-colorHierarchy="brand/link"]:focus {
+  box-shadow: 0px 0px 0px 4px var(--primary-30, #b5c5e7);
+}
+.button[data-colorHierarchy="destructive/primary"]:focus {
+  box-shadow: 0px 0px 0px 4px var(--destructive-30, #f9c7bc);
+}
+.button[data-colorHierarchy="destructive/secondary"]:focus {
+  box-shadow: 0px 0px 0px 4px var(--destructive-30, #f9c7bc);
+}
+.button[data-colorHierarchy="destructive/linkContainer"]:focus {
+  box-shadow: 0px 0px 0px 4px var(--destructive-30, #f9c7bc);
+}
+.button[data-colorHierarchy=""]:focus {
+  box-shadow: 0px 0px 0px 4px var(--destructive-30, #f9c7bc);
+}
+
+/* src/components/CustomButton/css/color/disabled.css */
+.button[data-colorHierarchy="brand/primary"]:disabled {
+  background: var(--surface-disabled, #f1f1f1);
+}
+.button:disabled .input-typography {
+  color: var(--text-disabled, #939197);
+}
+.button[data-colorHierarchy="gray/secondary"]:disabled {
+  background: var(--surface-disabled, #f1f1f1);
+}
+.button[data-colorHierarchy="white/secondary"]:disabled {
+  background: var(--surface-white---disabled, #fdfdfd);
+}
+.button[data-colorHierarchy="brand/link"]:disabled .input-typography {
+  color: var(--text-action-disabled, #849ed7);
+}
+.button[data-colorHierarchy="destructive/primary"]:disabled {
+  background: var(--surface-error-disabled, #fdece9);
+}
+.button[data-colorHierarchy="destructive/primary"]:disabled .input-typography {
+  color: var(--text-error-disabled, #f5a290);
+}
+.button[data-colorHierarchy="destructive/secondary"]:disabled {
+  background: var(--surface-error-disabled, #fdece9);
+}
+.button[data-colorHierarchy="destructive/secondary"]:disabled .input-typography {
+  color: var(--text-error-disabled, #f5a290);
+}
+.button[data-colorHierarchy="destructive/linkContainer"]:disabled .input-typography {
+  color: var(--text-error-disabled, #f5a290);
+}
+.button[data-colorHierarchy="destructive/link"]:disabled .input-typography {
+  color: var(--text-error-disabled, #f5a290);
+}
+
+/* src/components/Typography/css/bold.css */
+.TypographyCustom {
+  color: var(--Gray-110, var(--colors-greyscale-110, #2d2b32));
+}
+.TypographyCustom[data-bold=extrabold] {
+  font-weight: 800;
+}
+.TypographyCustom[data-bold=bold] {
+  font-weight: 700;
+}
+.TypographyCustom[data-bold=semibold] {
+  font-weight: 600;
+}
+.TypographyCustom[data-bold=medium] {
+  font-weight: 500;
+}
+
+/* src/components/Typography/css/category/display.css */
+.TypographyCustom[data-category=display][data-size=lg] {
+  font-size: 180px;
+  font-style: normal;
+  line-height: 188px;
+  letter-spacing: -9px;
+}
+.TypographyCustom[data-category=display][data-size=md] {
+  font-size: 128px;
+  font-style: normal;
+  line-height: 136px;
+  letter-spacing: -5.12px;
+}
+.TypographyCustom[data-category=display][data-size=sm] {
+  font-size: 96px;
+  font-style: normal;
+  line-height: 104px;
+  letter-spacing: -2.88px;
+}
+
+/* src/components/Typography/css/category/heading.css */
+.TypographyCustom[data-category=heading][data-size=xxl] {
+  font-size: 72px;
+  font-style: normal;
+  line-height: 80px;
+  letter-spacing: -1.44px;
+}
+.TypographyCustom[data-category=heading][data-size=xl] {
+  font-size: 60px;
+  font-style: normal;
+  line-height: 68px;
+  letter-spacing: -1.08px;
+}
+.TypographyCustom[data-category=heading][data-size=lg] {
+  font-size: 48px;
+  font-style: normal;
+  line-height: 56px;
+  letter-spacing: -0.768px;
+}
+.TypographyCustom[data-category=heading][data-size=md] {
+  font-size: 36px;
+  font-style: normal;
+  line-height: 44px;
+  letter-spacing: -0.504px;
+}
+.TypographyCustom[data-category=heading][data-size=sm] {
+  font-size: 30px;
+  font-style: normal;
+  line-height: 38px;
+  letter-spacing: -0.39px;
+}
+.TypographyCustom[data-category=heading][data-size=xs] {
+  font-size: 24px;
+  font-style: normal;
+  line-height: 32px;
+  letter-spacing: -0.288px;
+}
+
+/* src/components/Typography/css/category/text.css */
+.TypographyCustom[data-category=text][data-size=xxl] {
+  font-size: 24px;
+  font-style: normal;
+  line-height: 32px;
+  letter-spacing: -0.288px;
+}
+.TypographyCustom[data-category=text][data-size=xl] {
+  font-size: 20px;
+  font-style: normal;
+  line-height: 28px;
+  letter-spacing: -0.2px;
+}
+.TypographyCustom[data-category=text][data-size=lg] {
+  font-size: 18px;
+  font-style: normal;
+  line-height: 24px;
+  letter-spacing: -0.144px;
+}
+.TypographyCustom[data-category=text][data-size=md] {
+  font-size: 16px;
+  font-style: normal;
+  line-height: 22px;
+  letter-spacing: -0.112px;
+}
+.TypographyCustom[data-category=text][data-size=sm] {
+  font-size: 14px;
+  font-style: normal;
+  line-height: 20px;
+  letter-spacing: -0.084px;
+}
+.TypographyCustom[data-category=text][data-size=xs] {
+  font-size: 12px;
+  font-style: normal;
+  line-height: 16px;
+  letter-spacing: -0.06px;
+}
+.TypographyCustom[data-category=text][data-size=xxs] {
+  font-size: 10px;
+  font-style: normal;
+  line-height: 14px;
+  letter-spacing: -0.04px;
+}
+
+/* src/components/Typography/css/index.css */
+
+/* src/components/CustomInput/css/input.css */
+.custom-input {
+  display: flex;
+  flex-direction: row;
+  padding: 12px;
+  align-items: center;
+  gap: 12px;
+  width: 296px;
+  align-self: stretch;
+  border-radius: var(--border-radius-radius-pre-lg, 12px);
+  border: 1px solid var(--border-default, #e6e6e6);
+  background: var(--surface-white, #fff);
+  box-shadow: 0px 1px 2px 0px rgba(23, 23, 23, 0.05);
+}
+.custom-input input {
+  width: 100%;
+  border: none;
+}
+.custom-input input::placeholder {
+  color: var(--text-disabled, #939197);
+  font-weight: 500;
+}
+.custom-input input:hover,
+.custom-input input:focus,
+.custom-input input:active {
+  border: none;
+  outline: none;
+}
+.custom-input .left-icon,
+.custom-input .right-icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.custom-input input {
+  font-family: var(--font-family);
+  color: var(--text-primary, #080808);
+  font-weight: 600;
+  font-size: 14px;
+  font-style: normal;
+}
+.custom-input .grey-box {
+  margin: -12px;
+  padding: 12px;
+  gap: 6px;
+  display: flex;
+  flex-direction: row;
+  background: #f9f9f9;
+}
+.custom-input .grey-right-box {
+  padding: 12px;
+  border-top-right-radius: 12px;
+  border-bottom-right-radius: 12px;
+  border-left: 1px solid #e6e6e6;
+}
+.custom-input .grey-left-box {
+  padding: 12px 14px;
+  border-top-left-radius: 12px;
+  border-bottom-left-radius: 12px;
+  border-right: 1px solid #e6e6e6;
+}
+.custom-input select:focus {
+  border: none;
+  outline: none;
+}
+
+/* src/components/CustomInput/css/state/default.css */
+
+/* src/components/CustomInput/css/state/hover.css */
+.custom-input:hover {
+  border: var(--border-radius-radius-none, 1px) solid var(--border-hover, #c9c9cc);
+  box-shadow: 0px 1px 2px 0px rgba(23, 23, 23, 0.05);
+}
+
+/* src/components/CustomInput/css/state/focused.css */
+.custom-input:focus-within {
+  border: var(--border-radius-radius-none, 1px) solid var(--border-default, #e6e6e6);
+  background: var(--surface-white, #fff);
+  box-shadow: 0px 0px 0px 4px var(--primary-30, #b5c5e7);
+}
+
+/* src/components/CustomInput/css/state/disabled.css */
+.custom-input:has(input:disabled) {
+  border-radius: var(--border-radius-radius-pre-lg, 12px);
+  border: var(--border-radius-radius-none, 1px) solid var(--border-default, #e6e6e6);
+  background: var(--surface-disabled, #f1f1f1);
+}
+
+/* src/components/CustomInput/css/state/error.css */
+.custom-input[data-error=true] {
+  border: var(--border-radius-radius-none, 1px) solid var(--border-error, #ea4621);
+}
+
+/* src/components/CustomInput/css/state/filled.css */
+
+/* src/components/CustomInput/css/index.css */
+/*# sourceMappingURL=index.css.map */

package/dist/index.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/CustomButton/css/customButton.css","../src/components/CustomButton/css/size.css","../src/components/CustomButton/css/color/default.css","../src/components/CustomButton/css/color/hover.css","../src/components/CustomButton/css/color/focused.css","../src/components/CustomButton/css/color/disabled.css","../src/components/Typography/css/bold.css","../src/components/Typography/css/category/display.css","../src/components/Typography/css/category/heading.css","../src/components/Typography/css/category/text.css","../src/components/CustomInput/css/input.css","../src/components/CustomInput/css/state/hover.css","../src/components/CustomInput/css/state/focused.css","../src/components/CustomInput/css/state/disabled.css","../src/components/CustomInput/css/state/error.css"],"sourcesContent":[".button {\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 14px;\n  font-weight: bold;\n  cursor: pointer;\n  transition: all 0.3s ease;\n  border: none;\n}\n\n/* .button[data-color='brand'] {\n  background-color: var(--brand-color, #093DB0);\n  color: #fff;\n}\n\n.button[data-color='gray'] {\n  background-color: var(--gray-color, #6c757d);\n  color: #fff;\n}\n\n.button[data-color='destructive'] {\n  background-color: var(--destructive-color, #dc3545);\n  color: #fff;\n} */\n\n/* .button[data-color='white'] {\n  background-color: #fff;\n  color: #000;\n  border: 1px solid var(--gray-color, #6c757d);\n} */\n\n/* .button[data-hierarchy='primary'] {\n  box-shadow: 0px 0px 0px 2px var(--primary-color, #007bff);\n}\n\n.button[data-hierarchy='secondary'] {\n  box-shadow: none;\n  border: 1px solid var(--secondary-color, #6c757d);\n}\n\n.button[data-hierarchy='link'] {\n  background: none;\n  border: none;\n  color: var(--brand-color, #007bff);\n}\n\n.button[data-hierarchy='linkContainer'] {\n  background-color: #f8f9fa;\n  color: var(--brand-color, #007bff);\n  border: 1px solid var(--gray-color, #6c757d);\n} */\n\n/*\n.button[data-state='default'] {\n  opacity: 1;\n}\n\n.button[data-state='hover'] {\n  opacity: 0.9;\n  background: #08379E;\n  \n}\n\n.button[data-state='focused'] {\n  box-shadow: 0px 0px 0px 4px var(--primary-30, #B5C5E7);\n}\n\n.button[data-state='disabled'] {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n*/\n",".button[data-size=\"sm\"] {\n  padding: 8px 12px;\n  gap: 8px;\n  border-radius: 12px;\n}\n\n.button[data-size=\"md\"] {\n  padding: 10px 14px;\n  gap: 8px;\n  border-radius: 12px;\n}\n\n.button[data-size=\"lg\"] {\n  padding: 12px 16px;\n  gap: 10px;\n  border-radius: 12px;\n}\n\n.button[data-size=\"xl\"] {\n  padding: 16px 24px;\n  gap: 12px;\n  border-radius: 16px;\n}\n",".button[data-colorHierarchy=\"brand/primary\"] {\n  background-color: var(--primary-main);\n}\n\n.button[data-colorHierarchy=\"brand/primary\"] .input-typography {\n  color: #fff;\n}\n\n.button[data-colorHierarchy=\"gray/secondary\"] {\n  background-color: #f1f1f1;\n}\n\n.button[data-colorHierarchy=\"gray/secondary\"] .input-typography {\n  color: #080808;\n}\n\n.button[data-colorHierarchy=\"white/secondary\"] {\n  background-color: #fff;\n  box-shadow: 0px 1px 2px 0px rgba(23, 23, 23, 0.05);\n  border: var(--border-radius-radius-none, 1px) solid var(--border-default, #e6e6e6);\n}\n\n.button[data-colorHierarchy=\"white/secondary\"] .input-typography {\n  color: #080808;\n}\n\n.button[data-colorHierarchy=\"gray/linkContainer\"] {\n  background-color: #fff;\n}\n\n.button[data-colorHierarchy=\"gray/linkContainer\"] .input-typography {\n  color: #080808;\n}\n\n.button[data-colorHierarchy=\"gray/link\"] {\n  background-color: #fff;\n  padding: 0;\n}\n\n.button[data-colorHierarchy=\"gray/link\"] .input-typography {\n  color: #080808;\n}\n\n.button[data-colorHierarchy=\"brand/link\"] {\n  background-color: #fff;\n  padding: 0;\n}\n\n.button[data-colorHierarchy=\"brand/link\"] .input-typography {\n  color: var(--primary-main);\n}\n\n.button[data-colorHierarchy=\"destructive/primary\"] {\n  background: var(--surface-error, #ea4621);\n}\n\n.button[data-colorHierarchy=\"destructive/primary\"] .input-typography {\n  color: #fff;\n}\n\n.button[data-colorHierarchy=\"destructive/secondary\"] {\n  background: var(--surface-error-secondary, #fdece9);\n}\n\n.button[data-colorHierarchy=\"destructive/secondary\"] .input-typography {\n  color: var(--text-error, #ea4621);\n}\n\n.button[data-colorHierarchy=\"destructive/linkContainer\"] {\n  background-color: #fff;\n}\n\n.button[data-colorHierarchy=\"destructive/linkContainer\"] .input-typography {\n  color: var(--text-error, #ea4621);\n}\n\n.button[data-colorHierarchy=\"\"] {\n  background-color: #fff;\n  padding: 0;\n}\n\n.button[data-colorHierarchy=\"\"] .input-typography {\n  color: var(--text-error, #ea4621);\n}\n",".button[data-colorHierarchy=\"brand/primary\"]:hover {\n  background: var(--surface-primary-hover, #08379e);\n}\n\n.button[data-colorHierarchy=\"gray/secondary\"]:hover {\n  background: var(--surface-secondary-hover, #ececed);\n}\n\n.button[data-colorHierarchy=\"white/secondary\"]:hover {\n  background: var(--surface-white---hover, #f9f9f9);\n}\n\n.button[data-colorHierarchy=\"gray/linkContainer\"]:hover {\n  background: var(--surface-secondary, #f1f1f1);\n}\n\n.button[data-colorHierarchy=\"gray/link\"]:hover {\n  background-color: #fff;\n}\n\n.button[data-colorHierarchy=\"brand/link\"]:hover {\n  background-color: #fff;\n}\n\n.button[data-colorHierarchy=\"destructive/primary\"]:hover {\n  background: var(--surface-error-hover, #d33f1e);\n}\n\n.button[data-colorHierarchy=\"destructive/secondary\"]:hover {\n  background: var(--surface-error-secondary-hover, #fbdad3);\n}\n\n.button[data-colorHierarchy=\"destructive/linkContainer\"]:hover {\n  background: var(--colors-red-5, #fef6f4);\n}\n\n.button[data-colorHierarchy=\"\"]:hover {\n  background-color: #fff;\n}\n",".button[data-colorHierarchy=\"brand/primary\"]:focus {\n  box-shadow: 0px 0px 0px 4px var(--primary-30, #b5c5e7);\n}\n\n.button[data-colorHierarchy=\"gray/secondary\"]:focus {\n  box-shadow: 0px 0px 0px 4px var(--neutural-50, #e6e6e6);\n}\n\n.button[data-colorHierarchy=\"white/secondary\"]:focus {\n  box-shadow: 0px 0px 0px 4px var(--neutural-50, #e6e6e6);\n}\n\n.button[data-colorHierarchy=\"gray/linkContainer\"]:focus {\n  box-shadow: 0px 0px 0px 4px var(--neutural-50, #e6e6e6);\n}\n\n.button[data-colorHierarchy=\"gray/link\"]:focus {\n  box-shadow: 0px 0px 0px 4px var(--neutural-50, #e6e6e6);\n}\n\n.button[data-colorHierarchy=\"brand/link\"]:focus {\n  box-shadow: 0px 0px 0px 4px var(--primary-30, #b5c5e7);\n}\n\n.button[data-colorHierarchy=\"destructive/primary\"]:focus {\n  box-shadow: 0px 0px 0px 4px var(--destructive-30, #f9c7bc);\n}\n\n.button[data-colorHierarchy=\"destructive/secondary\"]:focus {\n  box-shadow: 0px 0px 0px 4px var(--destructive-30, #f9c7bc);\n}\n\n.button[data-colorHierarchy=\"destructive/linkContainer\"]:focus {\n  box-shadow: 0px 0px 0px 4px var(--destructive-30, #f9c7bc);\n}\n\n.button[data-colorHierarchy=\"\"]:focus {\n  box-shadow: 0px 0px 0px 4px var(--destructive-30, #f9c7bc);\n}\n",".button[data-colorHierarchy=\"brand/primary\"]:disabled {\n  background: var(--surface-disabled, #f1f1f1);\n}\n\n.button:disabled .input-typography {\n  color: var(--text-disabled, #939197);\n}\n\n.button[data-colorHierarchy=\"gray/secondary\"]:disabled {\n  background: var(--surface-disabled, #f1f1f1);\n}\n\n.button[data-colorHierarchy=\"white/secondary\"]:disabled {\n  background: var(--surface-white---disabled, #fdfdfd);\n}\n\n/* .button[data-colorHierarchy=\"gray/linkContainer\"]:disabled {\n  }\n  \n  .button[data-colorHierarchy=\"gray/link\"]:disabled {\n  }\n  \n  .button[data-colorHierarchy=\"brand/link\"]:disabled {\n  } */\n\n.button[data-colorHierarchy=\"brand/link\"]:disabled .input-typography {\n  color: var(--text-action-disabled, #849ed7);\n}\n\n.button[data-colorHierarchy=\"destructive/primary\"]:disabled {\n  background: var(--surface-error-disabled, #fdece9);\n}\n\n.button[data-colorHierarchy=\"destructive/primary\"]:disabled .input-typography {\n  color: var(--text-error-disabled, #f5a290);\n}\n\n.button[data-colorHierarchy=\"destructive/secondary\"]:disabled {\n  background: var(--surface-error-disabled, #fdece9);\n}\n\n.button[data-colorHierarchy=\"destructive/secondary\"]:disabled .input-typography {\n  color: var(--text-error-disabled, #f5a290);\n}\n\n/* .button[data-colorHierarchy=\"destructive/linkContainer\"]:disabled {\n  }\n  \n  .button[data-colorHierarchy=\"\"]:disabled {\n  } */\n\n.button[data-colorHierarchy=\"destructive/linkContainer\"]:disabled .input-typography {\n  color: var(--text-error-disabled, #f5a290);\n}\n\n.button[data-colorHierarchy=\"destructive/link\"]:disabled .input-typography {\n  color: var(--text-error-disabled, #f5a290);\n}\n",".TypographyCustom {\n  color: var(--Gray-110, var(--colors-greyscale-110, #2d2b32));\n}\n\n/* text bold css*/\n.TypographyCustom[data-bold=\"extrabold\"] {\n  font-weight: 800;\n}\n\n.TypographyCustom[data-bold=\"bold\"] {\n  font-weight: 700;\n}\n\n.TypographyCustom[data-bold=\"semibold\"] {\n  font-weight: 600;\n}\n\n.TypographyCustom[data-bold=\"medium\"] {\n  font-weight: 500;\n}\n",".TypographyCustom[data-category=\"display\"][data-size=\"lg\"] {\n  font-size: 180px;\n  font-style: normal;\n  line-height: 188px; /* 104.444% */\n  letter-spacing: -9px;\n}\n\n.TypographyCustom[data-category=\"display\"][data-size=\"md\"] {\n  font-size: 128px;\n  font-style: normal;\n  line-height: 136px; /* 106.25% */\n  letter-spacing: -5.12px;\n}\n\n.TypographyCustom[data-category=\"display\"][data-size=\"sm\"] {\n  font-size: 96px;\n  font-style: normal;\n  line-height: 104px; /* 108.333% */\n  letter-spacing: -2.88px;\n}\n",".TypographyCustom[data-category=\"heading\"][data-size=\"xxl\"] {\n  font-size: 72px;\n  font-style: normal;\n  line-height: 80px; /* 111.111% */\n  letter-spacing: -1.44px;\n}\n\n.TypographyCustom[data-category=\"heading\"][data-size=\"xl\"] {\n  font-size: 60px;\n  font-style: normal;\n  line-height: 68px; /* 113.333% */\n  letter-spacing: -1.08px;\n}\n\n.TypographyCustom[data-category=\"heading\"][data-size=\"lg\"] {\n  font-size: 48px;\n  font-style: normal;\n  line-height: 56px; /* 116.667% */\n  letter-spacing: -0.768px;\n}\n\n.TypographyCustom[data-category=\"heading\"][data-size=\"md\"] {\n  font-size: 36px;\n  font-style: normal;\n  line-height: 44px; /* 122.222% */\n  letter-spacing: -0.504px;\n}\n\n.TypographyCustom[data-category=\"heading\"][data-size=\"sm\"] {\n  font-size: 30px;\n  font-style: normal;\n  line-height: 38px; /* 126.667% */\n  letter-spacing: -0.39px;\n}\n\n.TypographyCustom[data-category=\"heading\"][data-size=\"xs\"] {\n  font-size: 24px;\n  font-style: normal;\n  line-height: 32px; /* 133.333% */\n  letter-spacing: -0.288px;\n}\n",".TypographyCustom[data-category=\"text\"][data-size=\"xxl\"] {\n  font-size: 24px;\n  font-style: normal;\n  line-height: 32px; /* 133.333% */\n  letter-spacing: -0.288px;\n}\n\n.TypographyCustom[data-category=\"text\"][data-size=\"xl\"] {\n  font-size: 20px;\n  font-style: normal;\n  line-height: 28px; /* 140% */\n  letter-spacing: -0.2px;\n}\n\n.TypographyCustom[data-category=\"text\"][data-size=\"lg\"] {\n  font-size: 18px;\n  font-style: normal;\n  line-height: 24px; /* 133.333% */\n  letter-spacing: -0.144px;\n}\n\n.TypographyCustom[data-category=\"text\"][data-size=\"md\"] {\n  font-size: 16px;\n  font-style: normal;\n  line-height: 22px; /* 137.5% */\n  letter-spacing: -0.112px;\n}\n\n.TypographyCustom[data-category=\"text\"][data-size=\"sm\"] {\n  font-size: 14px;\n  font-style: normal;\n  line-height: 20px; /* 142.857% */\n  letter-spacing: -0.084px;\n}\n\n.TypographyCustom[data-category=\"text\"][data-size=\"xs\"] {\n  font-size: 12px;\n  font-style: normal;\n  line-height: 16px; /* 133.333% */\n  letter-spacing: -0.06px;\n}\n\n.TypographyCustom[data-category=\"text\"][data-size=\"xxs\"] {\n  font-size: 10px;\n  font-style: normal;\n  line-height: 14px; /* 140% */\n  letter-spacing: -0.04px;\n}\n",".custom-input {\n  display: flex;\n  flex-direction: row;\n  padding: 12px;\n  align-items: center;\n  gap: 12px;\n  width: 296px;\n  align-self: stretch;\n  border-radius: var(--border-radius-radius-pre-lg, 12px);\n\n  border: 1px solid var(--border-default, #e6e6e6);\n  background: var(--surface-white, #fff);\n\n  /* Shadow/xs */\n  box-shadow: 0px 1px 2px 0px rgba(23, 23, 23, 0.05);\n}\n\n.custom-input input {\n  width: 100%;\n  border: none;\n}\n\n.custom-input input::placeholder {\n  color: var(--text-disabled, #939197);\n  font-weight: 500;\n}\n\n.custom-input input:hover,\n.custom-input input:focus,\n.custom-input input:active {\n  border: none;\n  outline: none;\n}\n\n.custom-input .left-icon,\n.custom-input .right-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.custom-input input {\n  font-family: var(--font-family);\n  color: var(--text-primary, #080808);\n  font-weight: 600;\n  font-size: 14px;\n  font-style: normal;\n}\n\n.custom-input .grey-box {\n  margin: -12px;\n  padding: 12px;\n  gap: 6px;\n  display: flex;\n  flex-direction: row;\n  background: #f9f9f9;\n}\n\n.custom-input .grey-right-box {\n  padding: 12px;\n  border-top-right-radius: 12px;\n  border-bottom-right-radius: 12px;\n  border-left: 1px solid #e6e6e6;\n}\n\n.custom-input .grey-left-box {\n  padding: 12px 14px;\n  border-top-left-radius: 12px;\n  border-bottom-left-radius: 12px;\n  border-right: 1px solid #e6e6e6;\n}\n\n.custom-input select:focus {\n  border: none;\n  outline: none;\n}\n",".custom-input:hover {\n  border: var(--border-radius-radius-none, 1px) solid var(--border-hover, #c9c9cc);\n  /* Shadow/xs */\n  box-shadow: 0px 1px 2px 0px rgba(23, 23, 23, 0.05);\n}\n",".custom-input:focus-within {\n  border: var(--border-radius-radius-none, 1px) solid var(--border-default, #e6e6e6);\n  background: var(--surface-white, #fff);\n\n  box-shadow: 0px 0px 0px 4px var(--primary-30, #b5c5e7);\n}\n",".custom-input:has(input:disabled) {\n  border-radius: var(--border-radius-radius-pre-lg, 12px);\n  border: var(--border-radius-radius-none, 1px) solid var(--border-default, #e6e6e6);\n  background: var(--surface-disabled, #f1f1f1);\n}\n",".custom-input[data-error=\"true\"] {\n  border: var(--border-radius-radius-none, 1px) solid var(--border-error, #ea4621);\n}\n"],"mappings":"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","names":[]}

package/dist/index.d.mts

@@ -0,0 +1,46 @@
+import React, { CSSProperties } from 'react';
+
+type ButtonSize = "sm" | "md" | "lg" | "xl";
+type ButtonColor = "brand" | "gray" | "destructive" | "white";
+type ButtonHierarchy = "primary" | "secondary" | "link" | "linkContainer";
+type ButtonColorHierarchyType = `${ButtonColor}/${ButtonHierarchy}`;
+
+interface CustomButtonProps {
+    size?: ButtonSize;
+    colorHierarchy?: ButtonColorHierarchyType;
+    disabled?: boolean;
+    text: string;
+    leftIcon?: any;
+    rightIcon?: any;
+    onClick?: () => void;
+}
+
+declare const CustomButton: React.FC<CustomButtonProps>;
+
+type Size = "md" | "lg";
+type Type = "default" | "action" | "currency" | "creditCard" | "date" | "link" | "password" | "search" | "tel" | "number";
+interface CustomInputProps {
+    Size?: Size;
+    type?: Type;
+    label?: string;
+    disabled?: boolean;
+    errExists?: boolean;
+    placeholder: string;
+    leftIcon?: any;
+    rightIcon?: any;
+    onAction?: () => void;
+    style?: CSSProperties;
+    [key: string]: any;
+}
+
+declare const CustomInput: React.FC<CustomInputProps>;
+
+type CustomCheckboxProps = {
+    checked: boolean;
+    onChange?: (checked: boolean) => void;
+    label?: string;
+    disabled?: boolean;
+};
+declare const CustomCheckbox: React.FC<CustomCheckboxProps>;
+
+export { CustomButton as Button, CustomCheckbox, CustomInput };

package/dist/index.d.ts

@@ -0,0 +1,46 @@
+import React, { CSSProperties } from 'react';
+
+type ButtonSize = "sm" | "md" | "lg" | "xl";
+type ButtonColor = "brand" | "gray" | "destructive" | "white";
+type ButtonHierarchy = "primary" | "secondary" | "link" | "linkContainer";
+type ButtonColorHierarchyType = `${ButtonColor}/${ButtonHierarchy}`;
+
+interface CustomButtonProps {
+    size?: ButtonSize;
+    colorHierarchy?: ButtonColorHierarchyType;
+    disabled?: boolean;
+    text: string;
+    leftIcon?: any;
+    rightIcon?: any;
+    onClick?: () => void;
+}
+
+declare const CustomButton: React.FC<CustomButtonProps>;
+
+type Size = "md" | "lg";
+type Type = "default" | "action" | "currency" | "creditCard" | "date" | "link" | "password" | "search" | "tel" | "number";
+interface CustomInputProps {
+    Size?: Size;
+    type?: Type;
+    label?: string;
+    disabled?: boolean;
+    errExists?: boolean;
+    placeholder: string;
+    leftIcon?: any;
+    rightIcon?: any;
+    onAction?: () => void;
+    style?: CSSProperties;
+    [key: string]: any;
+}
+
+declare const CustomInput: React.FC<CustomInputProps>;
+
+type CustomCheckboxProps = {
+    checked: boolean;
+    onChange?: (checked: boolean) => void;
+    label?: string;
+    disabled?: boolean;
+};
+declare const CustomCheckbox: React.FC<CustomCheckboxProps>;
+
+export { CustomButton as Button, CustomCheckbox, CustomInput };

package/dist/index.js

@@ -0,0 +1 @@
+"use strict";var e=require("@mui/material"),t=require("react/jsx-runtime"),r=require("react"),s=require("countries-list"),a=require("currency-symbol-map");function i(e){return e&&e.__esModule?e:{default:e}}var l=i(r),o=i(a),n=Object.defineProperty,c=Object.defineProperties,d=Object.getOwnPropertyDescriptors,p=Object.getOwnPropertySymbols,x=Object.prototype.hasOwnProperty,h=Object.prototype.propertyIsEnumerable,C=(e,t,r)=>t in e?n(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r,u=(e,t)=>{for(var r in t||(t={}))x.call(t,r)&&C(e,r,t[r]);if(p)for(var r of p(t))h.call(t,r)&&C(e,r,t[r]);return e},y=(e,t)=>c(e,d(t)),m=(e,t)=>{var r={};for(var s in e)x.call(e,s)&&t.indexOf(s)<0&&(r[s]=e[s]);if(null!=e&&p)for(var s of p(e))t.indexOf(s)<0&&h.call(e,s)&&(r[s]=e[s]);return r},f=r=>{var s=r,{children:a,Size:i,category:l,bold:o,sx:n}=s,c=m(s,["children","Size","category","bold","sx"]);return t.jsx(e.Typography,y(u({className:"TypographyCustom","data-size":i,"data-category":l,"data-bold":o,sx:u({fontFamily:"var(--font-family), sans-serif"},n)},c),{children:a}))},g=({size:e="lg",colorHierarchy:r="brand/primary",disabled:s=!1,text:a,leftIcon:i,rightIcon:l,onClick:o})=>t.jsxs("button",{className:"button","data-size":e,"data-colorHierarchy":r,onClick:o,disabled:s,children:[i&&t.jsx("img",{src:i,alt:"icon"}),t.jsx(f,{className:"input-typography",category:"text",Size:e,bold:"bold",children:a}),l&&t.jsx("img",{src:l,alt:"icon"})]}),j=()=>t.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:t.jsx("path",{d:"M11.25 14.0625C11.25 14.3097 11.1767 14.5514 11.0393 14.757C10.902 14.9625 10.7068 15.1227 10.4784 15.2173C10.2499 15.312 9.99862 15.3367 9.75614 15.2885C9.51366 15.2402 9.29094 15.1212 9.11612 14.9464C8.9413 14.7716 8.82225 14.5488 8.77402 14.3064C8.72579 14.0639 8.75054 13.8126 8.84515 13.5841C8.93976 13.3557 9.09998 13.1605 9.30554 13.0232C9.5111 12.8858 9.75278 12.8125 10 12.8125C10.3315 12.8125 10.6495 12.9442 10.8839 13.1786C11.1183 13.413 11.25 13.731 11.25 14.0625ZM18.4375 10C18.4375 11.6688 17.9427 13.3001 17.0155 14.6876C16.0884 16.0752 14.7706 17.1566 13.2289 17.7952C11.6871 18.4338 9.99064 18.6009 8.35393 18.2754C6.71721 17.9498 5.2138 17.1462 4.03379 15.9662C2.85378 14.7862 2.05019 13.2828 1.72463 11.6461C1.39907 10.0094 1.56616 8.31286 2.20477 6.77111C2.84338 5.22936 3.92484 3.9116 5.31238 2.98448C6.69992 2.05735 8.33122 1.5625 10 1.5625C12.237 1.56498 14.3817 2.45473 15.9635 4.03653C17.5453 5.61833 18.435 7.763 18.4375 10ZM16.5625 10C16.5625 8.70206 16.1776 7.43327 15.4565 6.35407C14.7354 5.27487 13.7105 4.43374 12.5114 3.93704C11.3122 3.44034 9.99272 3.31038 8.71972 3.5636C7.44672 3.81681 6.2774 4.44183 5.35962 5.35961C4.44183 6.27739 3.81682 7.44672 3.5636 8.71972C3.31038 9.99272 3.44034 11.3122 3.93704 12.5114C4.43374 13.7105 5.27488 14.7354 6.35407 15.4565C7.43327 16.1776 8.70206 16.5625 10 16.5625C11.7399 16.5606 13.408 15.8686 14.6383 14.6383C15.8686 13.408 16.5606 11.7399 16.5625 10ZM10 5C8.10469 5 6.5625 6.40156 6.5625 8.125V8.4375C6.5625 8.68614 6.66127 8.9246 6.83709 9.10041C7.01291 9.27623 7.25136 9.375 7.5 9.375C7.74864 9.375 7.9871 9.27623 8.16292 9.10041C8.33873 8.9246 8.4375 8.68614 8.4375 8.4375V8.125C8.4375 7.43594 9.14063 6.875 10 6.875C10.8594 6.875 11.5625 7.43594 11.5625 8.125C11.5625 8.81406 10.8594 9.375 10 9.375C9.75136 9.375 9.51291 9.47377 9.33709 9.64959C9.16127 9.8254 9.0625 10.0639 9.0625 10.3125V10.9375C9.06194 11.1691 9.14715 11.3927 9.30169 11.5653C9.45623 11.7378 9.66916 11.847 9.89945 11.8719C10.1297 11.8967 10.3611 11.8354 10.5488 11.6998C10.7366 11.5642 10.8676 11.3639 10.9164 11.1375C12.368 10.7719 13.4375 9.56016 13.4375 8.125C13.4375 6.40156 11.8953 5 10 5Z",fill:"#080808"})}),b=e=>t.jsxs("div",{className:"custom-input","data-type":e.type,"data-error":e.errExists,children:[e.leftIcon&&t.jsx("img",{src:e.leftIcon,alt:"icon"}),t.jsx("input",y(u({type:"text",placeholder:e.placeholder,disabled:e.disabled},e.props),{style:{fontFamily:"var(--font-family)",color:"var(--text-primary, #080808)",fontWeight:600,fontSize:"14px",fontStyle:"normal"}})),t.jsx("div",{className:"right-icon",children:e.rightIcon?t.jsx("img",{src:e.rightIcon,alt:"icon"}):t.jsx(j,{})})]}),v=()=>t.jsxs("svg",{width:"16",height:"18",viewBox:"0 0 16 18",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[t.jsx("path",{d:"M11.6868 6.87324V5.08408C11.6868 2.98991 9.98844 1.29154 7.89427 1.29154C5.8001 1.28241 4.0951 2.97241 4.08594 5.06741V5.08408V6.87324",stroke:"#939197","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"}),t.jsx("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M11.0695 16.7081H4.70199C2.95699 16.7081 1.54199 15.294 1.54199 13.5481V9.97396C1.54199 8.22813 2.95699 6.81396 4.70199 6.81396H11.0695C12.8145 6.81396 14.2295 8.22813 14.2295 9.97396V13.5481C14.2295 15.294 12.8145 16.7081 11.0695 16.7081Z",stroke:"#939197","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"}),t.jsx("path",{d:"M7.88574 10.8357V12.6865",stroke:"#939197","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"})]}),w=()=>t.jsx("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:t.jsx("path",{d:"M4.44393 2.49455C4.36161 2.40174 4.26167 2.3262 4.14993 2.2723C4.0382 2.2184 3.91687 2.18722 3.79299 2.18055C3.66911 2.17389 3.54514 2.19188 3.42826 2.23348C3.31138 2.27508 3.20392 2.33946 3.11211 2.4229C3.0203 2.50634 2.94596 2.60716 2.89341 2.71954C2.84085 2.83192 2.81112 2.95361 2.80594 3.07756C2.80076 3.20152 2.82024 3.32526 2.86324 3.44163C2.90624 3.558 2.9719 3.66468 3.05643 3.75549L4.30643 5.13439C1.61503 6.92658 0.44706 9.49846 0.39081 9.61955C0.337882 9.73955 0.310547 9.86926 0.310547 10.0004C0.310547 10.1316 0.337882 10.2613 0.39081 10.3813C0.419716 10.4453 1.10409 11.9641 2.61659 13.4758C4.63847 15.4953 7.18769 16.5625 10.0002 16.5625C11.3671 16.5701 12.7217 16.3045 13.9846 15.7813L15.5541 17.5078C15.7222 17.6884 15.9547 17.7954 16.2011 17.8057C16.4476 17.816 16.6882 17.7288 16.8708 17.5628C17.0534 17.3969 17.1632 17.1657 17.1764 16.9194C17.1897 16.6731 17.1053 16.4314 16.9416 16.2469L4.44393 2.49455ZM10.0002 14.6875C7.68847 14.6875 5.66659 13.8492 3.99159 12.1969C3.33273 11.5445 2.7658 10.8054 2.30643 10C2.71815 9.27267 3.7744 7.66408 5.58768 6.53986L12.626 14.2828C11.7772 14.5539 10.8912 14.6904 10.0002 14.6875ZM19.6096 10.3813C19.5814 10.4445 18.9064 11.9438 17.4221 13.4406C17.3371 13.535 17.2338 13.6111 17.1185 13.6643C17.0032 13.7175 16.8783 13.7468 16.7513 13.7503C16.6244 13.7538 16.4981 13.7315 16.38 13.6847C16.2619 13.6378 16.1546 13.5675 16.0646 13.478C15.9745 13.3885 15.9036 13.2816 15.8561 13.1638C15.8086 13.046 15.7855 12.9198 15.7882 12.7929C15.791 12.6659 15.8195 12.5408 15.8721 12.4252C15.9246 12.3096 16.0001 12.2059 16.0939 12.1203C16.7175 11.4864 17.2554 10.7735 17.6939 10C17.2348 9.19443 16.6679 8.45531 16.0088 7.80314C14.333 6.1508 12.3119 5.31252 10.0002 5.31252C9.73847 5.31252 9.47675 5.32346 9.21894 5.34533C9.0947 5.35864 8.96905 5.34698 8.84938 5.31104C8.72971 5.27509 8.61844 5.21559 8.52209 5.13602C8.42575 5.05646 8.34628 4.95844 8.28837 4.84772C8.23045 4.737 8.19525 4.61583 8.18483 4.49131C8.17442 4.3668 8.189 4.24145 8.22772 4.12265C8.26644 4.00385 8.32851 3.89399 8.4103 3.79953C8.49208 3.70506 8.59193 3.6279 8.70396 3.57257C8.816 3.51725 8.93796 3.48488 9.06269 3.47736C9.36972 3.4508 9.68769 3.43752 10.0002 3.43752C12.8127 3.43752 15.3619 4.50549 17.3822 6.52502C18.8939 8.03674 19.5783 9.55627 19.6072 9.61955C19.6605 9.73938 19.6882 9.86901 19.6887 10.0002C19.6891 10.1313 19.6621 10.2611 19.6096 10.3813Z",fill:"#080808"})}),S=e=>{switch(e.type){case"default":default:return b(e);case"action":return(e=>{const s=r.useRef(null);return t.jsxs("div",{className:"custom-input","data-type":e.type,"data-error":e.errExists,children:[e.leftIcon&&t.jsx("img",{src:e.leftIcon,alt:"icon"}),t.jsx("input",u({type:"text",placeholder:e.placeholder,disabled:e.disabled,ref:s},e.props)),t.jsxs("div",{className:"grey-box grey-right-box",children:[t.jsx(f,{category:"text",Size:"sm",bold:"medium",onClick:()=>{var t;e.onAction&&e.onAction(null==(t=s.current)?void 0:t.value)},children:e.actionLabel}),e.rightIcon&&t.jsx("img",{src:e.rightIcon,alt:"icon"})]})]})})(e);case"currency":return(e=>{const[a,i]=r.useState(""),[n,c]=r.useState("USD"),[d,p]=r.useState([]),x=l.default.useRef(null);return r.useEffect((()=>{const e=[...new Set(Object.values(s.countries).map((e=>e.currency)))];p(e)}),[]),t.jsx("div",{className:"currency-input-container",children:t.jsxs("div",{className:"custom-input","data-type":e.type,"data-error":e.errExists,children:[t.jsx("div",{className:"grey-box grey-left-box",children:t.jsx(f,{category:"text",Size:"sm",bold:"semibold",children:o.default(n)||"$"})}),t.jsx("input",u({type:"text",placeholder:"amount",style:{marginLeft:"12px"},onChange:e=>{i(e.target.value)},disabled:e.disabled,ref:x},e.props)),t.jsx("div",{className:"grey-box grey-right-box",children:t.jsx("select",{value:n,onChange:e=>{c(e.target.value)},className:"currency-select",style:{fontFamily:"var(--font-family)",fontWeight:"500",width:"55px",border:"none",background:"transparent"},children:d.map((e=>t.jsx("option",{value:e,children:e},e)))})})]})})})(e);case"creditCard":return(e=>t.jsxs("div",{className:"custom-input","data-type":e.type,"data-error":e.errExists,children:[t.jsx("input",y(u({type:"text",placeholder:"0000 0000 0000 0000",disabled:e.disabled},e.props),{style:{fontFamily:"var(--font-family)",color:"var(--text-primary, #080808)",fontWeight:600,fontSize:"14px",fontStyle:"normal"}})),t.jsxs("div",{className:"right-icon",children:[" ",t.jsx(j,{})]})]}))(e);case"date":return(e=>t.jsx("div",{className:"custom-input","data-type":e.type,"data-error":e.errExists,children:t.jsx("input",y(u({type:"date",placeholder:e.placeholder,disabled:e.disabled},e.props),{style:{fontFamily:"var(--font-family)",color:"var(--text-primary, #080808)",fontWeight:600,fontSize:"14px",fontStyle:"normal"}}))}))(e);case"link":return(e=>t.jsxs("div",{className:"custom-input","data-type":e.type,"data-error":e.errExists,children:[t.jsx("div",{className:"grey-box grey-left-box",children:t.jsx(f,{category:"text",Size:"sm",bold:"medium",children:"https://"})}),t.jsx("input",y(u({type:"text",placeholder:"Link Text",disabled:e.disabled},e.props),{style:{fontFamily:"var(--font-family)",color:"var(--text-primary, #080808)",fontWeight:600,fontSize:"14px",fontStyle:"normal",marginLeft:"12px"}})),t.jsx("div",{className:"right-icon",children:e.rightIcon?t.jsx("img",{src:e.rightIcon,alt:"icon"}):t.jsx(j,{})})]}))(e);case"password":return(e=>t.jsxs("div",{className:"custom-input","data-type":e.type,"data-error":e.errExists,children:[t.jsx("div",{className:"left-icon",children:t.jsx(v,{})}),t.jsx("input",y(u({type:"password",placeholder:"*****************",disabled:e.disabled},e.props),{style:{fontFamily:"var(--font-family)",color:"var(--text-primary, #080808)",fontWeight:600,fontSize:"14px",fontStyle:"normal"}})),t.jsx("div",{className:"right-icon",children:e.rightIcon?t.jsx("img",{src:e.rightIcon,alt:"icon"}):t.jsx(w,{})})]}))(e);case"number":return(e=>t.jsxs("div",{className:"custom-input","data-type":e.type,"data-error":e.errExists,children:[e.leftIcon&&t.jsx("img",{src:e.leftIcon,alt:"icon"}),t.jsx("input",y(u({type:"number",placeholder:e.placeholder?e.placeholder:"Enter Value",disabled:e.disabled},e.props),{style:{fontFamily:"var(--font-family)",color:"var(--text-primary, #080808)",fontWeight:600,fontSize:"14px",fontStyle:"normal"}}))]}))(e)}},I=e=>{var r=e,{size:s="lg",type:a="default",disabled:i=!1,label:l="",errExists:o=!1,placeholder:n,leftIcon:c,rightIcon:d,style:p,onAction:x}=r,h=m(r,["size","type","disabled","label","errExists","placeholder","leftIcon","rightIcon","style","onAction"]);const C=u({type:a,placeholder:n,disabled:i,errExists:o,leftIcon:c,rightIcon:d,onAction:x},h);return t.jsxs("div",{style:p,children:[l&&t.jsx(f,{category:"text",Size:"sm",bold:"semibold",children:l}),t.jsx(S,u({},C))]})},k=({checked:e,onChange:r,label:s,disabled:a})=>t.jsxs("label",{className:"flex items-center space-x-3",children:[t.jsx("input",{type:"checkbox",checked:e,onChange:e=>r&&r(e.target.checked),disabled:a}),s&&t.jsx("span",{children:s})]});exports.Button=g,exports.CustomCheckbox=k,exports.CustomInput=I;//# sourceMappingURL=index.js.map