@secondstaxorg/sscomp 1.6.6 → 1.6.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.
Files changed (25) hide show
  1. package/dist/index.es.js +409 -268
  2. package/dist/index.es.js.map +1 -1
  3. package/dist/index.js +705 -341
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.min.js +430 -289
  6. package/dist/index.min.js.map +1 -1
  7. package/package.json +3 -3
  8. package/types/components/DatePicker/style.d.ts +1 -0
  9. package/types/components/DatePicker/type.d.ts +7 -0
  10. package/types/components/DropdownList/style.d.ts +1 -1
  11. package/types/components/DropdownList/type.d.ts +7 -0
  12. package/types/components/Footer/style.d.ts +0 -5
  13. package/types/components/FooterNew/FooterNew.d.ts +3 -0
  14. package/types/components/FooterNew/style.d.ts +1 -0
  15. package/types/components/FooterOld/FooterOld.d.ts +3 -0
  16. package/types/components/FooterOld/style.d.ts +6 -0
  17. package/types/components/MarketData/helpers.d.ts +2 -0
  18. package/types/components/Ribbon/style.d.ts +1 -0
  19. package/types/components/SSXBar/style.d.ts +1 -0
  20. package/types/components/SSXBar/types.d.ts +3 -2
  21. package/types/components/Selector/styles.d.ts +4 -0
  22. package/types/components/Selector/types.d.ts +28 -2
  23. package/types/components/TextField/style.d.ts +1 -0
  24. package/types/components/TextField/type.d.ts +1 -1
  25. package/types/components/index.d.ts +1 -1
package/dist/index.js CHANGED
@@ -16315,7 +16315,7 @@ const DropdownContainer = styled.div`
16315
16315
  gap: 12px;
16316
16316
  `;
16317
16317
 
16318
- const LabelContainer$1 = styled.div`
16318
+ const LabelContainer = styled.div`
16319
16319
  font-weight: 500;
16320
16320
  font-size: 16px;
16321
16321
  line-height: 19px;
@@ -16371,7 +16371,7 @@ const DropdownField$1 = styled.div`
16371
16371
  outline: none;
16372
16372
  }
16373
16373
  .placeholder{
16374
- color: ${theme.colors["neutral-200"]};
16374
+ color: ${theme.colors["neutral-400"]};
16375
16375
  }
16376
16376
  `;
16377
16377
 
@@ -16542,7 +16542,7 @@ const CountrySelector = (props) => {
16542
16542
  return (
16543
16543
  React$1.createElement(DropdownContainer, {__self: undefined, __source: {fileName: _jsxFileName$N, lineNumber: 60}}
16544
16544
  , label &&
16545
- React$1.createElement(LabelContainer$1, {__self: undefined, __source: {fileName: _jsxFileName$N, lineNumber: 62}}
16545
+ React$1.createElement(LabelContainer, {__self: undefined, __source: {fileName: _jsxFileName$N, lineNumber: 62}}
16546
16546
  , React$1.createElement('label', { className: "paragraph2Medium", __self: undefined, __source: {fileName: _jsxFileName$N, lineNumber: 63}}, label)
16547
16547
  )
16548
16548
 
@@ -16943,20 +16943,15 @@ const CurrencyPairsTable = (props) => {
16943
16943
  )
16944
16944
  };
16945
16945
 
16946
- const InputLabel$4 = styled.div`
16946
+ const InputLabel$6 = styled.div`
16947
16947
  display: flex;
16948
16948
  flex-direction: column;
16949
16949
  gap: 4px;
16950
16950
  label{
16951
16951
  color:${theme.colors["primary-900"]};
16952
- font-weight: 500;
16953
- font-family: "Circular Book Medium", sans-serif;
16954
16952
  }
16955
16953
  span{
16956
16954
  color: ${theme.colors["neutral-600"]};
16957
- font-size: 14px;
16958
- line-height: 17px;
16959
- font-weight: 400;
16960
16955
  }
16961
16956
  `;
16962
16957
 
@@ -16980,6 +16975,9 @@ const InputField$3 = styled.div`
16980
16975
  &.success{
16981
16976
  border-color: ${theme.colors["success-500"]};
16982
16977
  }
16978
+ &.error{
16979
+ border-color: ${theme.colors["error-500"]};
16980
+ }
16983
16981
  &.focused{
16984
16982
  border-color: ${theme.colors["primary-500"]};
16985
16983
  }
@@ -17008,6 +17006,19 @@ const InputField$3 = styled.div`
17008
17006
  font-weight: 400;
17009
17007
  line-height: 140%;
17010
17008
  }
17009
+
17010
+ .sr-only{
17011
+ position: absolute;
17012
+ width: 1px;
17013
+ left: 0;
17014
+ top: 0;
17015
+ height: 1px;
17016
+ margin: -1px;
17017
+ overflow: hidden;
17018
+ clip: rect(0, 0, 0, 0);
17019
+ white-space: nowrap;
17020
+ border: 0;
17021
+ }
17011
17022
  `;
17012
17023
 
17013
17024
  const CalendarContainer$1 = styled.div`
@@ -17129,23 +17140,36 @@ button{
17129
17140
  background: ${theme.colors["neutral-50"]};
17130
17141
  }
17131
17142
  }
17143
+ `;
17144
+
17145
+ const ErrorMessage$3 = styled.p`
17146
+ color: ${theme.colors["error-500"]};
17147
+ margin-top: 8px;
17148
+ display: flex;
17149
+ gap: 8px;
17150
+ justify-content: start;
17151
+ align-items: center;
17132
17152
  `;
17133
17153
 
17134
17154
  const _jsxFileName$L = "D:\\SSX\\Project\\Component Library\\sscomp\\src\\components\\DatePicker\\DatePicker.tsx";
17135
17155
 
17156
+
17136
17157
  /**
17137
17158
  * Component for picking date
17138
17159
  */
17139
17160
  const DatePicker = (props) => {
17140
- const { onChange, label, subtext,disablePastDays,disableFutureDays ,placeholder,width} = props;
17161
+ const { onChange, label, subtext,disablePastDays,disableFutureDays ,placeholder,width,required} = props;
17141
17162
  const [selectedDate, setSelectedDate] = React$1.useState(null);
17142
17163
  const [isCalendarOpen, setIsCalendarOpen] = React$1.useState(false);
17164
+ const [validationStatus,setValidationStatus] = React$1.useState('');
17143
17165
 
17144
17166
  const calendarRef = React$1.useRef(null);
17145
17167
 
17146
17168
  React$1.useEffect(()=>{
17147
17169
  document.addEventListener('click',function(e){
17148
- setIsCalendarOpen(calendarRef.current.contains(e.target));
17170
+ if (calendarRef.current){
17171
+ setIsCalendarOpen(calendarRef.current.contains(e.target));
17172
+ }
17149
17173
  });
17150
17174
  },[]);
17151
17175
 
@@ -17167,21 +17191,29 @@ const DatePicker = (props) => {
17167
17191
  };
17168
17192
 
17169
17193
  return (
17170
- React$1.createElement('div', { style: style, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 39}}
17194
+ React$1.createElement('div', { style: style, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 43}}
17171
17195
  , label &&
17172
- React$1.createElement(InputLabel$4, {__self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 41}}
17173
- , React$1.createElement('label', {__self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 42}}, label)
17174
- , subtext && React$1.createElement('span', {__self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 43}}, subtext)
17196
+ React$1.createElement(InputLabel$6, {__self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 45}}
17197
+ , React$1.createElement('label', { className: "paragraph2Medium", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 46}}, label)
17198
+ , subtext && React$1.createElement('span', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 47}}, subtext)
17175
17199
  )
17176
17200
 
17177
- , React$1.createElement(DatePickerContainer, { ref: calendarRef, className: selectedDate ? 'success' : '', style: {width:width ? width : '100%'}, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 46}}
17178
- , React$1.createElement(InputField$3, { className: `${selectedDate ? 'success' : ''} ${isCalendarOpen ? 'focused' : ''}`, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 47}}
17201
+ , React$1.createElement(DatePickerContainer, { ref: calendarRef, className: validationStatus, style: {width:width ? width : '100%'}, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 50}}
17202
+ , React$1.createElement(InputField$3, { className: `${validationStatus} ${isCalendarOpen ? 'focused' : ''}`, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 51}}
17203
+ , React$1.createElement('input', { type: "text", className: "sr-only", required: required, value: !selectedDate ? '' : selectedDate , onChange: ()=>{}, onInvalid: ()=>{
17204
+ setValidationStatus('error');
17205
+ }, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 52}})
17179
17206
  , React$1.createElement('input', {
17180
17207
  type: "text",
17181
17208
  value: selectedDate ? selectedDate.toLocaleDateString('en-GB',options) : '',
17182
17209
  readOnly: true,
17183
17210
  placeholder: `${placeholder ? placeholder : 'Select date'}`,
17184
- onClick: ()=>{setIsCalendarOpen(true);}, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 48}}
17211
+ onClick: ()=>{setIsCalendarOpen(true);},
17212
+ onBlur: ()=>{
17213
+ if (required && !selectedDate) {
17214
+ setValidationStatus('error');
17215
+ }
17216
+ }, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 55}}
17185
17217
  )
17186
17218
  , React$1.createElement('button', { type: "button", onClick: ()=>{
17187
17219
  if (isCalendarOpen){
@@ -17189,18 +17221,30 @@ const DatePicker = (props) => {
17189
17221
  setIsCalendarOpen(false);
17190
17222
  },50);
17191
17223
  }
17192
- }, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 55}}
17224
+ }, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 67}}
17193
17225
  /*calendar icon*/
17194
- , React$1.createElement('svg', { width: "21", height: "22", viewBox: "0 0 21 22" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 63}}
17195
- , React$1.createElement('path', { d: "M10.5 18C10.6978 18 10.8911 17.9414 11.0556 17.8315C11.22 17.7216 11.3482 17.5654 11.4239 17.3827C11.4996 17.2 11.5194 16.9989 11.4808 16.8049C11.4422 16.6109 11.347 16.4327 11.2071 16.2929C11.0673 16.153 10.8891 16.0578 10.6951 16.0192C10.5011 15.9806 10.3 16.0004 10.1173 16.0761C9.93459 16.1518 9.77841 16.28 9.66853 16.4444C9.55865 16.6089 9.5 16.8022 9.5 17C9.5 17.2652 9.60536 17.5196 9.79289 17.7071C9.98043 17.8946 10.2348 18 10.5 18ZM15.5 18C15.6978 18 15.8911 17.9414 16.0556 17.8315C16.22 17.7216 16.3482 17.5654 16.4239 17.3827C16.4996 17.2 16.5194 16.9989 16.4808 16.8049C16.4422 16.6109 16.347 16.4327 16.2071 16.2929C16.0673 16.153 15.8891 16.0578 15.6951 16.0192C15.5011 15.9806 15.3 16.0004 15.1173 16.0761C14.9346 16.1518 14.7784 16.28 14.6685 16.4444C14.5586 16.6089 14.5 16.8022 14.5 17C14.5 17.2652 14.6054 17.5196 14.7929 17.7071C14.9804 17.8946 15.2348 18 15.5 18ZM15.5 14C15.6978 14 15.8911 13.9414 16.0556 13.8315C16.22 13.7216 16.3482 13.5654 16.4239 13.3827C16.4996 13.2 16.5194 12.9989 16.4808 12.8049C16.4422 12.6109 16.347 12.4327 16.2071 12.2929C16.0673 12.153 15.8891 12.0578 15.6951 12.0192C15.5011 11.9806 15.3 12.0004 15.1173 12.0761C14.9346 12.1518 14.7784 12.28 14.6685 12.4444C14.5586 12.6089 14.5 12.8022 14.5 13C14.5 13.2652 14.6054 13.5196 14.7929 13.7071C14.9804 13.8946 15.2348 14 15.5 14ZM10.5 14C10.6978 14 10.8911 13.9414 11.0556 13.8315C11.22 13.7216 11.3482 13.5654 11.4239 13.3827C11.4996 13.2 11.5194 12.9989 11.4808 12.8049C11.4422 12.6109 11.347 12.4327 11.2071 12.2929C11.0673 12.153 10.8891 12.0578 10.6951 12.0192C10.5011 11.9806 10.3 12.0004 10.1173 12.0761C9.93459 12.1518 9.77841 12.28 9.66853 12.4444C9.55865 12.6089 9.5 12.8022 9.5 13C9.5 13.2652 9.60536 13.5196 9.79289 13.7071C9.98043 13.8946 10.2348 14 10.5 14ZM17.5 2H16.5V1C16.5 0.734784 16.3946 0.48043 16.2071 0.292893C16.0196 0.105357 15.7652 0 15.5 0C15.2348 0 14.9804 0.105357 14.7929 0.292893C14.6054 0.48043 14.5 0.734784 14.5 1V2H6.5V1C6.5 0.734784 6.39464 0.48043 6.20711 0.292893C6.01957 0.105357 5.76522 0 5.5 0C5.23478 0 4.98043 0.105357 4.79289 0.292893C4.60536 0.48043 4.5 0.734784 4.5 1V2H3.5C2.70435 2 1.94129 2.31607 1.37868 2.87868C0.816071 3.44129 0.5 4.20435 0.5 5V19C0.5 19.7956 0.816071 20.5587 1.37868 21.1213C1.94129 21.6839 2.70435 22 3.5 22H17.5C18.2956 22 19.0587 21.6839 19.6213 21.1213C20.1839 20.5587 20.5 19.7956 20.5 19V5C20.5 4.20435 20.1839 3.44129 19.6213 2.87868C19.0587 2.31607 18.2956 2 17.5 2ZM18.5 19C18.5 19.2652 18.3946 19.5196 18.2071 19.7071C18.0196 19.8946 17.7652 20 17.5 20H3.5C3.23478 20 2.98043 19.8946 2.79289 19.7071C2.60536 19.5196 2.5 19.2652 2.5 19V10H18.5V19ZM18.5 8H2.5V5C2.5 4.73478 2.60536 4.48043 2.79289 4.29289C2.98043 4.10536 3.23478 4 3.5 4H4.5V5C4.5 5.26522 4.60536 5.51957 4.79289 5.70711C4.98043 5.89464 5.23478 6 5.5 6C5.76522 6 6.01957 5.89464 6.20711 5.70711C6.39464 5.51957 6.5 5.26522 6.5 5V4H14.5V5C14.5 5.26522 14.6054 5.51957 14.7929 5.70711C14.9804 5.89464 15.2348 6 15.5 6C15.7652 6 16.0196 5.89464 16.2071 5.70711C16.3946 5.51957 16.5 5.26522 16.5 5V4H17.5C17.7652 4 18.0196 4.10536 18.2071 4.29289C18.3946 4.48043 18.5 4.73478 18.5 5V8ZM5.5 14C5.69778 14 5.89112 13.9414 6.05557 13.8315C6.22002 13.7216 6.34819 13.5654 6.42388 13.3827C6.49957 13.2 6.51937 12.9989 6.48079 12.8049C6.4422 12.6109 6.34696 12.4327 6.20711 12.2929C6.06725 12.153 5.88907 12.0578 5.69509 12.0192C5.50111 11.9806 5.30004 12.0004 5.11732 12.0761C4.93459 12.1518 4.77841 12.28 4.66853 12.4444C4.55865 12.6089 4.5 12.8022 4.5 13C4.5 13.2652 4.60536 13.5196 4.79289 13.7071C4.98043 13.8946 5.23478 14 5.5 14ZM5.5 18C5.69778 18 5.89112 17.9414 6.05557 17.8315C6.22002 17.7216 6.34819 17.5654 6.42388 17.3827C6.49957 17.2 6.51937 16.9989 6.48079 16.8049C6.4422 16.6109 6.34696 16.4327 6.20711 16.2929C6.06725 16.153 5.88907 16.0578 5.69509 16.0192C5.50111 15.9806 5.30004 16.0004 5.11732 16.0761C4.93459 16.1518 4.77841 16.28 4.66853 16.4444C4.55865 16.6089 4.5 16.8022 4.5 17C4.5 17.2652 4.60536 17.5196 4.79289 17.7071C4.98043 17.8946 5.23478 18 5.5 18Z" , fill: "#070B12", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 64}})
17226
+ , React$1.createElement('svg', { width: "21", height: "22", viewBox: "0 0 21 22" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 75}}
17227
+ , React$1.createElement('path', { d: "M10.5 18C10.6978 18 10.8911 17.9414 11.0556 17.8315C11.22 17.7216 11.3482 17.5654 11.4239 17.3827C11.4996 17.2 11.5194 16.9989 11.4808 16.8049C11.4422 16.6109 11.347 16.4327 11.2071 16.2929C11.0673 16.153 10.8891 16.0578 10.6951 16.0192C10.5011 15.9806 10.3 16.0004 10.1173 16.0761C9.93459 16.1518 9.77841 16.28 9.66853 16.4444C9.55865 16.6089 9.5 16.8022 9.5 17C9.5 17.2652 9.60536 17.5196 9.79289 17.7071C9.98043 17.8946 10.2348 18 10.5 18ZM15.5 18C15.6978 18 15.8911 17.9414 16.0556 17.8315C16.22 17.7216 16.3482 17.5654 16.4239 17.3827C16.4996 17.2 16.5194 16.9989 16.4808 16.8049C16.4422 16.6109 16.347 16.4327 16.2071 16.2929C16.0673 16.153 15.8891 16.0578 15.6951 16.0192C15.5011 15.9806 15.3 16.0004 15.1173 16.0761C14.9346 16.1518 14.7784 16.28 14.6685 16.4444C14.5586 16.6089 14.5 16.8022 14.5 17C14.5 17.2652 14.6054 17.5196 14.7929 17.7071C14.9804 17.8946 15.2348 18 15.5 18ZM15.5 14C15.6978 14 15.8911 13.9414 16.0556 13.8315C16.22 13.7216 16.3482 13.5654 16.4239 13.3827C16.4996 13.2 16.5194 12.9989 16.4808 12.8049C16.4422 12.6109 16.347 12.4327 16.2071 12.2929C16.0673 12.153 15.8891 12.0578 15.6951 12.0192C15.5011 11.9806 15.3 12.0004 15.1173 12.0761C14.9346 12.1518 14.7784 12.28 14.6685 12.4444C14.5586 12.6089 14.5 12.8022 14.5 13C14.5 13.2652 14.6054 13.5196 14.7929 13.7071C14.9804 13.8946 15.2348 14 15.5 14ZM10.5 14C10.6978 14 10.8911 13.9414 11.0556 13.8315C11.22 13.7216 11.3482 13.5654 11.4239 13.3827C11.4996 13.2 11.5194 12.9989 11.4808 12.8049C11.4422 12.6109 11.347 12.4327 11.2071 12.2929C11.0673 12.153 10.8891 12.0578 10.6951 12.0192C10.5011 11.9806 10.3 12.0004 10.1173 12.0761C9.93459 12.1518 9.77841 12.28 9.66853 12.4444C9.55865 12.6089 9.5 12.8022 9.5 13C9.5 13.2652 9.60536 13.5196 9.79289 13.7071C9.98043 13.8946 10.2348 14 10.5 14ZM17.5 2H16.5V1C16.5 0.734784 16.3946 0.48043 16.2071 0.292893C16.0196 0.105357 15.7652 0 15.5 0C15.2348 0 14.9804 0.105357 14.7929 0.292893C14.6054 0.48043 14.5 0.734784 14.5 1V2H6.5V1C6.5 0.734784 6.39464 0.48043 6.20711 0.292893C6.01957 0.105357 5.76522 0 5.5 0C5.23478 0 4.98043 0.105357 4.79289 0.292893C4.60536 0.48043 4.5 0.734784 4.5 1V2H3.5C2.70435 2 1.94129 2.31607 1.37868 2.87868C0.816071 3.44129 0.5 4.20435 0.5 5V19C0.5 19.7956 0.816071 20.5587 1.37868 21.1213C1.94129 21.6839 2.70435 22 3.5 22H17.5C18.2956 22 19.0587 21.6839 19.6213 21.1213C20.1839 20.5587 20.5 19.7956 20.5 19V5C20.5 4.20435 20.1839 3.44129 19.6213 2.87868C19.0587 2.31607 18.2956 2 17.5 2ZM18.5 19C18.5 19.2652 18.3946 19.5196 18.2071 19.7071C18.0196 19.8946 17.7652 20 17.5 20H3.5C3.23478 20 2.98043 19.8946 2.79289 19.7071C2.60536 19.5196 2.5 19.2652 2.5 19V10H18.5V19ZM18.5 8H2.5V5C2.5 4.73478 2.60536 4.48043 2.79289 4.29289C2.98043 4.10536 3.23478 4 3.5 4H4.5V5C4.5 5.26522 4.60536 5.51957 4.79289 5.70711C4.98043 5.89464 5.23478 6 5.5 6C5.76522 6 6.01957 5.89464 6.20711 5.70711C6.39464 5.51957 6.5 5.26522 6.5 5V4H14.5V5C14.5 5.26522 14.6054 5.51957 14.7929 5.70711C14.9804 5.89464 15.2348 6 15.5 6C15.7652 6 16.0196 5.89464 16.2071 5.70711C16.3946 5.51957 16.5 5.26522 16.5 5V4H17.5C17.7652 4 18.0196 4.10536 18.2071 4.29289C18.3946 4.48043 18.5 4.73478 18.5 5V8ZM5.5 14C5.69778 14 5.89112 13.9414 6.05557 13.8315C6.22002 13.7216 6.34819 13.5654 6.42388 13.3827C6.49957 13.2 6.51937 12.9989 6.48079 12.8049C6.4422 12.6109 6.34696 12.4327 6.20711 12.2929C6.06725 12.153 5.88907 12.0578 5.69509 12.0192C5.50111 11.9806 5.30004 12.0004 5.11732 12.0761C4.93459 12.1518 4.77841 12.28 4.66853 12.4444C4.55865 12.6089 4.5 12.8022 4.5 13C4.5 13.2652 4.60536 13.5196 4.79289 13.7071C4.98043 13.8946 5.23478 14 5.5 14ZM5.5 18C5.69778 18 5.89112 17.9414 6.05557 17.8315C6.22002 17.7216 6.34819 17.5654 6.42388 17.3827C6.49957 17.2 6.51937 16.9989 6.48079 16.8049C6.4422 16.6109 6.34696 16.4327 6.20711 16.2929C6.06725 16.153 5.88907 16.0578 5.69509 16.0192C5.50111 15.9806 5.30004 16.0004 5.11732 16.0761C4.93459 16.1518 4.77841 16.28 4.66853 16.4444C4.55865 16.6089 4.5 16.8022 4.5 17C4.5 17.2652 4.60536 17.5196 4.79289 17.7071C4.98043 17.8946 5.23478 18 5.5 18Z" , fill: "#070B12", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 76}})
17196
17228
  )
