opus-toolkit-components 0.6.5 → 0.6.7
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.
|
@@ -34,7 +34,7 @@ ___CSS_LOADER_EXPORT___.push([module.id, ``, "",{"version":3,"sources":[],"names
|
|
|
34
34
|
|
|
35
35
|
/***/ }),
|
|
36
36
|
|
|
37
|
-
/***/
|
|
37
|
+
/***/ 117:
|
|
38
38
|
/***/ ((module, __webpack_exports__, __webpack_require__) => {
|
|
39
39
|
|
|
40
40
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
@@ -49,7 +49,7 @@ ___CSS_LOADER_EXPORT___.push([module.id, ``, "",{"version":3,"sources":[],"names
|
|
|
49
49
|
|
|
50
50
|
var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
|
|
51
51
|
// Module
|
|
52
|
-
___CSS_LOADER_EXPORT___.push([module.id,
|
|
52
|
+
___CSS_LOADER_EXPORT___.push([module.id, `input[type=date]::-webkit-calendar-picker-indicator{display:none}`, "",{"version":3,"sources":["webpack://./src/components/Forms/Datepickers/datepicker.scss"],"names":[],"mappings":"AAAA,oDACI,YAAA","sourcesContent":["input[type=\"date\"]::-webkit-calendar-picker-indicator {\r\n display: none;\r\n}"],"sourceRoot":""}]);
|
|
53
53
|
// Exports
|
|
54
54
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
|
|
55
55
|
|
|
@@ -633,21 +633,21 @@ const Accordion = _ref => {
|
|
|
633
633
|
}
|
|
634
634
|
}, [activeIndex]);
|
|
635
635
|
return /*#__PURE__*/external_react_default().createElement("div", {
|
|
636
|
-
className: "accordion rounded-md"
|
|
636
|
+
className: "accordion rounded-md bg-[--color-primary-bg] border border-[--color-stroke] w-full"
|
|
637
637
|
}, /*#__PURE__*/external_react_default().createElement("div", {
|
|
638
638
|
className: "accordion-item rounded-lg",
|
|
639
639
|
key: index
|
|
640
640
|
}, /*#__PURE__*/external_react_default().createElement("div", {
|
|
641
|
-
className: "accordion-header flex justify-between p-
|
|
641
|
+
className: "accordion-header flex justify-between p-3",
|
|
642
642
|
onClick: toggle // Handle both internal and external toggles
|
|
643
643
|
,
|
|
644
644
|
style: {
|
|
645
645
|
cursor: "pointer"
|
|
646
646
|
}
|
|
647
647
|
}, /*#__PURE__*/external_react_default().createElement("h2", {
|
|
648
|
-
className: "text-1xl text-
|
|
648
|
+
className: "text-1xl text-[--color-text-strong]"
|
|
649
649
|
}, title), /*#__PURE__*/external_react_default().createElement("div", null, isActive ? "-" : "+"))), isActive && /*#__PURE__*/external_react_default().createElement("div", {
|
|
650
|
-
className: "accordion-body p-
|
|
650
|
+
className: "accordion-body border-0 border border-t-2 border-solid border-greyLight100 p-3"
|
|
651
651
|
}, children));
|
|
652
652
|
};
|
|
653
653
|
/* harmony default export */ const Accordions_Accordion = (Accordion);
|
|
@@ -3509,9 +3509,9 @@ function Button(_ref) {
|
|
|
3509
3509
|
} = _ref;
|
|
3510
3510
|
// Define styles for button ranks
|
|
3511
3511
|
const rankStyles = {
|
|
3512
|
-
primary: 'bg-
|
|
3512
|
+
primary: 'bg-[--color-primary-btn] hover:bg-[--color-primary-btn-hover] text-greyBaseLight',
|
|
3513
3513
|
secondary: 'bg-greyBaseDark900 hover:bg-brandPink700 text-greyBaseLight',
|
|
3514
|
-
outline: 'bg-greyLight50 border-solid border-2 border-
|
|
3514
|
+
outline: 'bg-greyLight50 border-solid border-2 border-[--color-outline-btn] hover:border-[--color-outline-btn-hover] text-[--color-text-strong]',
|
|
3515
3515
|
neutral: 'bg-greyLight50 hover:bg-greyLight100 text-greyLight700',
|
|
3516
3516
|
destructive: 'bg-utilRed1000 hover:bg-utilRed800 text-greyBaseLight'
|
|
3517
3517
|
};
|
|
@@ -3541,50 +3541,20 @@ function Button(_ref) {
|
|
|
3541
3541
|
className: iconClassNames
|
|
3542
3542
|
}));
|
|
3543
3543
|
}
|
|
3544
|
-
// EXTERNAL MODULE: ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/Cards/card.scss
|
|
3545
|
-
var card = __webpack_require__(865);
|
|
3546
|
-
;// ./src/components/Cards/card.scss
|
|
3547
|
-
|
|
3548
|
-
|
|
3549
|
-
|
|
3550
|
-
|
|
3551
|
-
|
|
3552
|
-
|
|
3553
|
-
|
|
3554
|
-
|
|
3555
|
-
|
|
3556
|
-
|
|
3557
|
-
|
|
3558
|
-
var card_options = {};
|
|
3559
|
-
|
|
3560
|
-
card_options.styleTagTransform = (styleTagTransform_default());
|
|
3561
|
-
card_options.setAttributes = (setAttributesWithoutAttributes_default());
|
|
3562
|
-
card_options.insert = insertBySelector_default().bind(null, "head");
|
|
3563
|
-
card_options.domAPI = (styleDomAPI_default());
|
|
3564
|
-
card_options.insertStyleElement = (insertStyleElement_default());
|
|
3565
|
-
|
|
3566
|
-
var card_update = injectStylesIntoStyleTag_default()(card/* default */.A, card_options);
|
|
3567
|
-
|
|
3568
|
-
|
|
3569
|
-
|
|
3570
|
-
|
|
3571
|
-
/* harmony default export */ const Cards_card = (card/* default */.A && card/* default */.A.locals ? card/* default */.A.locals : undefined);
|
|
3572
|
-
|
|
3573
3544
|
;// ./src/components/Cards/Card.js
|
|
3574
3545
|
|
|
3575
|
-
|
|
3576
3546
|
function Card(_ref) {
|
|
3577
3547
|
let {
|
|
3578
3548
|
mode = 'light',
|
|
3579
3549
|
className = '',
|
|
3580
3550
|
children
|
|
3581
3551
|
} = _ref;
|
|
3582
|
-
const cardClasses = "p-5
|
|
3552
|
+
const cardClasses = "\n p-5 \n bg-[--color-primary-bg] \n text-[--color-text-weak] \n rounded-lg \n shadow-lg \n border-solid \n border-2 \n border-[--color-stroke] \n ".concat(className, "\n ");
|
|
3583
3553
|
return /*#__PURE__*/external_react_default().createElement("div", {
|
|
3584
3554
|
className: cardClasses
|
|
3585
3555
|
}, children);
|
|
3586
3556
|
}
|
|
3587
|
-
;// ./src/components/Forms/Inputs/Input.
|
|
3557
|
+
;// ./src/components/Forms/Inputs/Input.jsx
|
|
3588
3558
|
function Input_ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3589
3559
|
function Input_objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? Input_ownKeys(Object(t), !0).forEach(function (r) { Input_defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : Input_ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
3590
3560
|
function Input_defineProperty(e, r, t) { return (r = Input_toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
@@ -3618,12 +3588,12 @@ const Input = /*#__PURE__*/(0,external_react_.forwardRef)((_ref, ref) => {
|
|
|
3618
3588
|
// Custom component to render
|
|
3619
3589
|
customComponentProps = {} // Props for the custom component
|
|
3620
3590
|
} = _ref;
|
|
3621
|
-
const inputClasses = "".concat(className, " flex items-center rounded-md bg-
|
|
3622
|
-
const iconClasses = "h-5 w-5 ".concat(isAnimated ? 'transition-transform duration-200 group-focus-within:scale-125' : '', " text-
|
|
3591
|
+
const inputClasses = "".concat(className, " flex items-center rounded-md bg-[--color-input-bg] border ").concat(isValid ? 'border-[--color-stroke]' : 'border-utilRed1000', " text-md font-normal text-[--color-text-weak]");
|
|
3592
|
+
const iconClasses = "h-5 w-5 ".concat(isAnimated ? 'transition-transform duration-200 group-focus-within:scale-125' : '', " text-[--color-text-weak]");
|
|
3623
3593
|
return /*#__PURE__*/external_react_default().createElement("div", {
|
|
3624
3594
|
className: "flex flex-col mb-4"
|
|
3625
3595
|
}, /*#__PURE__*/external_react_default().createElement("label", {
|
|
3626
|
-
className: "text-
|
|
3596
|
+
className: "text-[--color-text-weak] mb-1 flex items-center"
|
|
3627
3597
|
}, label, required && /*#__PURE__*/external_react_default().createElement("span", {
|
|
3628
3598
|
className: "text-utilRed1000 ml-1"
|
|
3629
3599
|
}, "*")), /*#__PURE__*/external_react_default().createElement("div", {
|
|
@@ -3634,7 +3604,7 @@ const Input = /*#__PURE__*/(0,external_react_.forwardRef)((_ref, ref) => {
|
|
|
3634
3604
|
className: iconClasses
|
|
3635
3605
|
})), /*#__PURE__*/external_react_default().createElement("input", {
|
|
3636
3606
|
ref: ref,
|
|
3637
|
-
className: "w-full ".concat(Icon ? iconPosition === 'left' ? 'pl-10' : 'pr-10' : '', " bg-
|
|
3607
|
+
className: "w-full ".concat(Icon ? iconPosition === 'left' ? 'pl-10' : 'pr-10' : '', " bg-[--color-input-bg] border-none focus:ring-0 focus:outline-none rounded-md p-3"),
|
|
3638
3608
|
type: type,
|
|
3639
3609
|
name: name,
|
|
3640
3610
|
placeholder: placeholder,
|
|
@@ -3653,8 +3623,66 @@ const Input = /*#__PURE__*/(0,external_react_.forwardRef)((_ref, ref) => {
|
|
|
3653
3623
|
}, errorMessage), shouldRenderCustomComponent && customComponent && /*#__PURE__*/external_react_default().createElement(customComponent, Input_objectSpread({}, customComponentProps)));
|
|
3654
3624
|
});
|
|
3655
3625
|
/* harmony default export */ const Inputs_Input = (Input);
|
|
3626
|
+
;// ./node_modules/@heroicons/react/24/outline/esm/CalendarIcon.js
|
|
3627
|
+
|
|
3628
|
+
function CalendarIcon({
|
|
3629
|
+
title,
|
|
3630
|
+
titleId,
|
|
3631
|
+
...props
|
|
3632
|
+
}, svgRef) {
|
|
3633
|
+
return /*#__PURE__*/external_react_.createElement("svg", Object.assign({
|
|
3634
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
3635
|
+
fill: "none",
|
|
3636
|
+
viewBox: "0 0 24 24",
|
|
3637
|
+
strokeWidth: 1.5,
|
|
3638
|
+
stroke: "currentColor",
|
|
3639
|
+
"aria-hidden": "true",
|
|
3640
|
+
"data-slot": "icon",
|
|
3641
|
+
ref: svgRef,
|
|
3642
|
+
"aria-labelledby": titleId
|
|
3643
|
+
}, props), title ? /*#__PURE__*/external_react_.createElement("title", {
|
|
3644
|
+
id: titleId
|
|
3645
|
+
}, title) : null, /*#__PURE__*/external_react_.createElement("path", {
|
|
3646
|
+
strokeLinecap: "round",
|
|
3647
|
+
strokeLinejoin: "round",
|
|
3648
|
+
d: "M6.75 3v2.25M17.25 3v2.25M3 18.75V7.5a2.25 2.25 0 0 1 2.25-2.25h13.5A2.25 2.25 0 0 1 21 7.5v11.25m-18 0A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75m-18 0v-7.5A2.25 2.25 0 0 1 5.25 9h13.5A2.25 2.25 0 0 1 21 11.25v7.5"
|
|
3649
|
+
}));
|
|
3650
|
+
}
|
|
3651
|
+
const ForwardRef = /*#__PURE__*/ external_react_.forwardRef(CalendarIcon);
|
|
3652
|
+
/* harmony default export */ const esm_CalendarIcon = (ForwardRef);
|
|
3653
|
+
// EXTERNAL MODULE: ./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/dist/cjs.js!./src/components/Forms/Datepickers/datepicker.scss
|
|
3654
|
+
var datepicker = __webpack_require__(117);
|
|
3655
|
+
;// ./src/components/Forms/Datepickers/datepicker.scss
|
|
3656
|
+
|
|
3657
|
+
|
|
3658
|
+
|
|
3659
|
+
|
|
3660
|
+
|
|
3661
|
+
|
|
3662
|
+
|
|
3663
|
+
|
|
3664
|
+
|
|
3665
|
+
|
|
3666
|
+
|
|
3667
|
+
var datepicker_options = {};
|
|
3668
|
+
|
|
3669
|
+
datepicker_options.styleTagTransform = (styleTagTransform_default());
|
|
3670
|
+
datepicker_options.setAttributes = (setAttributesWithoutAttributes_default());
|
|
3671
|
+
datepicker_options.insert = insertBySelector_default().bind(null, "head");
|
|
3672
|
+
datepicker_options.domAPI = (styleDomAPI_default());
|
|
3673
|
+
datepicker_options.insertStyleElement = (insertStyleElement_default());
|
|
3674
|
+
|
|
3675
|
+
var datepicker_update = injectStylesIntoStyleTag_default()(datepicker/* default */.A, datepicker_options);
|
|
3676
|
+
|
|
3677
|
+
|
|
3678
|
+
|
|
3679
|
+
|
|
3680
|
+
/* harmony default export */ const Datepickers_datepicker = (datepicker/* default */.A && datepicker/* default */.A.locals ? datepicker/* default */.A.locals : undefined);
|
|
3681
|
+
|
|
3656
3682
|
;// ./src/components/Forms/Datepickers/DatePicker.js
|
|
3657
3683
|
|
|
3684
|
+
|
|
3685
|
+
|
|
3658
3686
|
function DatePicker(_ref) {
|
|
3659
3687
|
let {
|
|
3660
3688
|
initialDate = '',
|
|
@@ -3662,47 +3690,60 @@ function DatePicker(_ref) {
|
|
|
3662
3690
|
isValid = true,
|
|
3663
3691
|
errorMessage = "Error message",
|
|
3664
3692
|
name = 'date',
|
|
3665
|
-
// Add name prop for form identification
|
|
3666
3693
|
onChange,
|
|
3667
|
-
// Add onChange prop for passing event to parent
|
|
3668
3694
|
value,
|
|
3669
3695
|
className = '',
|
|
3670
3696
|
title = '',
|
|
3671
|
-
required = false
|
|
3697
|
+
required = false
|
|
3672
3698
|
} = _ref;
|
|
3673
3699
|
const [selectedDate, setSelectedDate] = (0,external_react_.useState)(value || initialDate);
|
|
3700
|
+
const inputRef = (0,external_react_.useRef)(null); // Create a reference for the input element
|
|
3701
|
+
|
|
3674
3702
|
(0,external_react_.useEffect)(() => {
|
|
3675
3703
|
if (value !== undefined) {
|
|
3676
|
-
setSelectedDate(value);
|
|
3704
|
+
setSelectedDate(value);
|
|
3677
3705
|
} else {
|
|
3678
|
-
setSelectedDate(initialDate);
|
|
3706
|
+
setSelectedDate(initialDate);
|
|
3679
3707
|
}
|
|
3680
3708
|
}, [value, initialDate]);
|
|
3681
3709
|
const handleDateChange = e => {
|
|
3682
3710
|
setSelectedDate(e.target.value);
|
|
3683
3711
|
if (onChange) {
|
|
3684
|
-
onChange(e);
|
|
3712
|
+
onChange(e);
|
|
3713
|
+
}
|
|
3714
|
+
};
|
|
3715
|
+
const handleIconClick = () => {
|
|
3716
|
+
if (inputRef.current) {
|
|
3717
|
+
inputRef.current.showPicker(); // Opens the native date picker (supported in modern browsers)
|
|
3685
3718
|
}
|
|
3686
3719
|
};
|
|
3687
|
-
const inputClasses = "".concat(className, " flex items-center rounded-md bg-white border ").concat(isValid ? 'border-greyLight500' : 'border-utilRed1000', " p-2 text-md font-normal text-gray-900");
|
|
3688
3720
|
return /*#__PURE__*/external_react_default().createElement("div", {
|
|
3689
|
-
className: "flex flex-col mb-4"
|
|
3721
|
+
className: "relative flex flex-col mb-4"
|
|
3690
3722
|
}, /*#__PURE__*/external_react_default().createElement("label", {
|
|
3691
|
-
htmlFor:
|
|
3723
|
+
htmlFor: name,
|
|
3724
|
+
className: "text-[--color-text-weak] mb-1"
|
|
3692
3725
|
}, label, required && /*#__PURE__*/external_react_default().createElement("span", {
|
|
3693
3726
|
className: "text-utilRed1000 ml-1"
|
|
3694
3727
|
}, "*")), /*#__PURE__*/external_react_default().createElement("input", {
|
|
3695
3728
|
type: "date",
|
|
3696
|
-
id:
|
|
3697
|
-
name: name
|
|
3729
|
+
id: name,
|
|
3730
|
+
name: name,
|
|
3731
|
+
ref: inputRef // Assign the ref to the input
|
|
3698
3732
|
,
|
|
3699
3733
|
value: selectedDate,
|
|
3700
3734
|
title: title,
|
|
3701
3735
|
"aria-label": title,
|
|
3702
3736
|
onChange: handleDateChange,
|
|
3703
|
-
|
|
3704
|
-
|
|
3705
|
-
}),
|
|
3737
|
+
required: required,
|
|
3738
|
+
className: "w-full py-2 px-3 pr-10 rounded-md bg-[--color-input-bg] border ".concat(isValid ? 'border-[--color-stroke]' : 'border-utilRed1000', " text-md font-normal text-[--color-text-weak] ").concat(className)
|
|
3739
|
+
}), /*#__PURE__*/external_react_default().createElement("button", {
|
|
3740
|
+
type: "button",
|
|
3741
|
+
onClick: handleIconClick,
|
|
3742
|
+
className: "absolute top-1/2 mt-1 right-3 transform",
|
|
3743
|
+
"aria-label": "Open date picker"
|
|
3744
|
+
}, /*#__PURE__*/external_react_default().createElement(esm_CalendarIcon, {
|
|
3745
|
+
className: "w-5 h-5 text-[--color-text-weak] hover:text-[--color-primary-btn-hover] transition"
|
|
3746
|
+
})), !isValid && /*#__PURE__*/external_react_default().createElement("span", {
|
|
3706
3747
|
className: "text-utilRed1000 text-sm"
|
|
3707
3748
|
}, errorMessage));
|
|
3708
3749
|
}
|
|
@@ -3749,14 +3790,14 @@ const RadioButton = _ref => {
|
|
|
3749
3790
|
return /*#__PURE__*/external_react_default().createElement("div", {
|
|
3750
3791
|
className: "flex flex-col mb-4"
|
|
3751
3792
|
}, /*#__PURE__*/external_react_default().createElement("label", {
|
|
3752
|
-
className: "text-
|
|
3793
|
+
className: "text-[--color-text-strong] mb-2 flex items-center"
|
|
3753
3794
|
}, label, required && /*#__PURE__*/external_react_default().createElement("span", {
|
|
3754
3795
|
className: "text-utilRed1000 ml-1"
|
|
3755
3796
|
}, "*")), /*#__PURE__*/external_react_default().createElement("div", {
|
|
3756
3797
|
className: "flex space-x-4"
|
|
3757
3798
|
}, options.map(option => /*#__PURE__*/external_react_default().createElement("label", {
|
|
3758
3799
|
key: option.value,
|
|
3759
|
-
className: "cursor-pointer py-2 px-4 border rounded-lg ".concat(selectedValue === option.value ? 'bg-
|
|
3800
|
+
className: "cursor-pointer py-2 px-4 border rounded-lg ".concat(selectedValue === option.value ? 'bg-[--color-primary-btn] text-[--color-text-strong] border-[--color-stroke]' : "bg-[--color-input-bg] text-[--color-text-strong] ".concat(!isValid && selectedValue === '' ? 'border-utilRed1000' : 'border-[--color-stroke]'), " transition duration-200")
|
|
3760
3801
|
}, /*#__PURE__*/external_react_default().createElement("input", {
|
|
3761
3802
|
type: "radio",
|
|
3762
3803
|
tabindex: tabIndex,
|
|
@@ -3821,7 +3862,7 @@ function Table(_ref) {
|
|
|
3821
3862
|
return /*#__PURE__*/external_react_default().createElement("table", {
|
|
3822
3863
|
className: "w-full table-auto text-left border-collapse ".concat(className)
|
|
3823
3864
|
}, /*#__PURE__*/external_react_default().createElement("thead", null, /*#__PURE__*/external_react_default().createElement("tr", {
|
|
3824
|
-
className: "bg-
|
|
3865
|
+
className: "bg-[--color-table-head-bg] ".concat(headRowClassName)
|
|
3825
3866
|
}, data.map(column => /*#__PURE__*/external_react_default().createElement("th", {
|
|
3826
3867
|
key: column.key,
|
|
3827
3868
|
className: "border-b border-gray-300 py-2 px-4 text-sm font-normal text-greyDark1000 ".concat(headCellClassName)
|
|
@@ -12067,8 +12108,8 @@ function ChevronDownIcon({
|
|
|
12067
12108
|
clipRule: "evenodd"
|
|
12068
12109
|
}));
|
|
12069
12110
|
}
|
|
12070
|
-
const
|
|
12071
|
-
/* harmony default export */ const esm_ChevronDownIcon = (
|
|
12111
|
+
const ChevronDownIcon_ForwardRef = /*#__PURE__*/ external_react_.forwardRef(ChevronDownIcon);
|
|
12112
|
+
/* harmony default export */ const esm_ChevronDownIcon = (ChevronDownIcon_ForwardRef);
|
|
12072
12113
|
;// ./src/components/Forms/Dropdowns/Dropdown.jsx
|
|
12073
12114
|
|
|
12074
12115
|
|
|
@@ -12098,7 +12139,7 @@ function Dropdown(_ref) {
|
|
|
12098
12139
|
const newSelectedItem = items.find(item => item.value === value) || null;
|
|
12099
12140
|
setSelectedItem(newSelectedItem);
|
|
12100
12141
|
}, [value, items]);
|
|
12101
|
-
const inputClasses = "inline-flex w-full justify-between items-center rounded-md bg-
|
|
12142
|
+
const inputClasses = "inline-flex w-full justify-between items-center rounded-md bg-[--color-input-bg] text-md font-normal border p-2 text-[--color-text-weak] ".concat(isValid ? 'border-[--color-stroke]' : 'border-utilRed1000', " ").concat(className);
|
|
12102
12143
|
const handleSelect = item => {
|
|
12103
12144
|
setSelectedItem(item);
|
|
12104
12145
|
const event = {
|
|
@@ -12117,7 +12158,7 @@ function Dropdown(_ref) {
|
|
|
12117
12158
|
"aria-label": title,
|
|
12118
12159
|
tabindex: tabIndex
|
|
12119
12160
|
}, /*#__PURE__*/external_react_default().createElement("label", {
|
|
12120
|
-
className: "flex items-center"
|
|
12161
|
+
className: "flex items-center text-[--color-text-weak] mb-1"
|
|
12121
12162
|
}, label, required && /*#__PURE__*/external_react_default().createElement("span", {
|
|
12122
12163
|
className: "ml-1 text-utilRed1000"
|
|
12123
12164
|
}, "*"), " "), /*#__PURE__*/external_react_default().createElement("div", null, /*#__PURE__*/external_react_default().createElement(It, {
|
|
@@ -12126,13 +12167,13 @@ function Dropdown(_ref) {
|
|
|
12126
12167
|
}, /*#__PURE__*/external_react_default().createElement("div", {
|
|
12127
12168
|
className: "flex items-center gap-2"
|
|
12128
12169
|
}, Icon && /*#__PURE__*/external_react_default().createElement(Icon, {
|
|
12129
|
-
className: "h-5 w-5 text-
|
|
12170
|
+
className: "h-5 w-5 text-[--color-text-weak]"
|
|
12130
12171
|
}), " ", /*#__PURE__*/external_react_default().createElement("span", null, selectedItem ? selectedItem.label : placeholder)), /*#__PURE__*/external_react_default().createElement(esm_ChevronDownIcon, {
|
|
12131
12172
|
"aria-hidden": "true",
|
|
12132
|
-
className: "-mr-1 h-5 w-5 text-
|
|
12173
|
+
className: "-mr-1 h-5 w-5 text-[--color-text-weak] transition-transform duration-200 ".concat(isOpen ? 'rotate-180' : 'rotate-0')
|
|
12133
12174
|
}))), /*#__PURE__*/external_react_default().createElement(gt, {
|
|
12134
12175
|
transition: true,
|
|
12135
|
-
className: "absolute right-0 z-10 mt-2 w-56 origin-top-right rounded-md bg-
|
|
12176
|
+
className: "absolute right-0 z-10 mt-2 w-56 origin-top-right rounded-md bg-[--color-primary-bg] shadow-lg ring-1 ring-black ring-opacity-5 transition focus:outline-none max-h-48 overflow-y-auto",
|
|
12136
12177
|
onClick: () => setIsOpen(false)
|
|
12137
12178
|
}, /*#__PURE__*/external_react_default().createElement("div", {
|
|
12138
12179
|
className: "py-1"
|
|
@@ -12145,7 +12186,7 @@ function Dropdown(_ref) {
|
|
|
12145
12186
|
return /*#__PURE__*/external_react_default().createElement("button", {
|
|
12146
12187
|
type: "button",
|
|
12147
12188
|
onClick: () => handleSelect(item),
|
|
12148
|
-
className: "block w-full px-4 py-2 text-left text-sm text-
|
|
12189
|
+
className: "block w-full px-4 py-2 text-left text-sm text-[--color-text-weak] ".concat(active ? 'bg-[--color-input-bg] text-[--color-text-weak]' : '', " hover:bg-[--color-input-bg]")
|
|
12149
12190
|
}, item.label);
|
|
12150
12191
|
})))), !isValid && /*#__PURE__*/external_react_default().createElement("span", {
|
|
12151
12192
|
className: "text-utilRed1000 text-sm"
|
|
@@ -12193,7 +12234,7 @@ const Navbar = _ref => {
|
|
|
12193
12234
|
logo
|
|
12194
12235
|
} = _ref;
|
|
12195
12236
|
return /*#__PURE__*/external_react_default().createElement("div", {
|
|
12196
|
-
className: "p-4 w-full bg-
|
|
12237
|
+
className: "p-4 w-full bg-[--color-primary-bg] navbar"
|
|
12197
12238
|
}, /*#__PURE__*/external_react_default().createElement("div", {
|
|
12198
12239
|
className: "container mx-auto flex items-center justify-between"
|
|
12199
12240
|
}, /*#__PURE__*/external_react_default().createElement("img", {
|
|
@@ -12201,7 +12242,7 @@ const Navbar = _ref => {
|
|
|
12201
12242
|
alt: "Navbar Logo",
|
|
12202
12243
|
className: "nav-logo"
|
|
12203
12244
|
}), /*#__PURE__*/external_react_default().createElement("div", {
|
|
12204
|
-
className: "right-content"
|
|
12245
|
+
className: "right-content text-[--color-text-strong]"
|
|
12205
12246
|
}, children)));
|
|
12206
12247
|
};
|
|
12207
12248
|
/* harmony default export */ const Navbar_Navbar = (Navbar);
|
|
@@ -12248,20 +12289,21 @@ const Modal = _ref => {
|
|
|
12248
12289
|
return /*#__PURE__*/external_react_default().createElement("div", {
|
|
12249
12290
|
className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50"
|
|
12250
12291
|
}, /*#__PURE__*/external_react_default().createElement("div", {
|
|
12251
|
-
className: "bg-
|
|
12292
|
+
className: "bg-[--color-primary-bg] rounded-lg shadow-xl w-11/12 max-w-fit p-6 ".concat(className)
|
|
12252
12293
|
}, /*#__PURE__*/external_react_default().createElement("div", {
|
|
12253
12294
|
className: "flex justify-end pb-3"
|
|
12254
12295
|
}, /*#__PURE__*/external_react_default().createElement("div", {
|
|
12255
12296
|
onClick: onClose,
|
|
12256
|
-
className: "hover:cursor-pointer"
|
|
12297
|
+
className: "hover:cursor-pointer text-[--color-text-strong]"
|
|
12257
12298
|
}, /*#__PURE__*/external_react_default().createElement(esm_XMarkIcon, {
|
|
12258
|
-
width: "24px"
|
|
12299
|
+
width: "24px",
|
|
12300
|
+
className: "text-[--color-text-strong]"
|
|
12259
12301
|
}))), /*#__PURE__*/external_react_default().createElement("div", {
|
|
12260
|
-
className: "border-b border-
|
|
12302
|
+
className: "border-b border-[--color-stroke] pb-4 text-[--color-text-strong] ".concat(headerClassName)
|
|
12261
12303
|
}, header), /*#__PURE__*/external_react_default().createElement("div", {
|
|
12262
|
-
className: "my-2"
|
|
12304
|
+
className: "my-2 text-[--color-text-strong]"
|
|
12263
12305
|
}, body), /*#__PURE__*/external_react_default().createElement("div", {
|
|
12264
|
-
className: "".concat(footerClassName)
|
|
12306
|
+
className: "text-[--color-text-weak] ".concat(footerClassName)
|
|
12265
12307
|
}, footer)));
|
|
12266
12308
|
};
|
|
12267
12309
|
/* harmony default export */ const Modals_Modal = (Modal);
|
|
@@ -12299,4 +12341,4 @@ function Loader(_ref) {
|
|
|
12299
12341
|
/******/ })()
|
|
12300
12342
|
;
|
|
12301
12343
|
});
|
|
12302
|
-
//# sourceMappingURL=main.
|
|
12344
|
+
//# sourceMappingURL=main.f8680847509c49764830.js.map
|