17197
17229
  )
17198
17230
  )
17199
17231
  , isCalendarOpen && (
17200
- React$1.createElement('div', { style: {position:"absolute",marginTop:4}, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 69}}
17201
- , React$1.createElement(Calendar, { onChange: handleDateChange, selected: selectedDate, disablePastDaysProp: !!disablePastDays, disableFutureDaysProp: !!disableFutureDays, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 70}})
17232
+ React$1.createElement('div', { style: {position:"absolute",marginTop:4}, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 81}}
17233
+ , React$1.createElement(Calendar, { onChange: (e)=>{
17234
+ handleDateChange(e);
17235
+ setValidationStatus('success');
17236
+ }, selected: selectedDate, disablePastDaysProp: !!disablePastDays, disableFutureDaysProp: !!disableFutureDays, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 82}})
17202
17237
  )
17203
17238
  )
17239
+ , required && validationStatus === 'error' &&
17240
+ React$1.createElement(ErrorMessage$3, {__self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 89}}
17241
+ /*exclamation-triangle*/
17242
+ , React$1.createElement('svg', { width: "16", height: "14", viewBox: "0 0 16 14" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 91}}
17243
+ , React$1.createElement('path', { d: "M8.00006 9.66669C7.86821 9.66669 7.73931 9.70578 7.62968 9.77904C7.52005 9.85229 7.4346 9.95641 7.38414 10.0782C7.33368 10.2 7.32048 10.3341 7.3462 10.4634C7.37193 10.5927 7.43542 10.7115 7.52866 10.8048C7.62189 10.898 7.74068 10.9615 7.87 10.9872C7.99932 11.0129 8.13336 10.9997 8.25518 10.9493C8.377 10.8988 8.48112 10.8134 8.55437 10.7037C8.62763 10.5941 8.66673 10.4652 8.66673 10.3334C8.66673 10.1565 8.59649 9.98697 8.47146 9.86195C8.34644 9.73692 8.17687 9.66669 8.00006 9.66669ZM15.1134 10.6467L9.74673 1.31335C9.57326 1.00236 9.31992 0.743323 9.01285 0.562997C8.70579 0.382672 8.35615 0.287598 8.00006 0.287598C7.64396 0.287598 7.29433 0.382672 6.98726 0.562997C6.6802 0.743323 6.42686 1.00236 6.25339 1.31335L0.92006 10.6467C0.74059 10.9494 0.644155 11.294 0.640489 11.6459C0.636824 11.9978 0.726058 12.3444 0.899184 12.6507C1.07231 12.9571 1.3232 13.2123 1.62652 13.3907C1.92984 13.5691 2.27485 13.6643 2.62673 13.6667H13.3734C13.7281 13.6702 14.0773 13.5793 14.3853 13.4033C14.6933 13.2273 14.949 12.9726 15.126 12.6652C15.3031 12.3579 15.3953 12.009 15.3931 11.6542C15.3908 11.2995 15.2943 10.9518 15.1134 10.6467ZM13.9601 11.98C13.9016 12.084 13.8164 12.1704 13.7132 12.2302C13.61 12.29 13.4927 12.321 13.3734 12.32H2.62673C2.50747 12.321 2.39013 12.29 2.28694 12.2302C2.18375 12.1704 2.0985 12.084 2.04006 11.98C1.98155 11.8787 1.95074 11.7637 1.95074 11.6467C1.95074 11.5297 1.98155 11.4147 2.04006 11.3134L7.37339 1.98002C7.42934 1.87082 7.51433 1.77917 7.61902 1.71518C7.72371 1.65119 7.84403 1.61733 7.96673 1.61733C8.08942 1.61733 8.20974 1.65119 8.31443 1.71518C8.41912 1.77917 8.50411 1.87082 8.56006 1.98002L13.9267 11.3134C13.9929 11.4132 14.0309 11.5291 14.0367 11.6488C14.0426 11.7684 14.0161 11.8875 13.9601 11.9934V11.98ZM8.00006 4.33335C7.82325 4.33335 7.65368 4.40359 7.52866 4.52861C7.40363 4.65364 7.33339 4.82321 7.33339 5.00002V7.66669C7.33339 7.8435 7.40363 8.01307 7.52866 8.13809C7.65368 8.26311 7.82325 8.33335 8.00006 8.33335C8.17687 8.33335 8.34644 8.26311 8.47146 8.13809C8.59649 8.01307 8.66673 7.8435 8.66673 7.66669V5.00002C8.66673 4.82321 8.59649 4.65364 8.47146 4.52861C8.34644 4.40359 8.17687 4.33335 8.00006 4.33335Z" , fill: "#F80000", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 92}})
17244
+ )
17245
+ , React$1.createElement('span', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 94}}, "This field is required" )
17246
+ )
17247
+
17204
17248
  )
17205
17249
  )
17206
17250
  );
@@ -17271,7 +17315,7 @@ const Calendar = ({ onChange, selected,disablePastDaysProp,disableFutureDaysProp
17271
17315
  for (let i = firstDay - 1; i >= 0; i--) {
17272
17316
  const day = daysInPreviousMonth - i;
17273
17317
  days.push(
17274
- React$1.createElement('div', { key: `previous-day-${day}`, className: "calendar-day previous-month-day" , __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 143}}
17318
+ React$1.createElement('div', { key: `previous-day-${day}`, className: "calendar-day previous-month-day" , __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 167}}
17275
17319
  , day
17276
17320
  )
17277
17321
  );
@@ -17315,7 +17359,7 @@ const Calendar = ({ onChange, selected,disablePastDaysProp,disableFutureDaysProp
17315
17359
  React$1.createElement('div', {
17316
17360
  key: `current-day-${day}`,
17317
17361
  className: `calendar-day ${dayClassName}`,
17318
- onClick: handleClick, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 184}}
17362
+ onClick: handleClick, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 208}}
17319
17363
 
17320
17364
  , day
17321
17365
  )
@@ -17327,7 +17371,7 @@ const Calendar = ({ onChange, selected,disablePastDaysProp,disableFutureDaysProp
17327
17371
  const remainingDays = (7 - (days.length % 7)) % 7;
17328
17372
  for (let day = 1; day <= remainingDays; day++) {
17329
17373
  days.push(
17330
- React$1.createElement('div', { key: `next-day-${day}`, className: "calendar-day next-month-day" , __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 199}}
17374
+ React$1.createElement('div', { key: `next-day-${day}`, className: "calendar-day next-month-day" , __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 223}}
17331
17375
  , day
17332
17376
  )
17333
17377
  );
@@ -17340,75 +17384,75 @@ const Calendar = ({ onChange, selected,disablePastDaysProp,disableFutureDaysProp
17340
17384
  for (let year = currentYear - 10; year <= currentYear + 10; year++) {
17341
17385
  const selectedClass = year===currentDate.getFullYear()?'selected-year':'';
17342
17386
  years.push(
17343
- React$1.createElement('div', { key: year, onClick: () => handleSelectYear(year), className: `year-option ${selectedClass}`, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 212}}
17387
+ React$1.createElement('div', { key: year, onClick: () => handleSelectYear(year), className: `year-option ${selectedClass}`, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 236}}
17344
17388
  , year
17345
17389
  )
17346
17390
  );
17347
17391
  }
17348
17392
 
17349
17393
  return (
17350
- React$1.createElement('div', { className: "year-picker", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 219}}
17351
- , React$1.createElement('div', { className: "year-options", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 220}}, years)
17394
+ React$1.createElement('div', { className: "year-picker", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 243}}
17395
+ , React$1.createElement('div', { className: "year-options", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 244}}, years)
17352
17396
  )
17353
17397
  )
17354
17398
  };
17355
17399
 
17356
17400
  return (
17357
- React$1.createElement(CalendarContainer$1, {__self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 226}}
17358
- , React$1.createElement('div', { className: "header", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 227}}
17401
+ React$1.createElement(CalendarContainer$1, {__self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 250}}
17402
+ , React$1.createElement('div', { className: "header", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 251}}
17359
17403
  , !calendarView &&
17360
- React$1.createElement('button', { type: "button", onClick: handlePreviousYear, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 229}}
17404
+ React$1.createElement('button', { type: "button", onClick: handlePreviousYear, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 253}}
17361
17405
  /*circle arrow left*/
17362
- , React$1.createElement('svg', { width: "20", height: "20", viewBox: "0 0 20 20" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 231}}
17363
- , React$1.createElement('path', { d: "M6.29 9.29C6.19896 9.3851 6.12759 9.49725 6.08 9.62C5.97998 9.86346 5.97998 10.1365 6.08 10.38C6.12759 10.5028 6.19896 10.6149 6.29 10.71L9.29 13.71C9.4783 13.8983 9.7337 14.0041 10 14.0041C10.2663 14.0041 10.5217 13.8983 10.71 13.71C10.8983 13.5217 11.0041 13.2663 11.0041 13C11.0041 12.7337 10.8983 12.4783 10.71 12.29L9.41 11H13C13.2652 11 13.5196 10.8946 13.7071 10.7071C13.8946 10.5196 14 10.2652 14 10C14 9.73478 13.8946 9.48043 13.7071 9.29289C13.5196 9.10536 13.2652 9 13 9H9.41L10.71 7.71C10.8037 7.61704 10.8781 7.50644 10.9289 7.38458C10.9797 7.26272 11.0058 7.13201 11.0058 7C11.0058 6.86799 10.9797 6.73728 10.9289 6.61542C10.8781 6.49356 10.8037 6.38296 10.71 6.29C10.617 6.19627 10.5064 6.12188 10.3846 6.07111C10.2627 6.02034 10.132 5.9942 10 5.9942C9.86799 5.9942 9.73728 6.02034 9.61542 6.07111C9.49356 6.12188 9.38296 6.19627 9.29 6.29L6.29 9.29ZM0 10C0 11.9778 0.58649 13.9112 1.6853 15.5557C2.78412 17.2002 4.3459 18.4819 6.17317 19.2388C8.00043 19.9957 10.0111 20.1937 11.9509 19.8079C13.8907 19.422 15.6725 18.4696 17.0711 17.0711C18.4696 15.6725 19.422 13.8907 19.8079 11.9509C20.1937 10.0111 19.9957 8.00043 19.2388 6.17317C18.4819 4.3459 17.2002 2.78412 15.5557 1.6853C13.9112 0.58649 11.9778 0 10 0C8.68678 0 7.38642 0.258658 6.17317 0.761205C4.95991 1.26375 3.85752 2.00035 2.92893 2.92893C1.05357 4.8043 0 7.34784 0 10ZM18 10C18 11.5823 17.5308 13.129 16.6518 14.4446C15.7727 15.7602 14.5233 16.7855 13.0615 17.391C11.5997 17.9965 9.99113 18.155 8.43928 17.8463C6.88743 17.5376 5.46197 16.7757 4.34315 15.6569C3.22433 14.538 2.4624 13.1126 2.15372 11.5607C1.84504 10.0089 2.00346 8.40034 2.60896 6.93853C3.21447 5.47672 4.23984 4.22729 5.55544 3.34824C6.87103 2.46919 8.41775 2 10 2C12.1217 2 14.1566 2.84285 15.6569 4.34315C17.1571 5.84344 18 7.87827 18 10Z" , fill: "#070B12", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 232}})
17406
+ , React$1.createElement('svg', { width: "20", height: "20", viewBox: "0 0 20 20" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 255}}
17407
+ , React$1.createElement('path', { d: "M6.29 9.29C6.19896 9.3851 6.12759 9.49725 6.08 9.62C5.97998 9.86346 5.97998 10.1365 6.08 10.38C6.12759 10.5028 6.19896 10.6149 6.29 10.71L9.29 13.71C9.4783 13.8983 9.7337 14.0041 10 14.0041C10.2663 14.0041 10.5217 13.8983 10.71 13.71C10.8983 13.5217 11.0041 13.2663 11.0041 13C11.0041 12.7337 10.8983 12.4783 10.71 12.29L9.41 11H13C13.2652 11 13.5196 10.8946 13.7071 10.7071C13.8946 10.5196 14 10.2652 14 10C14 9.73478 13.8946 9.48043 13.7071 9.29289C13.5196 9.10536 13.2652 9 13 9H9.41L10.71 7.71C10.8037 7.61704 10.8781 7.50644 10.9289 7.38458C10.9797 7.26272 11.0058 7.13201 11.0058 7C11.0058 6.86799 10.9797 6.73728 10.9289 6.61542C10.8781 6.49356 10.8037 6.38296 10.71 6.29C10.617 6.19627 10.5064 6.12188 10.3846 6.07111C10.2627 6.02034 10.132 5.9942 10 5.9942C9.86799 5.9942 9.73728 6.02034 9.61542 6.07111C9.49356 6.12188 9.38296 6.19627 9.29 6.29L6.29 9.29ZM0 10C0 11.9778 0.58649 13.9112 1.6853 15.5557C2.78412 17.2002 4.3459 18.4819 6.17317 19.2388C8.00043 19.9957 10.0111 20.1937 11.9509 19.8079C13.8907 19.422 15.6725 18.4696 17.0711 17.0711C18.4696 15.6725 19.422 13.8907 19.8079 11.9509C20.1937 10.0111 19.9957 8.00043 19.2388 6.17317C18.4819 4.3459 17.2002 2.78412 15.5557 1.6853C13.9112 0.58649 11.9778 0 10 0C8.68678 0 7.38642 0.258658 6.17317 0.761205C4.95991 1.26375 3.85752 2.00035 2.92893 2.92893C1.05357 4.8043 0 7.34784 0 10ZM18 10C18 11.5823 17.5308 13.129 16.6518 14.4446C15.7727 15.7602 14.5233 16.7855 13.0615 17.391C11.5997 17.9965 9.99113 18.155 8.43928 17.8463C6.88743 17.5376 5.46197 16.7757 4.34315 15.6569C3.22433 14.538 2.4624 13.1126 2.15372 11.5607C1.84504 10.0089 2.00346 8.40034 2.60896 6.93853C3.21447 5.47672 4.23984 4.22729 5.55544 3.34824C6.87103 2.46919 8.41775 2 10 2C12.1217 2 14.1566 2.84285 15.6569 4.34315C17.1571 5.84344 18 7.87827 18 10Z" , fill: "#070B12", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 256}})
17364
17408
  )
17365
17409
  )
17366
17410
 
17367
17411
  , calendarView &&
17368
- React$1.createElement('button', { type: "button", onClick: handlePreviousMonth, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 237}}
17412
+ React$1.createElement('button', { type: "button", onClick: handlePreviousMonth, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 261}}
17369
17413
  /*left angle*/
17370
- , React$1.createElement('svg', { width: "8", height: "12", viewBox: "0 0 8 12" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 239}}
17371
- , React$1.createElement('path', { d: "M3.28982 5.99995L6.82982 2.45995C7.01607 2.27259 7.12061 2.01913 7.12061 1.75495C7.12061 1.49076 7.01607 1.23731 6.82982 1.04995C6.73686 0.95622 6.62626 0.881826 6.5044 0.831057C6.38254 0.780288 6.25183 0.75415 6.11982 0.75415C5.98781 0.75415 5.8571 0.780288 5.73524 0.831057C5.61339 0.881826 5.50278 0.95622 5.40982 1.04995L1.16982 5.28995C1.07609 5.38291 1.0017 5.49351 0.950931 5.61537C0.900162 5.73723 0.874023 5.86794 0.874023 5.99995C0.874023 6.13196 0.900162 6.26267 0.950931 6.38453C1.0017 6.50638 1.07609 6.61699 1.16982 6.70995L5.40982 10.9999C5.50326 11.0926 5.61408 11.166 5.73592 11.2157C5.85775 11.2655 5.98821 11.2907 6.11982 11.2899C6.25143 11.2907 6.38189 11.2655 6.50373 11.2157C6.62557 11.166 6.73638 11.0926 6.82982 10.9999C7.01607 10.8126 7.12061 10.5591 7.12061 10.2949C7.12061 10.0308 7.01607 9.77731 6.82982 9.58995L3.28982 5.99995Z" , fill: "#070B12", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 240}})
17414
+ , React$1.createElement('svg', { width: "8", height: "12", viewBox: "0 0 8 12" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 263}}
17415
+ , React$1.createElement('path', { d: "M3.28982 5.99995L6.82982 2.45995C7.01607 2.27259 7.12061 2.01913 7.12061 1.75495C7.12061 1.49076 7.01607 1.23731 6.82982 1.04995C6.73686 0.95622 6.62626 0.881826 6.5044 0.831057C6.38254 0.780288 6.25183 0.75415 6.11982 0.75415C5.98781 0.75415 5.8571 0.780288 5.73524 0.831057C5.61339 0.881826 5.50278 0.95622 5.40982 1.04995L1.16982 5.28995C1.07609 5.38291 1.0017 5.49351 0.950931 5.61537C0.900162 5.73723 0.874023 5.86794 0.874023 5.99995C0.874023 6.13196 0.900162 6.26267 0.950931 6.38453C1.0017 6.50638 1.07609 6.61699 1.16982 6.70995L5.40982 10.9999C5.50326 11.0926 5.61408 11.166 5.73592 11.2157C5.85775 11.2655 5.98821 11.2907 6.11982 11.2899C6.25143 11.2907 6.38189 11.2655 6.50373 11.2157C6.62557 11.166 6.73638 11.0926 6.82982 10.9999C7.01607 10.8126 7.12061 10.5591 7.12061 10.2949C7.12061 10.0308 7.01607 9.77731 6.82982 9.58995L3.28982 5.99995Z" , fill: "#070B12", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 264}})
17372
17416
  )
17373
17417
  )
17374
17418
 
17375
- , React$1.createElement('button', { type: "button", className: "month-year", onClick: toggleYearPicker, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 244}}
17419
+ , React$1.createElement('button', { type: "button", className: "month-year", onClick: toggleYearPicker, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 268}}
17376
17420
  , currentDate.toLocaleString('en-us', { month: 'long', year: 'numeric' })
17377
- , React$1.createElement('svg', { className: calendarView ? 'year-view' : '', width: "12", height: "8", viewBox: "0 0 12 8" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 246}}
17378
- , React$1.createElement('path', { d: "M11 1.17C10.8126 0.983753 10.5592 0.879211 10.295 0.879211C10.0308 0.879211 9.77737 0.983753 9.59001 1.17L6.00001 4.71L2.46001 1.17C2.27265 0.983753 2.0192 0.879211 1.75501 0.879211C1.49082 0.879211 1.23737 0.983753 1.05001 1.17C0.956281 1.26297 0.881887 1.37357 0.831118 1.49543C0.780349 1.61729 0.754211 1.74799 0.754211 1.88C0.754211 2.01202 0.780349 2.14272 0.831118 2.26458C0.881887 2.38644 0.956281 2.49704 1.05001 2.59L5.29001 6.83C5.38297 6.92373 5.49357 6.99813 5.61543 7.04889C5.73729 7.09966 5.868 7.1258 6.00001 7.1258C6.13202 7.1258 6.26273 7.09966 6.38459 7.04889C6.50645 6.99813 6.61705 6.92373 6.71001 6.83L11 2.59C11.0937 2.49704 11.1681 2.38644 11.2189 2.26458C11.2697 2.14272 11.2958 2.01202 11.2958 1.88C11.2958 1.74799 11.2697 1.61729 11.2189 1.49543C11.1681 1.37357 11.0937 1.26297 11 1.17Z" , fill: "#070B12", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 247}})
17421
+ , React$1.createElement('svg', { className: calendarView ? 'year-view' : '', width: "12", height: "8", viewBox: "0 0 12 8" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 270}}
17422
+ , React$1.createElement('path', { d: "M11 1.17C10.8126 0.983753 10.5592 0.879211 10.295 0.879211C10.0308 0.879211 9.77737 0.983753 9.59001 1.17L6.00001 4.71L2.46001 1.17C2.27265 0.983753 2.0192 0.879211 1.75501 0.879211C1.49082 0.879211 1.23737 0.983753 1.05001 1.17C0.956281 1.26297 0.881887 1.37357 0.831118 1.49543C0.780349 1.61729 0.754211 1.74799 0.754211 1.88C0.754211 2.01202 0.780349 2.14272 0.831118 2.26458C0.881887 2.38644 0.956281 2.49704 1.05001 2.59L5.29001 6.83C5.38297 6.92373 5.49357 6.99813 5.61543 7.04889C5.73729 7.09966 5.868 7.1258 6.00001 7.1258C6.13202 7.1258 6.26273 7.09966 6.38459 7.04889C6.50645 6.99813 6.61705 6.92373 6.71001 6.83L11 2.59C11.0937 2.49704 11.1681 2.38644 11.2189 2.26458C11.2697 2.14272 11.2958 2.01202 11.2958 1.88C11.2958 1.74799 11.2697 1.61729 11.2189 1.49543C11.1681 1.37357 11.0937 1.26297 11 1.17Z" , fill: "#070B12", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 271}})
17379
17423
  )
17380
17424
  )
17381
17425
  , calendarView &&
17382
- React$1.createElement('button', { type: "button", onClick: handleNextMonth, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 251}}
17426
+ React$1.createElement('button', { type: "button", onClick: handleNextMonth, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 275}}
17383
17427
  /*right angle*/
17384
- , React$1.createElement('svg', { width: "8", height: "12", viewBox: "0 0 8 12" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 253}}
17385
- , React$1.createElement('path', { d: "M6.83019 5.28995L2.59019 1.04995C2.49722 0.95622 2.38662 0.881826 2.26476 0.831057C2.1429 0.780288 2.0122 0.75415 1.88019 0.75415C1.74818 0.75415 1.61747 0.780288 1.49561 0.831057C1.37375 0.881826 1.26315 0.95622 1.17019 1.04995C0.983936 1.23731 0.879395 1.49076 0.879395 1.75495C0.879395 2.01913 0.983936 2.27259 1.17019 2.45995L4.71019 5.99995L1.17019 9.53995C0.983936 9.72731 0.879395 9.98076 0.879395 10.2449C0.879395 10.5091 0.983936 10.7626 1.17019 10.9499C1.26363 11.0426 1.37444 11.116 1.49628 11.1657C1.61812 11.2155 1.74858 11.2407 1.88019 11.2399C2.01179 11.2407 2.14226 11.2155 2.26409 11.1657C2.38593 11.116 2.49675 11.0426 2.59019 10.9499L6.83019 6.70995C6.92392 6.61699 6.99831 6.50638 7.04908 6.38453C7.09985 6.26267 7.12599 6.13196 7.12599 5.99995C7.12599 5.86794 7.09985 5.73723 7.04908 5.61537C6.99831 5.49351 6.92392 5.38291 6.83019 5.28995Z" , fill: "#070B12", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 254}})
17428
+ , React$1.createElement('svg', { width: "8", height: "12", viewBox: "0 0 8 12" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 277}}
17429
+ , React$1.createElement('path', { d: "M6.83019 5.28995L2.59019 1.04995C2.49722 0.95622 2.38662 0.881826 2.26476 0.831057C2.1429 0.780288 2.0122 0.75415 1.88019 0.75415C1.74818 0.75415 1.61747 0.780288 1.49561 0.831057C1.37375 0.881826 1.26315 0.95622 1.17019 1.04995C0.983936 1.23731 0.879395 1.49076 0.879395 1.75495C0.879395 2.01913 0.983936 2.27259 1.17019 2.45995L4.71019 5.99995L1.17019 9.53995C0.983936 9.72731 0.879395 9.98076 0.879395 10.2449C0.879395 10.5091 0.983936 10.7626 1.17019 10.9499C1.26363 11.0426 1.37444 11.116 1.49628 11.1657C1.61812 11.2155 1.74858 11.2407 1.88019 11.2399C2.01179 11.2407 2.14226 11.2155 2.26409 11.1657C2.38593 11.116 2.49675 11.0426 2.59019 10.9499L6.83019 6.70995C6.92392 6.61699 6.99831 6.50638 7.04908 6.38453C7.09985 6.26267 7.12599 6.13196 7.12599 5.99995C7.12599 5.86794 7.09985 5.73723 7.04908 5.61537C6.99831 5.49351 6.92392 5.38291 6.83019 5.28995Z" , fill: "#070B12", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 278}})
17386
17430
  )
17387
17431
  )
17388
17432
 
17389
17433
  , !calendarView &&
17390
- React$1.createElement('button', { type: "button", onClick: handleNextYear, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 259}}
17434
+ React$1.createElement('button', { type: "button", onClick: handleNextYear, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 283}}
17391
17435
  /*circle arrow right*/
17392
- , React$1.createElement('svg', { width: "20", height: "20", viewBox: "0 0 20 20" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 261}}
17393
- , React$1.createElement('path', { d: "M13.71 10.71C13.801 10.6149 13.8724 10.5028 13.92 10.38C14.02 10.1365 14.02 9.86347 13.92 9.62C13.8724 9.49725 13.801 9.38511 13.71 9.29L10.71 6.29C10.5217 6.1017 10.2663 5.99591 10 5.99591C9.7337 5.99591 9.47831 6.1017 9.29 6.29C9.1017 6.47831 8.99591 6.7337 8.99591 7C8.99591 7.26631 9.1017 7.5217 9.29 7.71L10.59 9H7C6.73479 9 6.48043 9.10536 6.2929 9.2929C6.10536 9.48043 6 9.73479 6 10C6 10.2652 6.10536 10.5196 6.2929 10.7071C6.48043 10.8946 6.73479 11 7 11H10.59L9.29 12.29C9.19628 12.383 9.12188 12.4936 9.07111 12.6154C9.02034 12.7373 8.99421 12.868 8.99421 13C8.99421 13.132 9.02034 13.2627 9.07111 13.3846C9.12188 13.5064 9.19628 13.617 9.29 13.71C9.38297 13.8037 9.49357 13.8781 9.61543 13.9289C9.73729 13.9797 9.86799 14.0058 10 14.0058C10.132 14.0058 10.2627 13.9797 10.3846 13.9289C10.5064 13.8781 10.617 13.8037 10.71 13.71L13.71 10.71ZM20 10C20 8.02219 19.4135 6.08879 18.3147 4.4443C17.2159 2.79981 15.6541 1.51809 13.8268 0.761209C11.9996 0.00433284 9.98891 -0.193701 8.0491 0.192152C6.10929 0.578004 4.32746 1.53041 2.92894 2.92894C1.53041 4.32746 0.578004 6.10929 0.192152 8.0491C-0.193701 9.98891 0.00433284 11.9996 0.761209 13.8268C1.51809 15.6541 2.79981 17.2159 4.4443 18.3147C6.08879 19.4135 8.02219 20 10 20C12.6522 20 15.1957 18.9464 17.0711 17.0711C18.9464 15.1957 20 12.6522 20 10ZM2 10C2 8.41775 2.4692 6.87104 3.34825 5.55544C4.2273 4.23985 5.47673 3.21447 6.93854 2.60897C8.40035 2.00347 10.0089 1.84504 11.5607 2.15372C13.1126 2.4624 14.538 3.22433 15.6569 4.34315C16.7757 5.46197 17.5376 6.88743 17.8463 8.43928C18.155 9.99113 17.9965 11.5997 17.391 13.0615C16.7855 14.5233 15.7602 15.7727 14.4446 16.6518C13.129 17.5308 11.5823 18 10 18C7.87827 18 5.84344 17.1572 4.34315 15.6569C2.84286 14.1566 2 12.1217 2 10Z" , fill: "#070B12", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 262}})
17436
+ , React$1.createElement('svg', { width: "20", height: "20", viewBox: "0 0 20 20" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 285}}
17437
+ , React$1.createElement('path', { d: "M13.71 10.71C13.801 10.6149 13.8724 10.5028 13.92 10.38C14.02 10.1365 14.02 9.86347 13.92 9.62C13.8724 9.49725 13.801 9.38511 13.71 9.29L10.71 6.29C10.5217 6.1017 10.2663 5.99591 10 5.99591C9.7337 5.99591 9.47831 6.1017 9.29 6.29C9.1017 6.47831 8.99591 6.7337 8.99591 7C8.99591 7.26631 9.1017 7.5217 9.29 7.71L10.59 9H7C6.73479 9 6.48043 9.10536 6.2929 9.2929C6.10536 9.48043 6 9.73479 6 10C6 10.2652 6.10536 10.5196 6.2929 10.7071C6.48043 10.8946 6.73479 11 7 11H10.59L9.29 12.29C9.19628 12.383 9.12188 12.4936 9.07111 12.6154C9.02034 12.7373 8.99421 12.868 8.99421 13C8.99421 13.132 9.02034 13.2627 9.07111 13.3846C9.12188 13.5064 9.19628 13.617 9.29 13.71C9.38297 13.8037 9.49357 13.8781 9.61543 13.9289C9.73729 13.9797 9.86799 14.0058 10 14.0058C10.132 14.0058 10.2627 13.9797 10.3846 13.9289C10.5064 13.8781 10.617 13.8037 10.71 13.71L13.71 10.71ZM20 10C20 8.02219 19.4135 6.08879 18.3147 4.4443C17.2159 2.79981 15.6541 1.51809 13.8268 0.761209C11.9996 0.00433284 9.98891 -0.193701 8.0491 0.192152C6.10929 0.578004 4.32746 1.53041 2.92894 2.92894C1.53041 4.32746 0.578004 6.10929 0.192152 8.0491C-0.193701 9.98891 0.00433284 11.9996 0.761209 13.8268C1.51809 15.6541 2.79981 17.2159 4.4443 18.3147C6.08879 19.4135 8.02219 20 10 20C12.6522 20 15.1957 18.9464 17.0711 17.0711C18.9464 15.1957 20 12.6522 20 10ZM2 10C2 8.41775 2.4692 6.87104 3.34825 5.55544C4.2273 4.23985 5.47673 3.21447 6.93854 2.60897C8.40035 2.00347 10.0089 1.84504 11.5607 2.15372C13.1126 2.4624 14.538 3.22433 15.6569 4.34315C16.7757 5.46197 17.5376 6.88743 17.8463 8.43928C18.155 9.99113 17.9965 11.5997 17.391 13.0615C16.7855 14.5233 15.7602 15.7727 14.4446 16.6518C13.129 17.5308 11.5823 18 10 18C7.87827 18 5.84344 17.1572 4.34315 15.6569C2.84286 14.1566 2 12.1217 2 10Z" , fill: "#070B12", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 286}})
17394
17438
  )
17395
17439
  )
17396
17440
 
17397
17441
  )
17398
17442
  /*calendar view*/
17399
- , React$1.createElement('div', { style: {display: calendarView ? 'block ' : 'none'}, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 268}}
17400
- , React$1.createElement('div', { className: "weekdays", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 269}}
17443
+ , React$1.createElement('div', { style: {display: calendarView ? 'block ' : 'none'}, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 292}}
17444
+ , React$1.createElement('div', { className: "weekdays", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 293}}
17401
17445
  , daysOfWeek.map((day) => (
17402
- React$1.createElement('div', { key: day, className: "weekday", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 271}}
17446
+ React$1.createElement('div', { key: day, className: "weekday", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 295}}
17403
17447
  , day
17404
17448
  )
17405
17449
  ))
17406
17450
  )
17407
- , React$1.createElement('div', { className: "days", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 276}}, renderCalendar())
17451
+ , React$1.createElement('div', { className: "days", __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 300}}, renderCalendar())
17408
17452
  )
17409
17453
 
17410
17454
  /*year picker*/
17411
- , React$1.createElement('div', { style: {display: !calendarView ? 'block' : 'none'}, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 280}}
17455
+ , React$1.createElement('div', { style: {display: !calendarView ? 'block' : 'none'}, __self: undefined, __source: {fileName: _jsxFileName$L, lineNumber: 304}}
17412
17456
  , renderYearPicker(currentYear)
17413
17457
  )
17414
17458
  )
@@ -17423,7 +17467,7 @@ const DateRangePickerComp = styled.div`
17423
17467
  }
17424
17468
  `;
17425
17469
 
17426
- const InputLabel$3 = styled.div`
17470
+ const InputLabel$5 = styled.div`
17427
17471
  display: flex;
17428
17472
  flex-direction: column;
17429
17473
  gap: 4px;
@@ -17954,7 +17998,7 @@ const DateRangePicker = ({ selectedDateRange,label,subtext ,placeholder,showActi
17954
17998
  React$1.createElement(DateRangePickerComp, { className: "datepicker-comp", __self: undefined, __source: {fileName: _jsxFileName$K, lineNumber: 270}}
17955
17999
  , React$1.createElement('div', { className: "input-field", __self: undefined, __source: {fileName: _jsxFileName$K, lineNumber: 271}}
17956
18000
  , label &&
17957
- React$1.createElement(InputLabel$3, {__self: undefined, __source: {fileName: _jsxFileName$K, lineNumber: 273}}
18001
+ React$1.createElement(InputLabel$5, {__self: undefined, __source: {fileName: _jsxFileName$K, lineNumber: 273}}
17958
18002
  , React$1.createElement('label', {__self: undefined, __source: {fileName: _jsxFileName$K, lineNumber: 274}}, label)
17959
18003
  , subtext && React$1.createElement('span', {__self: undefined, __source: {fileName: _jsxFileName$K, lineNumber: 275}}, subtext)
17960
18004
  )
@@ -18091,20 +18135,23 @@ const DisplayField = (props) => {
18091
18135
  )
18092
18136
  };
18093
18137
 
18094
- const FieldContainer = styled.div`
18138
+ const InputLabel$4 = styled.div`
18139
+ label{
18140
+ color: ${theme.colors["neutral-900"]};
18141
+ }
18142
+ `;
18143
+
18144
+ const FieldContainer$1 = styled.div`
18095
18145
  display: flex;
18096
18146
  flex-direction: column;
18097
- gap: 16px;
18147
+ gap: 12px;
18098
18148
  //width: 430px;
18099
- `;
18100
-
18101
- const LabelContainer = styled.div`
18102
- font-weight: 500;
18103
- font-size: 16px;
18104
- line-height: 19px;
18105
- label{
18106
- font-family: "Circular Book Medium",sans-serif;
18107
- font-weight: 500;
18149
+ .err-msg{
18150
+ color:${theme.colors["error-500"]};
18151
+ display: flex;
18152
+ gap: 8px;
18153
+ justify-content: start;
18154
+ align-items: center;
18108
18155
  }
18109
18156
  `;
18110
18157
 
@@ -18155,7 +18202,25 @@ const DropdownField = styled.div`
18155
18202
  border: 1px solid ${theme.colors["primary-500"]};
18156
18203
  }
18157
18204
  .placeholder{
18158
- color:${theme.colors["neutral-200"]};
18205
+ color:${theme.colors["neutral-400"]};
18206
+ }
18207
+ .sr-only{
18208
+ position: absolute;
18209
+ width: 1px;
18210
+ left: 0;
18211
+ bottom: 0;
18212
+ height: 1px;
18213
+ margin: -1px;
18214
+ overflow: hidden;
18215
+ clip: rect(0, 0, 0, 0);
18216
+ white-space: nowrap;
18217
+ border: 0;
18218
+ }
18219
+ &.error{
18220
+ border: 1px solid ${theme.colors["error-500"]} !important;
18221
+ }
18222
+ &.success{
18223
+ border: 1px solid ${theme.colors["success-500"]} !important;
18159
18224
  }
18160
18225
  `;
18161
18226
 
@@ -18245,14 +18310,21 @@ const _jsxFileName$I = "D:\\SSX\\Project\\Component Library\\sscomp\\src\\compon
18245
18310
  * Dropdown component for selecting from a list of options
18246
18311
  */
18247
18312
  const DropdownList = (props) => {
18248
- const {options,returnedSelection,initialText,disabled,label,placeholder,searchable,width} = props;
18313
+ let {options,returnedSelection,initialText,disabled,label,placeholder,searchable,width,required} = props;
18249
18314
  const [opened,setOpened] = React$1.useState(false);
18250
18315
  const [passedOption,setPassedOption] = React$1.useState({});
18251
18316
  const [err,setErr] = React$1.useState(false);
18252
18317
  const [optionsOri,setOptionsOri] = React$1.useState([]);
18253
18318
  const [optionsRec,setOptionsRec] = React$1.useState([]);
18254
18319
  const [qryStr,setQryStr] = React$1.useState('');
18320
+ const [initText,setInitText] = React$1.useState('');
18255
18321
  const buttonRef = React$1.useRef();
18322
+ const [srVal,setSrVal] = React$1.useState('');
18323
+ const [selStatus,setSelStatus] = React$1.useState('');
18324
+
18325
+ React$1.useEffect(()=>{
18326
+ if (initialText) setInitText(initialText);
18327
+ },[initialText]);
18256
18328
 
18257
18329
  React$1.useEffect(()=>{
18258
18330
  document.addEventListener('keyup',function(e){
@@ -18278,92 +18350,117 @@ const DropdownList = (props) => {
18278
18350
  }
18279
18351
 
18280
18352
  return (
18281
- React$1.createElement(FieldContainer, { style: {width:width ? width : '100%'}, __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 43}}
18282
- , !disabled &&
18283
- React$1.createElement(React$1.Fragment, null
18284
- , label &&
18285
- React$1.createElement(LabelContainer, {__self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 47}}
18286
- , React$1.createElement('label', { className: "paragraph2Medium", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 48}}, label)
18287
- )
18353
+ React$1.createElement(FieldContainer$1, { style: {width:width ? width : '100%'}, __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 58}}
18354
+ , !disabled &&
18355
+ React$1.createElement(React$1.Fragment, null
18356
+ , label &&
18357
+ React$1.createElement(InputLabel$4, {__self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 62}}
18358
+ , React$1.createElement('label', { className: "paragraph2Medium", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 63}}, label)
18359
+ )
18360
+
18361
+ , React$1.createElement(DropdownField, { className: selStatus, style: {borderColor:passedOption.value ? theme.colors["success-500"] : theme.colors["neutral-200"]}, __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 66}}
18362
+ , React$1.createElement('input', { className: "sr-only", value: srVal, required: required, onChange: ()=>{}, onInvalid: ()=>{setSelStatus('error');}, __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 67}})
18363
+ , React$1.createElement('button', { ref: buttonRef, type: "button", className: `dropdown-field ${err ? 'error' : ''}`, onBlur: ()=>{
18364
+ if (!searchable){
18365
+ setTimeout(()=>{
18366
+ setOpened(false);
18367
+ },200);
18368
+ }
18369
+ if (required) {
18370
+ setSelStatus(!srVal ? 'error' : 'success');
18371
+ }else {
18372
+ setSelStatus(srVal ? 'success' : '');
18373
+ }
18374
+ }, onMouseUp: ()=>{
18375
+ if (opened){
18376
+ setTimeout(()=>{
18377
+ setOpened(false);
18378
+ },100);
18379
+ }else {
18380
+ setOpened(true);
18381
+ }
18382
+ }, __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 68}}
18383
+ )
18384
+ , searchable && opened &&
18385
+ React$1.createElement('input', { type: "text", value: qryStr, onChange: (e)=>{filterList(e.target.value);}, className: `dropdown-field search-field ${err ? 'error' : ''}`, onFocus: ()=>{setOpened(true);}, onBlur: ()=>{
18386
+ setTimeout(()=>{
18387
+ setOpened(false);
18388
+ },200);
18389
+ }, __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 90}})
18288
18390
 
18289
- , React$1.createElement(DropdownField, { style: {borderColor:passedOption.value ? theme.colors["success-500"] : theme.colors["neutral-200"]}, __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 51}}
18290
- , React$1.createElement('button', { ref: buttonRef, type: "button", className: `dropdown-field ${err ? 'error' : ''}`, onBlur: ()=>{
18291
- if (!searchable){
18292
- setTimeout(()=>{
18293
- setOpened(false);
18294
- },200);
18295
- }
18296
- }, onMouseUp: ()=>{
18297
- if (opened){
18298
- setTimeout(()=>{
18299
- setOpened(false);
18300
- },100);
18301
- }else {
18302
- setOpened(true);
18303
- }
18304
- }, __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 52}}
18391
+ , React$1.createElement('div', { style: {overflowX:'hidden'}, __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 96}}
18392
+ /*<span className="paragraph2Regular">{initialText}</span>*/
18393
+ /*{!passedOption.label &&
18394
+ <>*/
18395
+ , React$1.createElement('span', { className: "paragraph2Regular", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 100}}, initText)
18396
+ , !initText &&
18397
+ React$1.createElement(React$1.Fragment, null
18398
+ , placeholder && React$1.createElement('span', { className: "paragraph2Regular placeholder" , __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 103}}, placeholder)
18399
+ )
18400
+
18401
+ /*</>
18402
+ }*/
18403
+ )
18404
+ , React$1.createElement(DropdownIcon, { className: `dropdown-icon ${opened ? 'expanded' : 'collapsed'}`, onMouseUp: ()=>{
18405
+ if (!opened){
18406
+ buttonRef.current.focus();
18407
+ setOpened(true);
18408
+ }
18409
+ }, __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 109}}
18410
+ , React$1.createElement('svg', { width: "12", height: "8", viewBox: "0 0 12 8" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 115}}
18411
+ , React$1.createElement('path', { d: "M10.9999 1.17C10.8126 0.983753 10.5591 0.879211 10.2949 0.879211C10.0308 0.879211 9.77731 0.983753 9.58995 1.17L5.99995 4.71L2.45995 1.17C2.27259 0.983753 2.01913 0.879211 1.75495 0.879211C1.49076 0.879211 1.23731 0.983753 1.04995 1.17C0.95622 1.26297 0.881826 1.37357 0.831057 1.49543C0.780288 1.61729 0.75415 1.74799 0.75415 1.88C0.75415 2.01202 0.780288 2.14272 0.831057 2.26458C0.881826 2.38644 0.95622 2.49704 1.04995 2.59L5.28995 6.83C5.38291 6.92373 5.49351 6.99813 5.61537 7.04889C5.73723 7.09966 5.86794 7.1258 5.99995 7.1258C6.13196 7.1258 6.26267 7.09966 6.38453 7.04889C6.50638 6.99813 6.61699 6.92373 6.70995 6.83L10.9999 2.59C11.0937 2.49704 11.1681 2.38644 11.2188 2.26458C11.2696 2.14272 11.2957 2.01202 11.2957 1.88C11.2957 1.74799 11.2696 1.61729 11.2188 1.49543C11.1681 1.37357 11.0937 1.26297 10.9999 1.17Z" , fill: "#070B12", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 116}})
18305
18412
  )
18306
- , searchable && opened &&
18307
- React$1.createElement('input', { type: "text", value: qryStr, onChange: (e)=>{filterList(e.target.value);}, className: `dropdown-field search-field ${err ? 'error' : ''}`, onFocus: ()=>{setOpened(true);}, onBlur: ()=>{
18308
- setTimeout(()=>{
18309
- setOpened(false);
18310
- },200);
18311
- }, __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 69}})
18312
-
18313
- , React$1.createElement('div', { style: {overflowX:'hidden'}, __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 75}}
18314
- , React$1.createElement('span', { className: "paragraph2Regular", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 76}}, passedOption.label)
18315
- , !passedOption.label &&
18316
- React$1.createElement(React$1.Fragment, null
18317
- , React$1.createElement('span', { className: "paragraph2Regular", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 79}}, initialText)
18318
- , !initialText &&
18319
- React$1.createElement(React$1.Fragment, null
18320
- , placeholder && React$1.createElement('span', { className: "paragraph2Regular placeholder" , __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 82}}, placeholder)
18321
- )
18322
-
18413
+ )
18414
+ , opened &&
18415
+ React$1.createElement(React$1.Fragment, null
18416
+ , options && options.length > 0 &&
18417
+ React$1.createElement(OptionsList, {__self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 122}}
18418
+ , optionsRec.map((option, index) => (
18419
+ React$1.createElement(DropdownOption, { key: index, onClick: ()=>{
18420
+ // setPassedOption(option)
18421
+ setInitText(option.label);
18422
+ setSrVal(option.value);
18423
+ returnedSelection(option);
18424
+ }, onMouseDown: ()=>{
18425
+ setTimeout(()=>{
18426
+ // setPassedOption(option)
18427
+ setInitText(option.label);
18428
+ returnedSelection(option);
18429
+ },200);
18430
+ setSrVal(option.value);
18431
+ }, __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 124}}, React$1.createElement('span', { className: "paragraph2Regular", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 136}}, option.label))
18432
+ ))
18323
18433
  )
18324
18434
 
18325
- )
18326
- , React$1.createElement(DropdownIcon, { className: `dropdown-icon ${opened ? 'expanded' : 'collapsed'}`, onMouseUp: ()=>{
18327
- if (!opened){
18328
- buttonRef.current.focus();
18329
- setOpened(true);
18330
- }
18331
- }, __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 88}}
18332
- , React$1.createElement('svg', { width: "12", height: "8", viewBox: "0 0 12 8" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 94}}
18333
- , React$1.createElement('path', { d: "M10.9999 1.17C10.8126 0.983753 10.5591 0.879211 10.2949 0.879211C10.0308 0.879211 9.77731 0.983753 9.58995 1.17L5.99995 4.71L2.45995 1.17C2.27259 0.983753 2.01913 0.879211 1.75495 0.879211C1.49076 0.879211 1.23731 0.983753 1.04995 1.17C0.95622 1.26297 0.881826 1.37357 0.831057 1.49543C0.780288 1.61729 0.75415 1.74799 0.75415 1.88C0.75415 2.01202 0.780288 2.14272 0.831057 2.26458C0.881826 2.38644 0.95622 2.49704 1.04995 2.59L5.28995 6.83C5.38291 6.92373 5.49351 6.99813 5.61537 7.04889C5.73723 7.09966 5.86794 7.1258 5.99995 7.1258C6.13196 7.1258 6.26267 7.09966 6.38453 7.04889C6.50638 6.99813 6.61699 6.92373 6.70995 6.83L10.9999 2.59C11.0937 2.49704 11.1681 2.38644 11.2188 2.26458C11.2696 2.14272 11.2957 2.01202 11.2957 1.88C11.2957 1.74799 11.2696 1.61729 11.2188 1.49543C11.1681 1.37357 11.0937 1.26297 10.9999 1.17Z" , fill: "#070B12", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 95}})
18435
+ )
18436
+
18437
+ )
18438
+ , selStatus === 'error' &&
18439
+ React$1.createElement('div', { className: "err-msg", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 144}}
18440
+ , React$1.createElement('svg', { width: "16", height: "16", viewBox: "0 0 16 16" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 145}}
18441
+ , React$1.createElement('g', { clipPath: "url(#clip0_299_2778)", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 146}}
18442
+ , React$1.createElement('path', { d: "M8.00006 10.6667C7.86821 10.6667 7.73931 10.7058 7.62968 10.779C7.52005 10.8523 7.4346 10.9564 7.38414 11.0782C7.33368 11.2 7.32048 11.3341 7.3462 11.4634C7.37193 11.5927 7.43542 11.7115 7.52866 11.8048C7.62189 11.898 7.74068 11.9615 7.87 11.9872C7.99932 12.0129 8.13336 11.9997 8.25518 11.9493C8.377 11.8988 8.48112 11.8134 8.55437 11.7037C8.62763 11.5941 8.66673 11.4652 8.66673 11.3334C8.66673 11.1565 8.59649 10.987 8.47146 10.8619C8.34644 10.7369 8.17687 10.6667 8.00006 10.6667ZM15.1134 11.6467L9.74673 2.31335C9.57326 2.00236 9.31992 1.74332 9.01285 1.563C8.70579 1.38267 8.35615 1.2876 8.00006 1.2876C7.64396 1.2876 7.29433 1.38267 6.98726 1.563C6.6802 1.74332 6.42686 2.00236 6.25339 2.31335L0.92006 11.6467C0.74059 11.9494 0.644155 12.294 0.640489 12.6459C0.636824 12.9978 0.726058 13.3444 0.899184 13.6507C1.07231 13.9571 1.3232 14.2123 1.62652 14.3907C1.92984 14.5691 2.27485 14.6643 2.62673 14.6667H13.3734C13.7281 14.6702 14.0773 14.5793 14.3853 14.4033C14.6933 14.2273 14.949 13.9726 15.126 13.6652C15.3031 13.3579 15.3953 13.009 15.3931 12.6542C15.3908 12.2995 15.2943 11.9518 15.1134 11.6467ZM13.9601 12.98C13.9016 13.084 13.8164 13.1704 13.7132 13.2302C13.61 13.29 13.4927 13.321 13.3734 13.32H2.62673C2.50747 13.321 2.39013 13.29 2.28694 13.2302C2.18375 13.1704 2.0985 13.084 2.04006 12.98C1.98155 12.8787 1.95074 12.7637 1.95074 12.6467C1.95074 12.5297 1.98155 12.4147 2.04006 12.3134L7.37339 2.98002C7.42934 2.87082 7.51433 2.77917 7.61902 2.71518C7.72371 2.65119 7.84403 2.61733 7.96673 2.61733C8.08942 2.61733 8.20974 2.65119 8.31443 2.71518C8.41912 2.77917 8.50411 2.87082 8.56006 2.98002L13.9267 12.3134C13.9929 12.4132 14.0309 12.5291 14.0367 12.6488C14.0426 12.7684 14.0161 12.8875 13.9601 12.9934V12.98ZM8.00006 5.33335C7.82325 5.33335 7.65368 5.40359 7.52866 5.52861C7.40363 5.65364 7.33339 5.82321 7.33339 6.00002V8.66669C7.33339 8.8435 7.40363 9.01307 7.52866 9.13809C7.65368 9.26311 7.82325 9.33335 8.00006 9.33335C8.17687 9.33335 8.34644 9.26311 8.47146 9.13809C8.59649 9.01307 8.66673 8.8435 8.66673 8.66669V6.00002C8.66673 5.82321 8.59649 5.65364 8.47146 5.52861C8.34644 5.40359 8.17687 5.33335 8.00006 5.33335Z" , fill: "#F80000", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 147}})
18443
+ )
18444
+ , React$1.createElement('defs', {__self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 149}}
18445
+ , React$1.createElement('clipPath', { id: "clip0_299_2778", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 150}}
18446
+ , React$1.createElement('rect', { width: "16", height: "16", fill: "white", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 151}})
18447
+ )
18334
18448
  )
18335
18449
  )
18336
- , opened &&
18337
- React$1.createElement(React$1.Fragment, null
18338
- , options && options.length > 0 &&
18339
- React$1.createElement(OptionsList, {__self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 101}}
18340
- , optionsRec.map((option, index) => (
18341
- React$1.createElement(DropdownOption, { key: index, onClick: ()=>{
18342
- setPassedOption(option);
18343
- returnedSelection(option);
18344
- }, onMouseDown: ()=>{
18345
- setTimeout(()=>{
18346
- setPassedOption(option);
18347
- returnedSelection(option);
18348
- },200);
18349
- }, __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 103}}, React$1.createElement('span', { className: "paragraph2Regular", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 111}}, option.label))
18350
- ))
18351
- )
18352
-
18353
- )
18354
-
18355
- )
18356
- )
18357
-
18358
- , disabled &&
18359
- React$1.createElement(DisabledContainer, {__self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 121}}
18360
- , initialText
18361
- , React$1.createElement('svg', { width: "24", height: "24", viewBox: "0 0 24 24" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 123}}
18362
- , React$1.createElement('path', { d: "M16.9999 9.16994C16.8126 8.98369 16.5591 8.87915 16.2949 8.87915C16.0308 8.87915 15.7773 8.98369 15.5899 9.16994L11.9999 12.7099L8.45995 9.16994C8.27259 8.98369 8.01913 8.87915 7.75495 8.87915C7.49076 8.87915 7.23731 8.98369 7.04995 9.16994C6.95622 9.26291 6.88183 9.37351 6.83106 9.49537C6.78029 9.61723 6.75415 9.74793 6.75415 9.87994C6.75415 10.012 6.78029 10.1427 6.83106 10.2645C6.88183 10.3864 6.95622 10.497 7.04995 10.5899L11.2899 14.8299C11.3829 14.9237 11.4935 14.9981 11.6154 15.0488C11.7372 15.0996 11.8679 15.1257 11.9999 15.1257C12.132 15.1257 12.2627 15.0996 12.3845 15.0488C12.5064 14.9981 12.617 14.9237 12.7099 14.8299L16.9999 10.5899C17.0937 10.497 17.1681 10.3864 17.2188 10.2645C17.2696 10.1427 17.2957 10.012 17.2957 9.87994C17.2957 9.74793 17.2696 9.61723 17.2188 9.49537C17.1681 9.37351 17.0937 9.26291 16.9999 9.16994Z" , fill: "#E8EEF7", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 124}})
18363
- )
18364
- )
18365
-
18366
- )
18450
+ , React$1.createElement('span', {__self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 155}}, "This field is required" )
18451
+ )
18452
+
18453
+ )
18454
+
18455
+ , disabled &&
18456
+ React$1.createElement(DisabledContainer, {__self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 161}}
18457
+ , initText
18458
+ , React$1.createElement('svg', { width: "24", height: "24", viewBox: "0 0 24 24" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 163}}
18459
+ , React$1.createElement('path', { d: "M16.9999 9.16994C16.8126 8.98369 16.5591 8.87915 16.2949 8.87915C16.0308 8.87915 15.7773 8.98369 15.5899 9.16994L11.9999 12.7099L8.45995 9.16994C8.27259 8.98369 8.01913 8.87915 7.75495 8.87915C7.49076 8.87915 7.23731 8.98369 7.04995 9.16994C6.95622 9.26291 6.88183 9.37351 6.83106 9.49537C6.78029 9.61723 6.75415 9.74793 6.75415 9.87994C6.75415 10.012 6.78029 10.1427 6.83106 10.2645C6.88183 10.3864 6.95622 10.497 7.04995 10.5899L11.2899 14.8299C11.3829 14.9237 11.4935 14.9981 11.6154 15.0488C11.7372 15.0996 11.8679 15.1257 11.9999 15.1257C12.132 15.1257 12.2627 15.0996 12.3845 15.0488C12.5064 14.9981 12.617 14.9237 12.7099 14.8299L16.9999 10.5899C17.0937 10.497 17.1681 10.3864 17.2188 10.2645C17.2696 10.1427 17.2957 10.012 17.2957 9.87994C17.2957 9.74793 17.2696 9.61723 17.2188 9.49537C17.1681 9.37351 17.0937 9.26291 16.9999 9.16994Z" , fill: "#E8EEF7", __self: undefined, __source: {fileName: _jsxFileName$I, lineNumber: 164}})
18460
+ )
18461
+ )
18462
+
18463
+ )
18367
18464
  )
18368
18465
  };
18369
18466
 
@@ -18413,22 +18510,36 @@ const _jsxFileName$H = "D:\\SSX\\Project\\Component Library\\sscomp\\src\\compon
18413
18510
  */
18414
18511
  const ExchangeRates = (props) => {
18415
18512
  const {baseCurr,baseCurrShortName,source,lastUpdated,exchangeCurrs} = props;
18513
+
18514
+ function nameToSymbol(currName){
18515
+ switch (currName){
18516
+ case 'USD':
18517
+ return '$'
18518
+ case 'EUR':
18519
+ return '€'
18520
+ case 'GBP':
18521
+ return '£'
18522
+ default:
18523
+ return currName
18524
+ }
18525
+ }
18526
+
18416
18527
  return (
18417
18528
  React$1.createElement(React$1.Fragment, null
18418
18529
  , exchangeCurrs && exchangeCurrs.length > 0 &&
18419
- React$1.createElement(RateContainer$1, {__self: undefined, __source: {fileName: _jsxFileName$H, lineNumber: 14}}
18420
- , React$1.createElement('div', { style: {marginBottom:16}, __self: undefined, __source: {fileName: _jsxFileName$H, lineNumber: 15}}
18421
- , React$1.createElement(CurrencyName, { className: "heading6SMedium", __self: undefined, __source: {fileName: _jsxFileName$H, lineNumber: 16}}, baseCurr, " (" , baseCurrShortName, ")")
18530
+ React$1.createElement(RateContainer$1, {__self: undefined, __source: {fileName: _jsxFileName$H, lineNumber: 28}}
18531
+ , React$1.createElement('div', { style: {marginBottom:16}, __self: undefined, __source: {fileName: _jsxFileName$H, lineNumber: 29}}
18532
+ , React$1.createElement(CurrencyName, { className: "heading6SMedium", __self: undefined, __source: {fileName: _jsxFileName$H, lineNumber: 30}}, baseCurr, " (" , baseCurrShortName, ")")
18422
18533
  )
18423
- , React$1.createElement(Rates$1, {__self: undefined, __source: {fileName: _jsxFileName$H, lineNumber: 18}}
18534
+ , React$1.createElement(Rates$1, {__self: undefined, __source: {fileName: _jsxFileName$H, lineNumber: 32}}
18424
18535
  , exchangeCurrs.map((exchCurr,index)=>(
18425
- React$1.createElement('div', { key: index, className: "exchange-currency", __self: undefined, __source: {fileName: _jsxFileName$H, lineNumber: 20}}
18426
- , React$1.createElement('img', { src: exchCurr.currFlag, alt: "", __self: undefined, __source: {fileName: _jsxFileName$H, lineNumber: 21}})
18427
- , React$1.createElement('span', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName$H, lineNumber: 22}}, exchCurr.currName, " 1 = " , exchCurr.rate)
18536
+ React$1.createElement('div', { key: index, className: "exchange-currency", __self: undefined, __source: {fileName: _jsxFileName$H, lineNumber: 34}}
18537
+ , React$1.createElement('img', { src: exchCurr.currFlag, alt: "", __self: undefined, __source: {fileName: _jsxFileName$H, lineNumber: 35}})
18538
+ , React$1.createElement('span', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName$H, lineNumber: 36}}, nameToSymbol(exchCurr.currName), "1 = " , exchCurr.rate)
18428
18539
  )
18429
18540
  ))
18430
18541
  )
18431
- , React$1.createElement('p', { className: "last-updated", __self: undefined, __source: {fileName: _jsxFileName$H, lineNumber: 26}}, "Last updated on " , lastUpdated, " | Source: " , source)
18542
+ , React$1.createElement('p', { className: "last-updated", __self: undefined, __source: {fileName: _jsxFileName$H, lineNumber: 40}}, "Last updated on " , lastUpdated, " | Source: " , source)
18432
18543
  )
18433
18544
 
18434
18545
  )
@@ -18436,93 +18547,225 @@ const ExchangeRates = (props) => {
18436
18547
  };
18437
18548
 
18438
18549
  const FooterContainer = styled.div`
18439
- position: relative;
18440
- background: ${theme.colors["primary-900"]};
18441
- color: ${theme.colors["neutral-50"]};
18442
- margin: 0;
18443
- `;
18444
-
18445
- const FooterArea = styled.div`
18446
- padding: 80px 134px;
18447
- display: flex;
18448
- gap: 120px;
18449
- `;
18450
-
18451
- const AboutSSX = styled.div`
18452
- width: 720px;
18453
- p{
18454
- font-size: 16px;
18455
- font-weight: 500;
18456
- font-family: Circular Book Medium, sans-serif;
18457
- line-height: 19px;
18458
- margin: 0;
18550
+ background: ${theme.colors["neutral-900"]};
18551
+ color: #ffffff;
18552
+ div.info-section{
18553
+ display: grid;
18554
+ grid-template-columns: 1.5fr 3fr 1.5fr;
18555
+ justify-content: center;
18556
+ gap: 200px;
18557
+ padding-block: 80px;
18558
+ padding-inline: 134px;
18459
18559
  }
18460
- img{
18560
+ @media (max-width:834px){
18561
+ div.info-section{
18562
+ display: flex;
18563
+ flex-direction: column;
18564
+ gap: 40px;
18565
+ padding-inline: 16px;
18566
+ padding-block: 24px;
18567
+ }
18568
+ }
18569
+
18570
+ .col{
18571
+ width: 270px;
18572
+ display: flex;
18573
+ flex-direction: column;
18574
+ gap: 16px;
18575
+ }
18576
+
18577
+ .col:nth-child(2){
18578
+ width: 100%;
18579
+ }
18580
+
18581
+ .logo{
18461
18582
  width: 204px;
18462
18583
  }
18463
- `;
18464
-
18465
- const SSXInfo = styled.div`
18466
- width:250px;
18467
- h6{
18468
- font-size: 19px;
18469
- font-weight: bold;
18470
- line-height: 23px;
18471
- letter-spacing: -0.02em;
18472
- text-transform: capitalize;
18584
+
18585
+ .useful-links ul{
18586
+ list-style-type: none;
18473
18587
  margin: 0;
18588
+ padding: 0;
18474
18589
  display: flex;
18475
- align-items: center;
18476
- gap: 9px;
18590
+ flex-direction: column;
18591
+ gap: 16px;
18477
18592
  }
18478
- p{
18479
- font-size: 16px;
18480
- font-weight: 400;
18481
- line-height: 20px;
18482
- font-style: normal;
18593
+ a{
18594
+ text-decoration: none;
18595
+ color: #ffffff;
18483
18596
  }
18484
- `;
18485
18597
 
18486
- const CopyrightArea = styled.div`
18487
- padding: 24px 134px;
18488
- border-top: 1px solid ${theme.colors["neutral-600"]};
18489
- `;
18598
+ .address-col{
18599
+ display: flex;
18600
+ flex-direction: column;
18601
+ gap: 16px;
18602
+ width: 250px;
18603
+ }
18604
+
18605
+ .address-col p{
18606
+ display: flex;
18607
+ }
18608
+
18609
+ .address-cols{
18610
+ display: flex;
18611
+ justify-content: start;
18612
+ gap: 40px;
18613
+ width: 100%;
18614
+ }
18490
18615
 
18491
- const CopyrightText = styled.p`
18492
- font-size: 14px;
18493
- font-weight: 400;
18494
- line-height: 17px;
18616
+ @media (max-width:834px){
18617
+ .address-cols{
18618
+ flex-direction: column;
18619
+ gap: 16px;
18620
+ }
18621
+ }
18622
+
18623
+ div.copyright-section{
18624
+ padding-block: 24px;
18625
+ padding-inline: 134px;
18626
+ border-top: 1px solid ${theme.colors["neutral-600"]};
18627
+ }
18628
+ div.copyright-section p{
18629
+ padding: 8px;
18630
+ }
18631
+
18632
+ @media (max-width:834px){
18633
+ div.copyright-section{
18634
+ padding-inline: 16px;
18635
+ padding-block: 24px;
18636
+ }
18637
+ }
18495
18638
  `;
18496
18639
 
18497
- const _jsxFileName$G = "D:\\SSX\\Project\\Component Library\\sscomp\\src\\components\\Footer\\Footer.tsx";
18498
- const Footer = () => {
18640
+ const _jsxFileName$G = "D:\\SSX\\Project\\Component Library\\sscomp\\src\\components\\FooterNew\\FooterNew.tsx";
18641
+ const FooterNew = () => {
18499
18642
  return (
18500
18643
  React$1.createElement(FooterContainer, {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 6}}
18501
- , React$1.createElement(FooterArea, {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 7}}
18502
- , React$1.createElement(AboutSSX, {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 8}}
18503
- /*<img style={{marginBottom:'16px'}} src={SSXLogo} alt="SSX Logo"/>*/
18504
- , React$1.createElement('img', {
18505
- src: "https://res.cloudinary.com/dxivfczqg/image/upload/v1643889560/ssx-linear-logo-light_mdafbc.png",
18506
- alt: "SSX Logo" , __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 10}})
18507
- , React$1.createElement('p', { style: {width:'270px'}, __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 13}}, "A platform you can trust to deliver the latest capital trading news and trends across Africa." )
18644
+ , React$1.createElement('div', { className: "info-section", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 7}}
18645
+ , React$1.createElement('div', { className: "col", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 8}}
18646
+ , React$1.createElement('div', { className: "logo", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 9}}
18647
+ , React$1.createElement('img', { src: "https://res.cloudinary.com/dxivfczqg/image/upload/w_204/v1643889560/ssx-linear-logo-light_mdafbc.webp", alt: "logo", loading: "lazy", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 10}})
18648
+ )
18649
+ , React$1.createElement('p', { className: "paragraph2Medium", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 12}}, "A platform you can trust to deliver the latest capital trading news and trends across Africa." )
18508
18650
  )
18509
- , React$1.createElement(SSXInfo, {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 15}}
18510
- , React$1.createElement('h6', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 16}}, "Contact Us" )
18511
- , React$1.createElement('p', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 17}}, "222 Swaniker Street" , React$1.createElement('br', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 17}}), "Abelemkpe - Accra"
18512
- , React$1.createElement('br', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 18}}), "+233 (0) 59 284 1131"
18513
- , React$1.createElement('br', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 19}}), "questions@secondstax.info"
18651
+ , React$1.createElement('div', { className: "col", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 14}}
18652
+ , React$1.createElement('h6', { className: "heading6Bold", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 15}}, "Addresses")
18653
+ , React$1.createElement('div', { className: "address-cols", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 16}}
18654
+ , React$1.createElement('div', { className: "address-col", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 17}}
18655
+ , React$1.createElement('div', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 18}}
18656
+ , React$1.createElement('p', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 19}}
18657
+ , React$1.createElement('svg', { style: {marginRight:8}, width: "21", height: "15", viewBox: "0 0 21 15" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 20}}
18658
+ , React$1.createElement('g', { clipPath: "url(#clip0_1323_4145)", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 21}}
18659
+ , React$1.createElement('rect', { width: "21", height: "15", rx: "3", fill: "#FFDA2C", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 22}})
18660
+ , React$1.createElement('path', { fillRule: "evenodd", clipRule: "evenodd", d: "M0 10H21V15H0V10Z" , fill: "#249F58", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 23}})
18661
+ , React$1.createElement('path', { fillRule: "evenodd", clipRule: "evenodd", d: "M10.5 8.75L9.03001 9.523L9.31001 7.886L8.12201 6.726L9.76501 6.489L10.5 5L11.235 6.49L12.878 6.727L11.688 7.887L11.968 9.523" , fill: "#151515", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 24}})
18662
+ , React$1.createElement('path', { fillRule: "evenodd", clipRule: "evenodd", d: "M0 0H21V5H0V0Z" , fill: "#F93939", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 25}})
18663
+ )
18664
+ , React$1.createElement('defs', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 27}}
18665
+ , React$1.createElement('clipPath', { id: "clip0_1323_4145", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 28}}
18666
+ , React$1.createElement('rect', { width: "21", height: "15", rx: "3", fill: "white", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 29}})
18667
+ )
18668
+ )
18669
+ ), "SecondSTAX Limited GH"
18670
+
18671
+ )
18672
+ , React$1.createElement('p', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 35}}
18673
+ , React$1.createElement('a', { href: "https://goo.gl/maps/Vacg6uLP5XNjPwiRA", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 36}}, "Aquatec Place, 222 Swaniker Street"
18674
+ , React$1.createElement('br', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 37}}), "Abelemkpe - Accra,"
18675
+ , React$1.createElement('br', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 38}}), "Ghana"
18676
+
18677
+ )
18678
+ )
18679
+ )
18680
+ , React$1.createElement('div', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 43}}
18681
+ , React$1.createElement('p', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 44}}
18682
+ , React$1.createElement('svg', { style: {marginRight:8}, width: "21", height: "15", viewBox: "0 0 21 15" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 45}}
18683
+ , React$1.createElement('g', { clipPath: "url(#clip0_1323_4150)", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 46}}
18684
+ , React$1.createElement('rect', { width: "21", height: "15", rx: "3", fill: "white", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 47}})
18685
+ , React$1.createElement('path', { fillRule: "evenodd", clipRule: "evenodd", d: "M0 0H7V15H0V0ZM14 0H21V15H14V0Z" , fill: "#0A6A30", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 48}})
18686
+ )
18687
+ , React$1.createElement('defs', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 50}}
18688
+ , React$1.createElement('clipPath', { id: "clip0_1323_4150", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 51}}
18689
+ , React$1.createElement('rect', { width: "21", height: "15", rx: "3", fill: "white", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 52}})
18690
+ )
18691
+ )
18692
+ ), "SecondSTAX Limited NG"
18693
+
18694
+ )
18695
+ , React$1.createElement('p', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 58}}
18696
+ , React$1.createElement('a', { href: "https://goo.gl/maps/EZhPzxEatSkLWZu68", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 59}}, "Suite 401, 4th Floor, Kano House" , React$1.createElement('br', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 59}}), "Plot No. 73 Ralph Shodeinde Street"
18697
+ , React$1.createElement('br', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 60}}), "Central Business District, F.C.T., Abuja"
18698
+
18699
+ )
18700
+ )
18701
+ )
18702
+ )
18703
+ , React$1.createElement('div', { className: "address-col", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 66}}
18704
+ , React$1.createElement('div', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 67}}
18705
+ , React$1.createElement('p', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 68}}
18706
+ , React$1.createElement('svg', { style: {marginRight:8}, width: "21", height: "15", viewBox: "0 0 21 15" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 69}}
18707
+ , React$1.createElement('g', { clipPath: "url(#clip0_1323_4156)", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 70}}
18708
+ , React$1.createElement('rect', { width: "21", height: "15", rx: "3", fill: "white", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 71}})
18709
+ , React$1.createElement('path', { fillRule: "evenodd", clipRule: "evenodd", d: "M0 0H9V7H0V0Z" , fill: "#1A47B8", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 72}})
18710
+ , React$1.createElement('path', { fillRule: "evenodd", clipRule: "evenodd", d: "M9 0V1H21V0H9ZM9 2V3H21V2H9ZM9 4V5H21V4H9ZM9 6V7H21V6H9ZM0 8V9H21V8H0ZM0 10V11H21V10H0ZM0 12V13H21V12H0ZM0 14V15H21V14H0Z" , fill: "#F93939", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 73}})
18711
+ , React$1.createElement('path', { fillRule: "evenodd", clipRule: "evenodd", d: "M1 1V2H2V1H1ZM3 1V2H4V1H3ZM5 1V2H6V1H5ZM7 1V2H8V1H7ZM6 2V3H7V2H6ZM4 2V3H5V2H4ZM2 2V3H3V2H2ZM1 3V4H2V3H1ZM3 3V4H4V3H3ZM5 3V4H6V3H5ZM7 3V4H8V3H7ZM1 5V6H2V5H1ZM3 5V6H4V5H3ZM5 5V6H6V5H5ZM7 5V6H8V5H7ZM6 4V5H7V4H6ZM4 4V5H5V4H4ZM2 4V5H3V4H2Z" , fill: "white", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 74}})
18712
+ )
18713
+ , React$1.createElement('defs', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 76}}
18714
+ , React$1.createElement('clipPath', { id: "clip0_1323_4156", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 77}}
18715
+ , React$1.createElement('rect', { width: "21", height: "15", rx: "3", fill: "white", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 78}})
18716
+ )
18717
+ )
18718
+ ), "SecondSTAX Inc US"
18719
+
18720
+ )
18721
+ , React$1.createElement('p', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 84}}
18722
+ , React$1.createElement('a', { href: "https://goo.gl/maps/bG53adurzNuf7fb3A", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 85}}, "251 Little Falls Drive" , React$1.createElement('br', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 85}}), "Wilmington, DE 19808,"
18723
+ , React$1.createElement('br', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 86}}), "US"
18724
+ )
18725
+ )
18726
+ )
18727
+ , React$1.createElement('div', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 90}}
18728
+ , React$1.createElement('p', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 91}}
18729
+ , React$1.createElement('svg', { style: {marginRight:8}, width: "21", height: "15", viewBox: "0 0 21 15" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 92}}
18730
+ , React$1.createElement('rect', { width: "21", height: "15", rx: "3", fill: "#151515", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 93}})
18731
+ , React$1.createElement('path', { fillRule: "evenodd", clipRule: "evenodd", d: "M0 11H21V15H0V11Z" , fill: "#0A6A30", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 94}})
18732
+ , React$1.createElement('path', { fillRule: "evenodd", clipRule: "evenodd", d: "M0 10H21V11H0V10Z" , fill: "white", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 95}})
18733
+ , React$1.createElement('path', { fillRule: "evenodd", clipRule: "evenodd", d: "M0 5H21V10H0V5Z" , fill: "#F93939", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 96}})
18734
+ , React$1.createElement('path', { fillRule: "evenodd", clipRule: "evenodd", d: "M0 4H21V5H0V4Z" , fill: "white", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 97}})
18735
+ , React$1.createElement('path', { fillRule: "evenodd", clipRule: "evenodd", d: "M12.414 5.914C12.486 5.914 12.914 5.244 12.914 4.414C12.914 3.586 12.486 2.914 12.414 2.914C12.344 2.914 11.914 3.586 11.914 4.414C11.914 5.244 12.344 5.914 12.414 5.914ZM9.47499 5.475C9.42499 5.525 8.64499 5.355 8.06099 4.768C7.47599 4.182 7.30399 3.404 7.35499 3.354C7.40499 3.304 8.18299 3.474 8.76899 4.061C9.35499 4.647 9.52599 5.425 9.47599 5.476L9.47499 5.475ZM11.354 10.008C11.404 9.961 12.184 10.121 12.769 10.668C13.354 11.218 13.526 11.945 13.476 11.992C13.426 12.039 12.646 11.879 12.06 11.332C11.475 10.782 11.303 10.055 11.354 10.008ZM9.47499 10.008C9.42499 9.961 8.64499 10.121 8.06099 10.668C7.47599 11.218 7.30399 11.945 7.35499 11.992C7.40499 12.039 8.18299 11.879 8.76899 11.332C9.35499 10.782 9.52599 10.055 9.47599 10.008H9.47499Z" , fill: "white", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 98}})
18736
+ , React$1.createElement('path', { fillRule: "evenodd", clipRule: "evenodd", d: "M10.5 12C10.857 12 13 9.985 13 7.5C13 5.015 10.857 3 10.5 3C10.143 3 8 5.015 8 7.5C8 9.985 10.143 12 10.5 12Z" , fill: "#F93939", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 99}})
18737
+ , React$1.createElement('path', { fillRule: "evenodd", clipRule: "evenodd", d: "M8.5 9C8.57 9 9 8.328 9 7.5C9 6.672 8.57 6 8.5 6C8.43 6 8 6.672 8 7.5C8 8.328 8.43 9 8.5 9ZM12.5 9C12.57 9 13 8.328 13 7.5C13 6.672 12.57 6 12.5 6C12.43 6 12 6.672 12 7.5C12 8.328 12.43 9 12.5 9Z" , fill: "#151515", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 100}})
18738
+ , React$1.createElement('path', { d: "M11 7.5C11 6.67157 10.7761 6 10.5 6C10.2239 6 10 6.67157 10 7.5C10 8.32843 10.2239 9 10.5 9C10.7761 9 11 8.32843 11 7.5Z" , fill: "white", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 101}})
18739
+ ), "SecondSTAX Limited KE"
18740
+
18741
+ )
18742
+ , React$1.createElement('p', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 105}}
18743
+ , React$1.createElement('a', { href: "https://goo.gl/maps/XUxGqmJ47uah92Sk8", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 106}}, "Riverside Park ICEA" , React$1.createElement('br', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 106}}), "Waiyaki Way, 2nd Floor, West Wing"
18744
+ , React$1.createElement('br', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 107}}), "P. O. Box 101650 - 00101"
18745
+ , React$1.createElement('br', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 108}}), "Nairobi - Kenya"
18746
+
18747
+ )
18748
+ )
18749
+ )
18514
18750
  )
18751
+ )
18515
18752
  )
18516
- , React$1.createElement(SSXInfo, {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 22}}
18517
- , React$1.createElement('h6', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 23}}, React$1.createElement('svg', { width: "14", height: "15", viewBox: "0 0 14 15" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 23}}
18518
- , React$1.createElement('path', { d: "M7.00001 0.833336C5.68147 0.833336 4.39254 1.22433 3.29621 1.95687C2.19988 2.68941 1.3454 3.73061 0.840816 4.94878C0.336232 6.16695 0.20421 7.5074 0.461445 8.8006C0.718679 10.0938 1.35362 11.2817 2.28597 12.214C3.21832 13.1464 4.4062 13.7813 5.69941 14.0386C6.99262 14.2958 8.33306 14.1638 9.55124 13.6592C10.7694 13.1546 11.8106 12.3001 12.5431 11.2038C13.2757 10.1075 13.6667 8.81854 13.6667 7.5C13.6647 5.7325 12.9617 4.03795 11.7119 2.78813C10.4621 1.53831 8.76752 0.835302 7.00001 0.833336ZM7.00001 12.8333C5.94518 12.8333 4.91403 12.5205 4.03697 11.9345C3.15991 11.3485 2.47632 10.5155 2.07266 9.54098C1.66899 8.56644 1.56337 7.49409 1.76916 6.45952C1.97495 5.42496 2.4829 4.47465 3.22878 3.72877C3.97466 2.98289 4.92497 2.47494 5.95953 2.26915C6.9941 2.06336 8.06645 2.16898 9.04099 2.57265C10.0155 2.97631 10.8485 3.6599 11.4345 4.53696C12.0206 5.41402 12.3333 6.44517 12.3333 7.5C12.3317 8.91399 11.7693 10.2696 10.7695 11.2695C9.76962 12.2693 8.41401 12.8317 7.00001 12.8333ZM7.00001 7.16667C6.8232 7.16667 6.65363 7.23691 6.52861 7.36193C6.40358 7.48696 6.33335 7.65652 6.33335 7.83334V9.83333C6.33335 10.0101 6.40358 10.1797 6.52861 10.3047C6.65363 10.4298 6.8232 10.5 7.00001 10.5C7.17682 10.5 7.34639 10.4298 7.47142 10.3047C7.59644 10.1797 7.66668 10.0101 7.66668 9.83333V7.83334C7.66668 7.65652 7.59644 7.48696 7.47142 7.36193C7.34639 7.23691 7.17682 7.16667 7.00001 7.16667ZM7.00001 4.5C6.8352 4.5 6.67408 4.54888 6.53704 4.64044C6.4 4.73201 6.29319 4.86216 6.23011 5.01443C6.16704 5.1667 6.15054 5.33426 6.18269 5.49591C6.21485 5.65756 6.29421 5.80605 6.41076 5.92259C6.5273 6.03913 6.67579 6.1185 6.83744 6.15066C6.99909 6.18281 7.16664 6.16631 7.31892 6.10323C7.47119 6.04016 7.60134 5.93335 7.6929 5.79631C7.78447 5.65927 7.83335 5.49815 7.83335 5.33334C7.83335 5.11232 7.74555 4.90036 7.58927 4.74408C7.43299 4.5878 7.22103 4.5 7.00001 4.5Z" , fill: "#F7F9FC", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 24}})
18519
- ), "Important Note"
18520
- )
18521
- , React$1.createElement('p', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 27}}, "SecondSTAX does not own rights to some of the content displayed on this website. All content is sourced directly from the outlet." )
18753
+ , React$1.createElement('div', { className: "col", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 116}}
18754
+ , React$1.createElement('h6', { className: "heading6Bold", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 117}}, "Useful Links" )
18755
+ , React$1.createElement('div', { className: "useful-links", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 118}}
18756
+ , React$1.createElement('ul', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 119}}
18757
+ , React$1.createElement('li', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 120}}, React$1.createElement('a', { href: "https://secondstax.com/about-us/", className: "paragraph2Regular", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 120}}, "About Us" ))
18758
+ , React$1.createElement('li', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 121}}, React$1.createElement('a', { href: "https://secondstax.com/careers/", className: "paragraph2Regular", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 121}}, "Careers"))
18759
+ , React$1.createElement('li', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 122}}, React$1.createElement('a', { href: "https://secondstax.com/contact-us/", className: "paragraph2Regular", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 122}}, "Contact"))
18760
+ , React$1.createElement('li', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 123}}, React$1.createElement('a', { href: "https://secondstax.com/press/", className: "paragraph2Regular", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 123}}, "Press Releases" ))
18761
+ , React$1.createElement('li', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 124}}, React$1.createElement('a', { href: "https://secondstax.com/privacy-policy/", className: "paragraph2Regular", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 124}}, "Privacy Policy" ))
18762
+ , React$1.createElement('li', {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 125}}, React$1.createElement('a', { href: "https://secondstax.com/terms-conditions/", className: "paragraph2Regular", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 125}}, "Terms & Conditions" ))
18763
+ )
18764
+ )
18522
18765
  )
18523
18766
  )
18524
- , React$1.createElement(CopyrightArea, {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 30}}
18525
- , React$1.createElement(CopyrightText, {__self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 31}}, "©", new Date().getFullYear(), " SecondSTAX Ltd. All Rights Reserved." )
18767
+ , React$1.createElement('div', { className: "copyright-section", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 130}}
18768
+ , React$1.createElement('p', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName$G, lineNumber: 131}}, "©", new Date().getFullYear(), " SecondSTAX Ltd. All Rights Reserved." )
18526
18769
  )
18527
18770
  )
18528
18771
  )
@@ -18795,7 +19038,7 @@ const NothingContent$5 = styled.div`
18795
19038
  }
18796
19039
  `;
18797
19040
 
18798
- function moneyfy$2(number, currency){
19041
+ function moneyfy$3(number, currency){
18799
19042
  const numberFormat = new Intl.NumberFormat('en-US', {
18800
19043
  style:'currency',
18801
19044
  currency:currency,
@@ -18911,14 +19154,14 @@ const LPRequestTable = (props) => {
18911
19154
  , React$1.createElement('div', { className: "txn-amt", __self: undefined, __source: {fileName: _jsxFileName$D, lineNumber: 110}}
18912
19155
  , React$1.createElement('span', { className: "amt", __self: undefined, __source: {fileName: _jsxFileName$D, lineNumber: 111}}
18913
19156
  , transaction.baseCurrFlag &&React$1.createElement('img', { src: transaction.baseCurrFlag, alt: "base flag" , __self: undefined, __source: {fileName: _jsxFileName$D, lineNumber: 112}})
18914
- , moneyfy$2(transaction.baseAmount,transaction.baseCurrency)
19157
+ , moneyfy$3(transaction.baseAmount,transaction.baseCurrency)
18915
19158
  )
18916
19159
  , React$1.createElement('svg', { width: "24", height: "24", viewBox: "0 0 24 24" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$D, lineNumber: 115}}
18917
19160
  , React$1.createElement('path', { d: "M17.9982 10.0002C17.9982 9.73497 17.8928 9.48062 17.7053 9.29308C17.5178 9.10554 17.2634 9.00019 16.9982 9.00019H5.40819L7.70819 6.71019C7.89649 6.52188 8.00228 6.26649 8.00228 6.00019C8.00228 5.73388 7.89649 5.47849 7.70819 5.29019C7.51988 5.10188 7.26449 4.99609 6.99819 4.99609C6.73188 4.99609 6.47649 5.10188 6.28819 5.29019L2.28819 9.29019C2.14943 9.43081 2.05543 9.60938 2.01806 9.80337C1.98068 9.99736 2.00161 10.1981 2.07819 10.3802C2.15321 10.5628 2.2806 10.7191 2.44432 10.8295C2.60804 10.9398 2.80076 10.9992 2.99819 11.0002H16.9982C17.2634 11.0002 17.5178 10.8948 17.7053 10.7073C17.8928 10.5198 17.9982 10.2654 17.9982 10.0002ZM21.9182 13.6202C21.8432 13.4376 21.7158 13.2812 21.552 13.1709C21.3883 13.0606 21.1956 13.0012 20.9982 13.0002H6.99819C6.73297 13.0002 6.47862 13.1055 6.29108 13.2931C6.10354 13.4806 5.99819 13.735 5.99819 14.0002C5.99819 14.2654 6.10354 14.5198 6.29108 14.7073C6.47862 14.8948 6.73297 15.0002 6.99819 15.0002H18.5882L16.2882 17.2902C16.1945 17.3831 16.1201 17.4937 16.0693 17.6156C16.0185 17.7375 15.9924 17.8682 15.9924 18.0002C15.9924 18.1322 16.0185 18.2629 16.0693 18.3848C16.1201 18.5066 16.1945 18.6172 16.2882 18.7102C16.3812 18.8039 16.4917 18.8783 16.6136 18.9291C16.7355 18.9798 16.8662 19.006 16.9982 19.006C17.1302 19.006 17.2609 18.9798 17.3828 18.9291C17.5046 18.8783 17.6152 18.8039 17.7082 18.7102L21.7082 14.7102C21.8469 14.5696 21.9409 14.391 21.9783 14.197C22.0157 14.003 21.9948 13.8023 21.9182 13.6202Z" , fill: "#BBCCE6", __self: undefined, __source: {fileName: _jsxFileName$D, lineNumber: 116}})
18918
19161
  )
18919
19162
  , React$1.createElement('span', { className: "amt", __self: undefined, __source: {fileName: _jsxFileName$D, lineNumber: 118}}
18920
19163
  , transaction.exchangeCurrFlag && React$1.createElement('img', { src: transaction.exchangeCurrFlag, alt: "exchange flag" , __self: undefined, __source: {fileName: _jsxFileName$D, lineNumber: 119}})
18921
- , moneyfy$2(transaction.exchangeAmount,transaction.exchangeCurrency)
19164
+ , moneyfy$3(transaction.exchangeAmount,transaction.exchangeCurrency)
18922
19165
  )
18923
19166
  )
18924
19167
  )
@@ -19824,8 +20067,22 @@ const LastUpdated$1 = styled.div`
19824
20067
  }
19825
20068
  `;
19826
20069
 
19827
- const _jsxFileName$A = "D:\\SSX\\Project\\Component Library\\sscomp\\src\\components\\MarketData\\MarketData.tsx";
20070
+ function moneyfy$2(number){
20071
+ const numberFormat = new Intl.NumberFormat('en-US', {
20072
+ minimumFractionDigits:2,
20073
+ maximumFractionDigits:2
20074
+ });
20075
+
20076
+ return numberFormat.format(number)
20077
+ }
20078
+
20079
+ function thousandSeparator(number){
20080
+ const numberFormat = new Intl.NumberFormat('en-US');
19828
20081
 
20082
+ return numberFormat.format(number)
20083
+ }
20084
+
20085
+ const _jsxFileName$A = "D:\\SSX\\Project\\Component Library\\sscomp\\src\\components\\MarketData\\MarketData.tsx";
19829
20086
  /**
19830
20087
  * Component to display cards of market data widget
19831
20088
  */
@@ -19835,28 +20092,28 @@ const MarketData = (props) => {
19835
20092
  return (
19836
20093
  React$1.createElement(React$1.Fragment, null
19837
20094
  , marketData && marketData.length > 0 &&
19838
- React$1.createElement(MarketdataWidgetContainer, {__self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 20}}
20095
+ React$1.createElement(MarketdataWidgetContainer, {__self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 21}}
19839
20096
  , marketData.map((data,index) => (
19840
- React$1.createElement(MarketDataItemContainer, { key: index, __self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 22}}
19841
- , React$1.createElement(MarketNameFlagContainer, {__self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 23}}
19842
- , React$1.createElement(EntityName, { className: "heading6SMedium", __self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 24}}, data.market)
20097
+ React$1.createElement(MarketDataItemContainer, { key: index, __self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 23}}
20098
+ , React$1.createElement(MarketNameFlagContainer, {__self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 24}}
20099
+ , React$1.createElement(EntityName, { className: "heading6SMedium", __self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 25}}, data.market)
19843
20100
  , React$1.createElement('img', { src: data.marketCountryFlag,
19844
- alt: "Country flag" , __self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 25}})
20101
+ alt: "Country flag" , __self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 26}})
19845
20102
  )
19846
- , React$1.createElement(DataContainer, {__self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 28}}
19847
- , React$1.createElement(DataInfoContainer, {__self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 29}}
19848
- , React$1.createElement(InfoItem, {__self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 30}}
19849
- , React$1.createElement('small', { className: "captionBook", __self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 31}}, "Volume")
19850
- , React$1.createElement('p', { className: "heading6SMedium", __self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 32}}, data.volume)
20103
+ , React$1.createElement(DataContainer, {__self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 29}}
20104
+ , React$1.createElement(DataInfoContainer, {__self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 30}}
20105
+ , React$1.createElement(InfoItem, {__self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 31}}
20106
+ , React$1.createElement('small', { className: "captionBook", __self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 32}}, "Volume")
20107
+ , React$1.createElement('p', { className: "heading6SMedium", __self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 33}}, thousandSeparator(data.volume))
19851
20108
  )
19852
- , React$1.createElement(InfoItem, {__self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 34}}
19853
- , React$1.createElement('small', { className: "captionBook", __self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 35}}, "Market Cap" )
19854
- , React$1.createElement('p', { className: "heading6SMedium", __self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 36}}, data.marketCap)
20109
+ , React$1.createElement(InfoItem, {__self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 35}}
20110
+ , React$1.createElement('small', { className: "captionBook", __self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 36}}, "Market Cap" )
20111
+ , React$1.createElement('p', { className: "heading6SMedium", __self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 37}}, moneyfy$2(data.marketCap))
19855
20112
  )
19856
20113
  )
19857
- , React$1.createElement(LastUpdated$1, {__self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 39}}
19858
- , React$1.createElement('p', {__self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 40}}, "Last updated:"
19859
- , React$1.createElement('br', {__self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 41}})
20114
+ , React$1.createElement(LastUpdated$1, {__self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 40}}
20115
+ , React$1.createElement('p', {__self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 41}}, "Last updated:"
20116
+ , React$1.createElement('br', {__self: undefined, __source: {fileName: _jsxFileName$A, lineNumber: 42}})
19860
20117
  , data.lastUpdated
19861
20118
  )
19862
20119
  )
@@ -20091,15 +20348,15 @@ const MarketMovers = (props) => {
20091
20348
  , React$1.createElement(DataSection, {__self: undefined, __source: {fileName: _jsxFileName$y, lineNumber: 71}}
20092
20349
  , React$1.createElement(Row, {__self: undefined, __source: {fileName: _jsxFileName$y, lineNumber: 72}}
20093
20350
  , React$1.createElement('div', { className: "entity-short-name", __self: undefined, __source: {fileName: _jsxFileName$y, lineNumber: 73}}
20094
- , React$1.createElement('p', {__self: undefined, __source: {fileName: _jsxFileName$y, lineNumber: 74}}, mover.entityShortName)
20351
+ , React$1.createElement('p', { className: "heading6SMedium", __self: undefined, __source: {fileName: _jsxFileName$y, lineNumber: 74}}, mover.entityShortName)
20095
20352
  )
20096
20353
  , React$1.createElement('div', { className: "changeRatio", __self: undefined, __source: {fileName: _jsxFileName$y, lineNumber: 76}}
20097
- , React$1.createElement('span', { className: "error", __self: undefined, __source: {fileName: _jsxFileName$y, lineNumber: 77}}, mover.changeAmount), " / " , React$1.createElement('span', { className: "error", __self: undefined, __source: {fileName: _jsxFileName$y, lineNumber: 77}}, mover.changePercent, "%")
20354
+ , React$1.createElement('span', { className: "success", __self: undefined, __source: {fileName: _jsxFileName$y, lineNumber: 77}}, mover.changeAmount), " / " , React$1.createElement('span', { className: "success", __self: undefined, __source: {fileName: _jsxFileName$y, lineNumber: 77}}, mover.changePercent, "%")
20098
20355
  )
20099
20356
  )
20100
20357
  , React$1.createElement(Row, {__self: undefined, __source: {fileName: _jsxFileName$y, lineNumber: 80}}
20101
20358
  , React$1.createElement('div', { className: "entity-long-name", __self: undefined, __source: {fileName: _jsxFileName$y, lineNumber: 81}}
20102
- , React$1.createElement('p', {__self: undefined, __source: {fileName: _jsxFileName$y, lineNumber: 82}}, mover.entityName)
20359
+ , React$1.createElement('p', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName$y, lineNumber: 82}}, mover.entityName)
20103
20360
  , React$1.createElement('img', { src: mover.marketFlag, alt: "Market flag" , __self: undefined, __source: {fileName: _jsxFileName$y, lineNumber: 83}})
20104
20361
  )
20105
20362
  , React$1.createElement('div', { className: "entity-price", __self: undefined, __source: {fileName: _jsxFileName$y, lineNumber: 85}}
@@ -20509,7 +20766,7 @@ const NewsTitleBar = (props) => {
20509
20766
  )
20510
20767
  };
20511
20768
 
20512
- const InputLabel$2 = styled.div`
20769
+ const InputLabel$3 = styled.div`
20513
20770
  display: flex;
20514
20771
  gap: 4px;
20515
20772
  flex-direction: column;
@@ -20633,7 +20890,7 @@ const PasswordField = (props) => {
20633
20890
  return (
20634
20891
  React$1.createElement('div', { style: style, __self: undefined, __source: {fileName: _jsxFileName$s, lineNumber: 39}}
20635
20892
  , label &&
20636
- React$1.createElement(InputLabel$2, {__self: undefined, __source: {fileName: _jsxFileName$s, lineNumber: 41}}
20893
+ React$1.createElement(InputLabel$3, {__self: undefined, __source: {fileName: _jsxFileName$s, lineNumber: 41}}
20637
20894
  , React$1.createElement('label', { className: disabled ? 'disabled' : '', __self: undefined, __source: {fileName: _jsxFileName$s, lineNumber: 42}}, label)
20638
20895
  , React$1.createElement('span', { className: disabled ? 'disabled' : '', __self: undefined, __source: {fileName: _jsxFileName$s, lineNumber: 43}}, subtext)
20639
20896
  )
@@ -20642,7 +20899,7 @@ const PasswordField = (props) => {
20642
20899
  , React$1.createElement(InputField$1, { type: !showPw ? 'password' : 'text', value: passString, onChange: (e)=>{
20643
20900
  // setValue(e.target.value)
20644
20901
  setPassString(e.target.value);
20645
- }, onBlur: ()=>{validate();}, disabled: disabled, ...props, required: true, placeholder: placeholder, __self: undefined, __source: {fileName: _jsxFileName$s, lineNumber: 47}})
20902
+ }, onBlur: ()=>{validate();}, disabled: disabled, ...props, required: true, placeholder: placeholder, onInvalid: validate, __self: undefined, __source: {fileName: _jsxFileName$s, lineNumber: 47}})
20646
20903
  , React$1.createElement(ToggleButton, { type: "button", onClick: ()=>{setShowPw(!showPw);}, __self: undefined, __source: {fileName: _jsxFileName$s, lineNumber: 51}}
20647
20904
  , !showPw ?
20648
20905
  //eye
@@ -21423,22 +21680,23 @@ const FormField = styled.div`
21423
21680
  }
21424
21681
  `;
21425
21682
 
21426
- const InputLabel$1 = styled.div`
21683
+ const InputLabel$2 = styled.div`
21427
21684
  display: flex;
21428
21685
  flex-direction: column;
21429
21686
  gap: 4px;
21430
21687
  label{
21431
- color:${theme.colors["primary-900"]};
21432
- font-weight: 500;
21433
- font-family: "Circular Book Medium", sans-serif;
21688
+ color: ${theme.colors["neutral-900"]};
21434
21689
  }
21435
21690
  span{
21436
21691
  color: ${theme.colors["neutral-600"]};
21437
- font-size: 14px;
21438
- line-height: 17px;
21439
- font-weight: 400;
21440
21692
  }
21441
21693
  `;
21694
+
21695
+ styled.div`
21696
+ display: flex;
21697
+ flex-direction: column;
21698
+ gap: 12px;
21699
+ `;
21442
21700
  const InputField = styled.input`
21443
21701
  border: none;
21444
21702
  left: 0;
@@ -21475,6 +21733,7 @@ const InputContainer$1 = styled.div`
21475
21733
  justify-content: space-between;
21476
21734
  overflow: hidden;
21477
21735
  transition: 300ms ease-out;
21736
+ box-sizing: border-box;
21478
21737
  &:hover{
21479
21738
  border: 1px solid ${theme.colors["primary-300"]};
21480
21739
  }
@@ -21540,13 +21799,13 @@ const TextField = (props) => {
21540
21799
  return (
21541
21800
  React$1.createElement('div', { style: style, __self: undefined, __source: {fileName: _jsxFileName$m, lineNumber: 41}}
21542
21801
  , label &&
21543
- React$1.createElement(InputLabel$1, {__self: undefined, __source: {fileName: _jsxFileName$m, lineNumber: 43}}
21544
- , React$1.createElement('label', {__self: undefined, __source: {fileName: _jsxFileName$m, lineNumber: 44}}, label)
21545
- , subtext && React$1.createElement('span', {__self: undefined, __source: {fileName: _jsxFileName$m, lineNumber: 45}}, subtext)
21802
+ React$1.createElement(InputLabel$2, {__self: undefined, __source: {fileName: _jsxFileName$m, lineNumber: 43}}
21803
+ , React$1.createElement('label', { className: "paragraph2Medium", __self: undefined, __source: {fileName: _jsxFileName$m, lineNumber: 44}}, label)
21804
+ , subtext && React$1.createElement('span', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName$m, lineNumber: 45}}, subtext)
21546
21805
  )
21547
21806
 
21548
21807
  , React$1.createElement(InputContainer$1, { className: `${borderColor} ${disabled ? 'disabled' : ''}`, style: {width:width ? width : '100%',border:disabled ? `1px solid ${theme.colors["neutral-100"]}` : ''}, __self: undefined, __source: {fileName: _jsxFileName$m, lineNumber: 48}}
21549
- , React$1.createElement(InputField, { ref: textFieldRef, onBlur: ()=>{validate();}, value: inputVal, onChange: (e)=>{setInputVal(e.target.value);}, ...props, __self: undefined, __source: {fileName: _jsxFileName$m, lineNumber: 49}})
21808
+ , React$1.createElement(InputField, { ref: textFieldRef, onBlur: validate, onInvalid: validate, value: inputVal, onChange: (e)=>{setInputVal(e.target.value);}, ...props, __self: undefined, __source: {fileName: _jsxFileName$m, lineNumber: 49}})
21550
21809
  )
21551
21810
  , !value && required && err &&
21552
21811
  React$1.createElement(ErrorMessage$1, {__self: undefined, __source: {fileName: _jsxFileName$m, lineNumber: 52}}
@@ -21554,7 +21813,7 @@ const TextField = (props) => {
21554
21813
  , React$1.createElement('svg', { width: "16", height: "14", viewBox: "0 0 16 14" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$m, lineNumber: 54}}
21555
21814
  , React$1.createElement('path', { d: "M8.00006 9.66669C7.86821 9.66669 7.73931 9.70578 7.62968 9.77904C7.52005 9.85229 7.4346 9.95641 7.38414 10.0782C7.33368 10.2 7.32048 10.3341 7.3462 10.4634C7.37193 10.5927 7.43542 10.7115 7.52866 10.8048C7.62189 10.898 7.74068 10.9615 7.87 10.9872C7.99932 11.0129 8.13336 10.9997 8.25518 10.9493C8.377 10.8988 8.48112 10.8134 8.55437 10.7037C8.62763 10.5941 8.66673 10.4652 8.66673 10.3334C8.66673 10.1565 8.59649 9.98697 8.47146 9.86195C8.34644 9.73692 8.17687 9.66669 8.00006 9.66669ZM15.1134 10.6467L9.74673 1.31335C9.57326 1.00236 9.31992 0.743323 9.01285 0.562997C8.70579 0.382672 8.35615 0.287598 8.00006 0.287598C7.64396 0.287598 7.29433 0.382672 6.98726 0.562997C6.6802 0.743323 6.42686 1.00236 6.25339 1.31335L0.92006 10.6467C0.74059 10.9494 0.644155 11.294 0.640489 11.6459C0.636824 11.9978 0.726058 12.3444 0.899184 12.6507C1.07231 12.9571 1.3232 13.2123 1.62652 13.3907C1.92984 13.5691 2.27485 13.6643 2.62673 13.6667H13.3734C13.7281 13.6702 14.0773 13.5793 14.3853 13.4033C14.6933 13.2273 14.949 12.9726 15.126 12.6652C15.3031 12.3579 15.3953 12.009 15.3931 11.6542C15.3908 11.2995 15.2943 10.9518 15.1134 10.6467ZM13.9601 11.98C13.9016 12.084 13.8164 12.1704 13.7132 12.2302C13.61 12.29 13.4927 12.321 13.3734 12.32H2.62673C2.50747 12.321 2.39013 12.29 2.28694 12.2302C2.18375 12.1704 2.0985 12.084 2.04006 11.98C1.98155 11.8787 1.95074 11.7637 1.95074 11.6467C1.95074 11.5297 1.98155 11.4147 2.04006 11.3134L7.37339 1.98002C7.42934 1.87082 7.51433 1.77917 7.61902 1.71518C7.72371 1.65119 7.84403 1.61733 7.96673 1.61733C8.08942 1.61733 8.20974 1.65119 8.31443 1.71518C8.41912 1.77917 8.50411 1.87082 8.56006 1.98002L13.9267 11.3134C13.9929 11.4132 14.0309 11.5291 14.0367 11.6488C14.0426 11.7684 14.0161 11.8875 13.9601 11.9934V11.98ZM8.00006 4.33335C7.82325 4.33335 7.65368 4.40359 7.52866 4.52861C7.40363 4.65364 7.33339 4.82321 7.33339 5.00002V7.66669C7.33339 7.8435 7.40363 8.01307 7.52866 8.13809C7.65368 8.26311 7.82325 8.33335 8.00006 8.33335C8.17687 8.33335 8.34644 8.26311 8.47146 8.13809C8.59649 8.01307 8.66673 7.8435 8.66673 7.66669V5.00002C8.66673 4.82321 8.59649 4.65364 8.47146 4.52861C8.34644 4.40359 8.17687 4.33335 8.00006 4.33335Z" , fill: "#F80000", __self: undefined, __source: {fileName: _jsxFileName$m, lineNumber: 55}})
21556
21815
  )
21557
- , errMsg ? errMsg : 'This field is required'
21816
+ , errMsg ? errMsg : React$1.createElement('span', { className: "paragraph1Regular", __self: undefined, __source: {fileName: _jsxFileName$m, lineNumber: 57}}, "This field is required" )
21558
21817
  )
21559
21818
 
21560
21819
  )
@@ -21646,6 +21905,20 @@ const RequestForm = (props) => {
21646
21905
  )
21647
21906
  };
21648
21907
 
21908
+ const RibbonGroup = styled.div`
21909
+ display: grid;
21910
+ grid-template-columns: min-content 1fr;
21911
+ gap: 16px;
21912
+ align-items: center;
21913
+ a.logo-link{
21914
+ width: max-content;
21915
+ }
21916
+ img{
21917
+ width: 50px;
21918
+
21919
+ }
21920
+ `;
21921
+
21649
21922
  const RibbonContainer = styled.div`
21650
21923
  border: 1px solid ${theme.colors["primary-500"]};
21651
21924
  border-radius: 100px;
@@ -21653,14 +21926,15 @@ const RibbonContainer = styled.div`
21653
21926
  overflow: hidden;
21654
21927
  //max-width: 784px;
21655
21928
  width: fit-content;
21929
+ display: flex;
21930
+ align-items: center;
21931
+ height: 49px;
21656
21932
  `;
21657
21933
  const RibbonItem = styled.a`
21658
21934
  display: inline-block;
21659
21935
  padding: 16px;
21660
21936
  text-decoration: none;
21661
- font-weight: 400;
21662
- font-size: 14px;
21663
- line-height: 17px;
21937
+ text-wrap: nowrap;
21664
21938
  &.dark{
21665
21939
  background: ${theme.colors["neutral-900"]};
21666
21940
  color: ${theme.colors.white};
@@ -21687,16 +21961,21 @@ const Ribbon = (props) => {
21687
21961
  const {links,bgColor,openInNewTab,currentPageItem,navigationOverride} = props;
21688
21962
 
21689
21963
  return (
21690
- React$1.createElement(React$1.Fragment, null
21964
+ React$1.createElement(RibbonGroup, {__self: undefined, __source: {fileName: _jsxFileName$k, lineNumber: 12}}
21965
+ , React$1.createElement('a', { href: "/", className: "logo-link", __self: undefined, __source: {fileName: _jsxFileName$k, lineNumber: 13}}
21966
+ , React$1.createElement('img', {
21967
+ src: "https://res.cloudinary.com/dxivfczqg/image/upload/w_50/v1680257873/dashboard-logo-no-name-dark_vrkbad.svg",
21968
+ alt: "SSX Logo" , __self: undefined, __source: {fileName: _jsxFileName$k, lineNumber: 14}})
21969
+ )
21691
21970
  , links && links.length > 0 &&
21692
- React$1.createElement(RibbonContainer, {__self: undefined, __source: {fileName: _jsxFileName$k, lineNumber: 14}}
21971
+ React$1.createElement(RibbonContainer, {__self: undefined, __source: {fileName: _jsxFileName$k, lineNumber: 19}}
21693
21972
  , links.map((link,index) => (
21694
- React$1.createElement(RibbonItem, { key: index, href: link.url, target: openInNewTab ? '_blank' : '_self', className: `${bgColor} ${currentPageItem && currentPageItem === link.label ? 'current' : ''}`, onClick: (e)=>{
21973
+ React$1.createElement(RibbonItem, { key: index, href: link.url, target: openInNewTab ? '_blank' : '_self', className: `paragraph1Regular ${bgColor} ${currentPageItem && currentPageItem === link.label ? 'current' : ''}`, onClick: (e)=>{
21695
21974
  if (navigationOverride) {
21696
21975
  e.preventDefault();
21697
21976
  navigationOverride(link);
21698
21977
  }
21699
- }, __self: undefined, __source: {fileName: _jsxFileName$k, lineNumber: 16}}, link.label)
21978
+ }, __self: undefined, __source: {fileName: _jsxFileName$k, lineNumber: 21}}, link.label)
21700
21979
  ))
21701
21980
  )
21702
21981
 
@@ -21711,7 +21990,7 @@ const SearchBarContainer = styled.div`
21711
21990
  width: 344px;
21712
21991
  `;
21713
21992
 
21714
- const SearchBox = styled.input`
21993
+ styled.input`
21715
21994
  padding: 13px 16px;
21716
21995
  //height: 48px;
21717
21996
  width: 100%;
@@ -21727,7 +22006,7 @@ const SearchBox = styled.input`
21727
22006
  }
21728
22007
  `;
21729
22008
 
21730
- const SearchButton = styled.button`
22009
+ styled.button`
21731
22010
  width: 60px;
21732
22011
  //height: 48px;
21733
22012
  background: ${theme.colors["primary-500"]};
@@ -21752,7 +22031,6 @@ const SearchButton = styled.button`
21752
22031
  `;
21753
22032
 
21754
22033
  const _jsxFileName$j = "D:\\SSX\\Project\\Component Library\\sscomp\\src\\components\\SearchBar\\SearchBar.tsx";
21755
-
21756
22034
  /**
21757
22035
  * A search field added on the news application to implement search
21758
22036
  */
@@ -21764,12 +22042,12 @@ const SearchBar = (props) => {
21764
22042
  React$1.createElement('form', { onSubmit: (e)=>{
21765
22043
  e.preventDefault();
21766
22044
  submitFxn(searchStr);
21767
- }, __self: undefined, __source: {fileName: _jsxFileName$j, lineNumber: 13}}
21768
- , React$1.createElement(SearchBarContainer, {__self: undefined, __source: {fileName: _jsxFileName$j, lineNumber: 17}}
21769
- , React$1.createElement(SearchBox, { type: "text", placeholder: "Search", value: searchStr, onChange: (e)=>{setSearchStr(e.target.value);}, __self: undefined, __source: {fileName: _jsxFileName$j, lineNumber: 18}})
21770
- , React$1.createElement(SearchButton, { type: "submit", __self: undefined, __source: {fileName: _jsxFileName$j, lineNumber: 19}}
21771
- , React$1.createElement('svg', { width: "21", height: "21", viewBox: "0 0 21 21" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$j, lineNumber: 20}}
21772
- , React$1.createElement('path', { d: "M20.21 19.29L16.5 15.61C17.9401 13.8144 18.6375 11.5353 18.4488 9.2413C18.2601 6.9473 17.1997 4.81278 15.4855 3.27664C13.7714 1.74051 11.5338 0.91951 9.23292 0.98247C6.93203 1.04543 4.74272 1.98756 3.11514 3.61514C1.48756 5.24272 0.545427 7.43204 0.482466 9.73292C0.419506 12.0338 1.2405 14.2714 2.77664 15.9855C4.31278 17.6997 6.4473 18.7601 8.7413 18.9488C11.0353 19.1375 13.3144 18.4401 15.11 17L18.79 20.68C18.883 20.7737 18.9936 20.8481 19.1154 20.8989C19.2373 20.9497 19.368 20.9758 19.5 20.9758C19.632 20.9758 19.7627 20.9497 19.8846 20.8989C20.0064 20.8481 20.117 20.7737 20.21 20.68C20.3902 20.4935 20.491 20.2443 20.491 19.985C20.491 19.7257 20.3902 19.4765 20.21 19.29V19.29ZM9.5 17C8.11553 17 6.76215 16.5895 5.611 15.8203C4.45986 15.0511 3.56265 13.9579 3.03284 12.6788C2.50303 11.3997 2.3644 9.99223 2.6345 8.63437C2.9046 7.2765 3.57128 6.02922 4.55025 5.05025C5.52922 4.07128 6.7765 3.4046 8.13436 3.1345C9.49223 2.86441 10.8997 3.00303 12.1788 3.53284C13.4579 4.06266 14.5511 4.95986 15.3203 6.11101C16.0895 7.26215 16.5 8.61553 16.5 10C16.5 11.8565 15.7625 13.637 14.4497 14.9497C13.137 16.2625 11.3565 17 9.5 17V17Z" , fill: "#F7F9FC", __self: undefined, __source: {fileName: _jsxFileName$j, lineNumber: 21}})
22045
+ }, __self: undefined, __source: {fileName: _jsxFileName$j, lineNumber: 15}}
22046
+ , React$1.createElement(SearchBarContainer, {__self: undefined, __source: {fileName: _jsxFileName$j, lineNumber: 19}}
22047
+ , React$1.createElement(TextField, { type: "text", width: 284, placeholder: "Search", value: searchStr, onChange: (e)=>{setSearchStr(e.target.value);}, __self: undefined, __source: {fileName: _jsxFileName$j, lineNumber: 20}})
22048
+ , React$1.createElement(Button$1, { variant: "primary", size: "lg", width: "fit-content", type: "submit", __self: undefined, __source: {fileName: _jsxFileName$j, lineNumber: 21}}
22049
+ , React$1.createElement('svg', { width: "21", height: "21", viewBox: "0 0 21 21" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName$j, lineNumber: 22}}
22050
+ , React$1.createElement('path', { d: "M20.21 19.29L16.5 15.61C17.9401 13.8144 18.6375 11.5353 18.4488 9.2413C18.2601 6.9473 17.1997 4.81278 15.4855 3.27664C13.7714 1.74051 11.5338 0.91951 9.23292 0.98247C6.93203 1.04543 4.74272 1.98756 3.11514 3.61514C1.48756 5.24272 0.545427 7.43204 0.482466 9.73292C0.419506 12.0338 1.2405 14.2714 2.77664 15.9855C4.31278 17.6997 6.4473 18.7601 8.7413 18.9488C11.0353 19.1375 13.3144 18.4401 15.11 17L18.79 20.68C18.883 20.7737 18.9936 20.8481 19.1154 20.8989C19.2373 20.9497 19.368 20.9758 19.5 20.9758C19.632 20.9758 19.7627 20.9497 19.8846 20.8989C20.0064 20.8481 20.117 20.7737 20.21 20.68C20.3902 20.4935 20.491 20.2443 20.491 19.985C20.491 19.7257 20.3902 19.4765 20.21 19.29V19.29ZM9.5 17C8.11553 17 6.76215 16.5895 5.611 15.8203C4.45986 15.0511 3.56265 13.9579 3.03284 12.6788C2.50303 11.3997 2.3644 9.99223 2.6345 8.63437C2.9046 7.2765 3.57128 6.02922 4.55025 5.05025C5.52922 4.07128 6.7765 3.4046 8.13436 3.1345C9.49223 2.86441 10.8997 3.00303 12.1788 3.53284C13.4579 4.06266 14.5511 4.95986 15.3203 6.11101C16.0895 7.26215 16.5 8.61553 16.5 10C16.5 11.8565 15.7625 13.637 14.4497 14.9497C13.137 16.2625 11.3565 17 9.5 17V17Z" , fill: "#F7F9FC", __self: undefined, __source: {fileName: _jsxFileName$j, lineNumber: 23}})
21773
22051
  )
21774
22052
  )
21775
22053
  )
@@ -21966,6 +22244,12 @@ const TitleSource = styled.div`
21966
22244
  display: flex;
21967
22245
  flex-direction: column;
21968
22246
  gap: 16px;
22247
+ .title{
22248
+ height: 69px;
22249
+ }
22250
+ h6{
22251
+ text-overflow: ellipsis;
22252
+ }
21969
22253
  `;
21970
22254
  const SourceDate = styled.div`
21971
22255
  background: ${theme.colors["neutral-50"]};
@@ -22012,22 +22296,24 @@ const SmallNewsCard = (props) => {
22012
22296
  }, __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 15}}, React$1.createElement(FeaturedImage, { src: featuredImgUrl, alt: title, onError: (e)=>{
22013
22297
  e.currentTarget.src = img$1;
22014
22298
  e.currentTarget.srcset = img$1;
22015
- }, __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 20}}))
22299
+ }, loading: "lazy", __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 20}}))
22016
22300
  , React$1.createElement(TitleSource, {__self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 24}}
22017
- , React$1.createElement('a', { href: storyUrl, onClick: (e)=>{
22018
- if (navigationOverride) {
22019
- e.preventDefault();
22020
- navigationOverride({title, date, source, sourceCountryFlagUrl, featuredImgUrl, storyUrl});
22021
- }
22022
- }, __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 25}}, React$1.createElement(NewsTitle, { className: "heading6Medium", __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 30}}, title))
22023
- , React$1.createElement(SourceDate, {__self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 31}}
22024
- , React$1.createElement('div', { className: "tag", __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 32}}
22025
- , React$1.createElement('span', { style: {marginRight:'8px'}, __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 33}}
22026
- , React$1.createElement('img', { src: sourceCountryFlagUrl, alt: "Source flag" , __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 34}})
22301
+ , React$1.createElement('div', { className: "title", __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 25}}
22302
+ , React$1.createElement('a', { href: storyUrl, onClick: (e)=>{
22303
+ if (navigationOverride) {
22304
+ e.preventDefault();
22305
+ navigationOverride({title, date, source, sourceCountryFlagUrl, featuredImgUrl, storyUrl});
22306
+ }
22307
+ }, __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 26}}, React$1.createElement(NewsTitle, { className: "heading6Medium", __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 31}}, title))
22308
+ )
22309
+ , React$1.createElement(SourceDate, {__self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 33}}
22310
+ , React$1.createElement('div', { className: "tag", __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 34}}
22311
+ , React$1.createElement('span', { style: {marginRight:'8px'}, __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 35}}
22312
+ , React$1.createElement('img', { src: sourceCountryFlagUrl, alt: "Source flag" , __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 36}})
22027
22313
  )
22028
- , React$1.createElement('span', { className: "captionBook", __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 36}}, source)
22314
+ , React$1.createElement('span', { className: "captionBook", __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 38}}, source)
22029
22315
  )
22030
- , React$1.createElement('div', { className: "tag", __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 38}}, React$1.createElement('span', { className: "captionBook", __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 38}}, date))
22316
+ , React$1.createElement('div', { className: "tag", __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 40}}, React$1.createElement('span', { className: "captionBook", __self: undefined, __source: {fileName: _jsxFileName$g, lineNumber: 40}}, date))
22031
22317
  )
22032
22318
  )
22033
22319
  )
@@ -22996,7 +23282,7 @@ const Table$3 = (props) => {
22996
23282
  );
22997
23283
  };
22998
23284
 
22999
- const InputLabel = styled.div`
23285
+ const InputLabel$1 = styled.div`
23000
23286
  display: flex;
23001
23287
  gap: 4px;
23002
23288
  flex-direction: column;
@@ -23107,13 +23393,13 @@ const TextArea = (props) => {
23107
23393
  return (
23108
23394
  React$1.createElement('div', { style: style, __self: undefined, __source: {fileName: _jsxFileName$c, lineNumber: 41}}
23109
23395
  , label &&
23110
- React$1.createElement(InputLabel, {__self: undefined, __source: {fileName: _jsxFileName$c, lineNumber: 43}}
23396
+ React$1.createElement(InputLabel$1, {__self: undefined, __source: {fileName: _jsxFileName$c, lineNumber: 43}}
23111
23397
  , React$1.createElement('label', {__self: undefined, __source: {fileName: _jsxFileName$c, lineNumber: 44}}, label)
23112
23398
  , subtext && React$1.createElement('span', {__self: undefined, __source: {fileName: _jsxFileName$c, lineNumber: 45}}, subtext)
23113
23399
  )
23114
23400
 
23115
23401
  , React$1.createElement(InputContainer, { className: `${borderColor} ${disabled ? 'disabled' : ''}`, style: {width:width ? width : '100%',border:disabled ? `1px solid ${theme.colors["neutral-100"]}` : ''}, __self: undefined, __source: {fileName: _jsxFileName$c, lineNumber: 48}}
23116
- , React$1.createElement(TextAreaField, { ref: textFieldRef, onBlur: ()=>{validate();}, value: inputVal, onChange: (e)=>{setInputVal(e.target.value);}, ...props, __self: undefined, __source: {fileName: _jsxFileName$c, lineNumber: 49}})
23402
+ , React$1.createElement(TextAreaField, { ref: textFieldRef, onBlur: validate, value: inputVal, onChange: (e)=>{setInputVal(e.target.value);}, onInvalid: validate, ...props, __self: undefined, __source: {fileName: _jsxFileName$c, lineNumber: 49}})
23117
23403
  )
23118
23404
  , !value && required && err &&
23119
23405
  React$1.createElement(ErrorMessage, {__self: undefined, __source: {fileName: _jsxFileName$c, lineNumber: 52}}
@@ -24376,37 +24662,32 @@ const WidgetTitle = (props) => {
24376
24662
  };
24377
24663
 
24378
24664
  const SSXBarContainer = styled.div`
24379
- padding-inline: 32px;
24380
- height: 82px;
24665
+ height: 81px;
24381
24666
  left: 0;
24667
+ background-color: #fff;
24382
24668
  right: 0;
24383
- display: flex;
24669
+ padding-left: 16.5px;
24670
+ padding-right: 16.5px;
24384
24671
  align-items: center;
24672
+ border-bottom: 1px solid var(--neutral-100, #e8eef7);
24673
+ /* mobile screens */
24674
+ @media (max-width: 767px) {
24675
+ height: 76px;
24676
+ }
24677
+ `;
24678
+
24679
+ styled.div`
24680
+ background: white;
24681
+ color: ${theme.colors["error-900"]};
24385
24682
  `;
24386
24683
 
24387
24684
  const _jsxFileName$4 = "D:\\SSX\\Project\\Component Library\\sscomp\\src\\components\\SSXBar\\SSXBar.tsx";
24388
24685
 
24389
24686
  const SSXBar = (props) => {
24390
- const {children,background} = props;
24391
- const [bgColor,setBgColor] = React$1.useState(null);
24392
-
24393
- const lightStyles = {
24394
- background:theme.colors.white,
24395
- borderBottom:`1px solid ${theme.colors["neutral-100"]}`
24396
- };
24397
- const darkStyles = {
24398
- background:theme.colors["neutral-900"],
24399
- color:theme.colors.white
24400
- };
24401
-
24402
- React$1.useEffect(()=>{
24403
- if (background === 'light') setBgColor(lightStyles);
24404
- if (background === 'dark') setBgColor(darkStyles);
24405
- },[background]);
24406
-
24687
+ const {children, className} = props;
24407
24688
  return (
24408
- React$1.createElement(SSXBarContainer, { ...props, style: bgColor, __self: undefined, __source: {fileName: _jsxFileName$4, lineNumber: 25}}
24409
- , children
24689
+ React$1.createElement(SSXBarContainer, { className: className, ...props, __self: undefined, __source: {fileName: _jsxFileName$4, lineNumber: 8}}
24690
+ , children && children
24410
24691
  )
24411
24692
  )
24412
24693
  };
@@ -24724,27 +25005,67 @@ const TableAlternative = React$1.forwardRef((props, ref) => {
24724
25005
  )
24725
25006
  });
24726
25007
 
25008
+ const MainContainer = styled.div`
25009
+ display: flex;
25010
+ flex-direction: column;
25011
+ gap: 12px;
25012
+ `;
25013
+
25014
+ const FieldContainer = styled.div`
25015
+ display:flex;
25016
+ flex-direction: column;
25017
+ gap:8px;
25018
+ `;
25019
+
25020
+ const InputLabel = styled.div`
25021
+ display: flex;
25022
+ flex-direction: column;
25023
+ gap: 4px;
25024
+ label{
25025
+ color:${theme.colors["primary-900"]};
25026
+ font-weight: 500;
25027
+ font-family: "Circular Book Medium", sans-serif;
25028
+ }
25029
+ `;
25030
+
25031
+ const SrInput = styled.input`
25032
+ position: absolute;
25033
+ width: 1px;
25034
+ height: 1px;
25035
+ margin: -1px;
25036
+ overflow: hidden;
25037
+ clip: rect(0, 0, 0, 0);
25038
+ white-space: nowrap;
25039
+ border: 0;
25040
+ &:focus,&:focus-visible{
25041
+ border: none;
25042
+ outline: none;
25043
+ }
25044
+ `;
25045
+
24727
25046
  const SelectorContainer = styled.div`
24728
25047
  //width: 430px;
24729
25048
  border-radius: 8px;
24730
25049
  outline: 1px solid ${theme.colors["neutral-100"]};
24731
25050
  background: ${theme.colors.white};
24732
- display: flex;
25051
+ display: grid;
24733
25052
  justify-content: space-between;
24734
25053
  align-items: center;
25054
+ grid-template-columns: 1fr 0fr;
24735
25055
  padding: 16px;
24736
25056
  transition: 0.3s;
24737
25057
  cursor: pointer;
25058
+ &:hover{
25059
+ outline-color: ${theme.colors["primary-500"]};
25060
+ background: ${theme.colors["primary-50"]};
25061
+ }
24738
25062
  .text{
24739
25063
  margin: 0;
25064
+ width: 100%;
24740
25065
  }
24741
25066
  &.selected{
24742
- outline-color: ${theme.colors["primary-500"]};
24743
- background: ${theme.colors["primary-50"]};
24744
- }
24745
- :hover{
24746
- outline-color: ${theme.colors["primary-500"]};
24747
- background: ${theme.colors["primary-50"]};
25067
+ outline-color: ${theme.colors["primary-500"]} !important;
25068
+ background: ${theme.colors["primary-50"]} !important;
24748
25069
  }
24749
25070
  svg{
24750
25071
  height: 24px;
@@ -24757,29 +25078,72 @@ const _jsxFileName = "D:\\SSX\\Project\\Component Library\\sscomp\\src\\componen
24757
25078
  * Component for making selections. Usage could be in an onboarding process
24758
25079
  */
24759
25080
  const Selector = (props) => {
24760
- const {itemsList,selectedItem,width} = props;
24761
- const [selItem,setSelItem] = React$1.useState('');
25081
+ const {itemsList,selectedItem,width,multiSelect,required,label,subText,errMsg} = props;
25082
+ const [selOptions,setSelOptions] = React$1.useState([]);
25083
+ const [selStatus,setSelStatus] = React$1.useState('');
25084
+ const [srVal,setSrVal] = React$1.useState('');
25085
+
25086
+ function handleSelect(selection){
25087
+ setSelStatus('');
25088
+ let temp = [...selOptions];
25089
+
25090
+ const filt = temp.some((option) => option.label === selection.label);
25091
+
25092
+ if (multiSelect){
25093
+ if (!filt){
25094
+ setSelOptions([...selOptions,selection]);
25095
+ selectedItem([...selOptions,selection]);
25096
+ setSrVal(selection.label); //shows that at least one option is selected
25097
+ }else {
25098
+ const temp2 = temp.filter((option) => option.label !== selection.label);
25099
+ setSelOptions(temp2);
25100
+ selectedItem(temp2);
25101
+ setSrVal(''); //shows that at least one option is selected
25102
+ }
25103
+ }else {
25104
+ selectedItem(!filt ? selection : null);
25105
+ setSrVal(!filt ? selection.label : '');
25106
+ setSelOptions(!filt ? [selection] : []);
25107
+ }
25108
+ }
24762
25109
 
24763
25110
  return (
24764
- React$1.createElement('div', { style: {display:"flex",flexDirection:'column',gap:8,width:width ? width : '100%'}, __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 14}}
24765
- , itemsList.map((item,index) => (
24766
- React$1.createElement(SelectorContainer, { key: index, className: item.label === selItem ? 'selected' : '', onClick: () => {
24767
- if(selItem === item.label){
24768
- setSelItem('');
24769
- selectedItem(null);
24770
- }else {
24771
- setSelItem(item.label);
24772
- selectedItem(item);
24773
- }
24774
- }, __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 16}}
24775
- , React$1.createElement('p', { className: "text", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 25}}, item.label)
24776
- , React$1.createElement('svg', { width: "25", height: "22", viewBox: "0 0 16 12" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 26}}
24777
- , React$1.createElement('path', { d: "M14.71 1.21C14.617 1.11627 14.5064 1.04188 14.3846 0.991107C14.2627 0.940338 14.132 0.9142 14 0.9142C13.868 0.9142 13.7373 0.940338 13.6154 0.991107C13.4936 1.04188 13.383 1.11627 13.29 1.21L5.84001 8.67L2.71001 5.53C2.61349 5.43676 2.49955 5.36345 2.37469 5.31424C2.24984 5.26504 2.11651 5.24091 1.98233 5.24323C1.84815 5.24555 1.71574 5.27428 1.59266 5.32777C1.46959 5.38126 1.35825 5.45848 1.26501 5.555C1.17177 5.65152 1.09846 5.76546 1.04925 5.89032C1.00005 6.01517 0.97592 6.1485 0.978241 6.28268C0.980563 6.41686 1.00929 6.54927 1.06278 6.67234C1.11628 6.79542 1.19349 6.90676 1.29001 7L5.13001 10.84C5.22297 10.9337 5.33358 11.0081 5.45543 11.0589C5.57729 11.1097 5.708 11.1358 5.84001 11.1358C5.97202 11.1358 6.10273 11.1097 6.22459 11.0589C6.34645 11.0081 6.45705 10.9337 6.55001 10.84L14.71 2.68C14.8115 2.58636 14.8925 2.4727 14.9479 2.3462C15.0033 2.21971 15.0319 2.0831 15.0319 1.945C15.0319 1.8069 15.0033 1.67029 14.9479 1.54379C14.8925 1.41729 14.8115 1.30364 14.71 1.21V1.21Z" ,
24778
- fill: item.label === selItem ? theme.colors["primary-500"] : theme.colors["neutral-400"], __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 27}})
25111
+ React$1.createElement(MainContainer, {__self: undefined, __source: {fileName: _jsxFileName, lineNumber: 41}}
25112
+ , label &&
25113
+ React$1.createElement(InputLabel, {__self: undefined, __source: {fileName: _jsxFileName, lineNumber: 43}}
25114
+ , React$1.createElement('label', {__self: undefined, __source: {fileName: _jsxFileName, lineNumber: 44}}, label)
25115
+ , subText && React$1.createElement('span', {__self: undefined, __source: {fileName: _jsxFileName, lineNumber: 45}}, subText)
25116
+ )
25117
+
25118
+ , React$1.createElement(FieldContainer, { style: {width:width ? width : '100%'}, __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 48}}
25119
+
25120
+ , itemsList.map((item,index) => (
25121
+ React$1.createElement(SelectorContainer, { key: index, className: selOptions.some((option) => (option.label === item.label)) ? 'selected' : '', onClick: () => {
25122
+ handleSelect(item);
25123
+ }, __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 51}}
25124
+ , React$1.createElement('p', { className: "text paragraph2Regular" , __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 54}}, item.label)
25125
+ , React$1.createElement('svg', { width: "25", height: "22", viewBox: "0 0 16 12" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 55}}
25126
+ , React$1.createElement('path', { d: "M14.71 1.21C14.617 1.11627 14.5064 1.04188 14.3846 0.991107C14.2627 0.940338 14.132 0.9142 14 0.9142C13.868 0.9142 13.7373 0.940338 13.6154 0.991107C13.4936 1.04188 13.383 1.11627 13.29 1.21L5.84001 8.67L2.71001 5.53C2.61349 5.43676 2.49955 5.36345 2.37469 5.31424C2.24984 5.26504 2.11651 5.24091 1.98233 5.24323C1.84815 5.24555 1.71574 5.27428 1.59266 5.32777C1.46959 5.38126 1.35825 5.45848 1.26501 5.555C1.17177 5.65152 1.09846 5.76546 1.04925 5.89032C1.00005 6.01517 0.97592 6.1485 0.978241 6.28268C0.980563 6.41686 1.00929 6.54927 1.06278 6.67234C1.11628 6.79542 1.19349 6.90676 1.29001 7L5.13001 10.84C5.22297 10.9337 5.33358 11.0081 5.45543 11.0589C5.57729 11.1097 5.708 11.1358 5.84001 11.1358C5.97202 11.1358 6.10273 11.1097 6.22459 11.0589C6.34645 11.0081 6.45705 10.9337 6.55001 10.84L14.71 2.68C14.8115 2.58636 14.8925 2.4727 14.9479 2.3462C15.0033 2.21971 15.0319 2.0831 15.0319 1.945C15.0319 1.8069 15.0033 1.67029 14.9479 1.54379C14.8925 1.41729 14.8115 1.30364 14.71 1.21V1.21Z" ,
25127
+ fill: selOptions.some((option) => (option.label === item.label)) ? theme.colors["primary-500"] : theme.colors["neutral-400"], __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 56}})
25128
+ )
25129
+ )
25130
+ ))
25131
+ )
25132
+ , React$1.createElement(SrInput, { className: "sr-only", value: srVal, required: required, onInvalid: (e)=>{
25133
+ setSelStatus('error');
25134
+ e.target.setCustomValidity('This field is required');
25135
+ }, onChange: ()=>{}, __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 62}})
25136
+ , selStatus === 'error' &&
25137
+ React$1.createElement(ErrorMessage$1, {__self: undefined, __source: {fileName: _jsxFileName, lineNumber: 67}}
25138
+ /*exclamation-triangle*/
25139
+ , React$1.createElement('svg', { width: "16", height: "14", viewBox: "0 0 16 14" , fill: "none", xmlns: "http://www.w3.org/2000/svg", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 69}}
25140
+ , React$1.createElement('path', { d: "M8.00006 9.66669C7.86821 9.66669 7.73931 9.70578 7.62968 9.77904C7.52005 9.85229 7.4346 9.95641 7.38414 10.0782C7.33368 10.2 7.32048 10.3341 7.3462 10.4634C7.37193 10.5927 7.43542 10.7115 7.52866 10.8048C7.62189 10.898 7.74068 10.9615 7.87 10.9872C7.99932 11.0129 8.13336 10.9997 8.25518 10.9493C8.377 10.8988 8.48112 10.8134 8.55437 10.7037C8.62763 10.5941 8.66673 10.4652 8.66673 10.3334C8.66673 10.1565 8.59649 9.98697 8.47146 9.86195C8.34644 9.73692 8.17687 9.66669 8.00006 9.66669ZM15.1134 10.6467L9.74673 1.31335C9.57326 1.00236 9.31992 0.743323 9.01285 0.562997C8.70579 0.382672 8.35615 0.287598 8.00006 0.287598C7.64396 0.287598 7.29433 0.382672 6.98726 0.562997C6.6802 0.743323 6.42686 1.00236 6.25339 1.31335L0.92006 10.6467C0.74059 10.9494 0.644155 11.294 0.640489 11.6459C0.636824 11.9978 0.726058 12.3444 0.899184 12.6507C1.07231 12.9571 1.3232 13.2123 1.62652 13.3907C1.92984 13.5691 2.27485 13.6643 2.62673 13.6667H13.3734C13.7281 13.6702 14.0773 13.5793 14.3853 13.4033C14.6933 13.2273 14.949 12.9726 15.126 12.6652C15.3031 12.3579 15.3953 12.009 15.3931 11.6542C15.3908 11.2995 15.2943 10.9518 15.1134 10.6467ZM13.9601 11.98C13.9016 12.084 13.8164 12.1704 13.7132 12.2302C13.61 12.29 13.4927 12.321 13.3734 12.32H2.62673C2.50747 12.321 2.39013 12.29 2.28694 12.2302C2.18375 12.1704 2.0985 12.084 2.04006 11.98C1.98155 11.8787 1.95074 11.7637 1.95074 11.6467C1.95074 11.5297 1.98155 11.4147 2.04006 11.3134L7.37339 1.98002C7.42934 1.87082 7.51433 1.77917 7.61902 1.71518C7.72371 1.65119 7.84403 1.61733 7.96673 1.61733C8.08942 1.61733 8.20974 1.65119 8.31443 1.71518C8.41912 1.77917 8.50411 1.87082 8.56006 1.98002L13.9267 11.3134C13.9929 11.4132 14.0309 11.5291 14.0367 11.6488C14.0426 11.7684 14.0161 11.8875 13.9601 11.9934V11.98ZM8.00006 4.33335C7.82325 4.33335 7.65368 4.40359 7.52866 4.52861C7.40363 4.65364 7.33339 4.82321 7.33339 5.00002V7.66669C7.33339 7.8435 7.40363 8.01307 7.52866 8.13809C7.65368 8.26311 7.82325 8.33335 8.00006 8.33335C8.17687 8.33335 8.34644 8.26311 8.47146 8.13809C8.59649 8.01307 8.66673 7.8435 8.66673 7.66669V5.00002C8.66673 4.82321 8.59649 4.65364 8.47146 4.52861C8.34644 4.40359 8.17687 4.33335 8.00006 4.33335Z" , fill: "#F80000", __self: undefined, __source: {fileName: _jsxFileName, lineNumber: 70}})
24779
25141
  )
25142
+ , errMsg ? errMsg : 'Select an option'
24780
25143
  )
24781
- ))
25144
+
24782
25145
  )
25146
+
24783
25147
  )
24784
25148
  };
24785
25149
 
@@ -24807,7 +25171,7 @@ exports.DateRangePicker = DateRangePicker;
24807
25171
  exports.DisplayField = DisplayField;
24808
25172
  exports.DropdownList = DropdownList;
24809
25173
  exports.ExchangeRates = ExchangeRates;
24810
- exports.Footer = Footer;
25174
+ exports.FooterNew = FooterNew;
24811
25175
  exports.Indices = Indices;
24812
25176
  exports.LPRequestTable = LPRequestTable;
24813
25177
  exports.LPSideNav = LPSideNav;