@hellobetterdigitalnz/selwynui 0.0.1-7 → 0.0.1-71

package/src/Components/Form/index.ts

@@ -1,2 +1,35 @@
+export type { default as InputProps } from './InputProps.tsx';
+
 export { default as Button } from './Button/Button';
-export type { default as ButtonProps } from './Button/ButtonProps';
+export type { default as ButtonProps } from './Button/ButtonProps';
+
+export { default as TextField } from './TextField/TextField';
+export type { default as TextFieldProps } from './TextField/TextFieldProps';
+
+export { default as  LoadingInput } from './LoadingInput/LoadingInput';
+
+export { default as SimpleForm } from './SimpleForm/SimpleForm';
+export type { default as SimpleFormProps } from './SimpleForm/SimpleFormProps';
+
+export { default as EmailField } from './EmailField/EmailField';
+
+export { default as Textarea } from './Textarea/Textarea';
+export type { default as TextareaProps } from './Textarea/TextareaProps';
+
+export { default as Checkbox } from './Checkbox/Checkbox';
+export type { default as CheckboxProps } from './Checkbox/CheckboxProps';
+
+export { default as FormFieldHolder } from './FormFieldHolder/FormFieldHolder';
+export type { default as FormFieldHolderProps } from './FormFieldHolder/FormFieldHolderProps';
+
+export { default as LandingPageForm } from './LandingPageForm/LandingPageForm';
+export type { default as LandingPageFormProps } from './LandingPageForm/LandingPageFormProps';
+export { default as LandingPageFormLeft } from './LandingPageForm/LandingPageFormLeft.tsx';
+export type { default as LandingPageFormLeftProps } from './LandingPageForm/LandingPageFormLeft.tsx';
+export { default as LandingPageFormRight } from './LandingPageForm/LandingPageFormRight.tsx';
+export type { default as LandingPageFormRightProps } from './LandingPageForm/LandingPageFormRightProps.tsx';
+
+
+
+
+

package/src/Components/Form/index.ts~

@@ -0,0 +1,32 @@
+export type { default as InputProps } from './InputProps.tsx';
+
+export { default as Button } from './Button/Button';
+export type { default as ButtonProps } from './Button/ButtonProps';
+
+export { default as TextField } from './TextField/TextField';
+export type { default as TextFieldProps } from './TextField/TextFieldProps';
+
+export { default as  LoadingInput } from './LoadingInput/LoadingInput';
+
+export { default as SimpleForm } from './SimpleForm/SimpleForm';
+export type { default as SimpleFormProps } from './SimpleForm/SimpleFormProps';
+
+export { default as EmailField } from './EmailField/EmailField';
+
+
+export { default as Textarea } from './Textarea/Textarea';
+export type { default as TextareaProps } from './Textarea/TextareaProps';
+
+export { default as Checkbox } from './Checkbox/Checkbox';
+export type { default as CheckboxProps } from './Checkbox/CheckboxProps';
+
+export { default as FormFieldHolder } from './FormFieldHolder/FormFieldHolder';
+export type { default as FormFieldHolderProps } from './FormFieldHolder/FormFieldHolderProps';
+
+export { default as LandingPageForm } from './LandingPageForm/LandingPageForm';
+export type { default as LandingPageFormProps } from './LandingPageForm/LandingPageFormProps';
+
+
+
+
+

package/src/Components/Form/inputs.module.scss

@@ -0,0 +1,172 @@
+.field {
+  position: relative;
+}
+
+.input {
+
+  &[type="text"],
+  &[type="password"],
+  &[type="email"],
+  &[type="number"],
+  &[type="date"],
+  &[type="tel"],
+  &[type="time"] {
+    width: 100%;
+    max-width: 100%;
+    height: 48px;
+    padding: 12px;
+    border: 1px solid var(--form-field-border);
+    border-radius: 4px;
+    font-family: var(--font);
+    font-size: var(--font-size-label);
+    line-height: var(--line-height-h3);
+    font-weight: var(--font-weight-h3);
+
+    &::placeholder {
+      color: var(--form-field-placeholder-text);
+      font-size: var(--font-size-label);
+      line-height: var(--line-height-h3);
+      font-weight: var(--font-weight-h3);
+    }
+
+    &:focus {
+      outline: none;
+      border: 2px solid var(--color-text);
+      color: var(--form-field-focus-text);
+    }
+
+    &:disabled {
+      opacity: 0.5;
+      pointer-events: none;
+    }
+  }
+
+  &.error {
+
+    &[type="text"],
+    &[type="password"],
+    &[type="email"],
+    &[type="number"],
+    &[type="date"],
+    &[type="tel"],
+    &[type="time"] {
+      border: 1px solid var(--color-error);
+      background: var(--color-error-lite);
+
+      &:focus {
+        border: 2px solid var(--color-error);
+        background: #ffffff;
+      }
+    }
+  }
+}
+
+.passwordCon {
+  width: 100%;
+  position: relative;
+
+  [type="password"],
+  [type="text"] {
+    padding-right: calc(var(--space-unit) * 9);
+  }
+
+  .eyeicon {
+    display: flex;
+    position: absolute;
+    right: 12px;
+    top: 50%;
+    transform: translateY(-50%);
+    cursor: pointer;
+
+    svg {
+      width: 16px;
+      height: 16px;
+    }
+  }
+}
+
+.date,
+.time,
+.currency,
+.textField {
+  width: 100%;
+  max-width: 100%;
+  position: relative;
+
+  [type="date"],
+  [type="time"] {
+    -webkit-appearance: none;
+  }
+
+  [type="date"],
+  [type="time"],
+  [type="number"] {
+    text-transform: uppercase;
+  }
+
+  [type="date"],
+  [type="text"],
+  [type="time"],
+  [type="number"] {
+    // padding-left: calc(var(--space-unit) * 11);
+    font-family: var(--font);
+
+    &::-webkit-calendar-picker-indicator {
+      position: absolute;
+      left: 12px;
+      top: 50%;
+      transform: translateY(-50%);
+      cursor: pointer;
+      opacity: 0;
+    }
+  }
+
+  .calendarIcon,
+  .clockIcon,
+  .currencyIcon,
+  .textFieldIcon {
+    display: flex;
+    position: absolute;
+    left: 12px;
+    top: 50%;
+    transform: translateY(-50%);
+    pointer-events: none;
+
+    svg {
+      flex-shrink: 0;
+      width: 24px;
+      height: 24px;
+    }
+  }
+}
+
+.unitField {
+  position: relative;
+
+  .input {
+
+    &[type="text"],
+    &[type="number"] {
+      text-align: left;
+    }
+  }
+
+  .unitText {
+    display: flex;
+    position: absolute;
+    right: 12px;
+    top: 50%;
+    transform: translateY(-50%);
+    pointer-events: none;
+    color: var(--color-gray-500);
+    font-size: var(--font-size-input);
+    line-height: var(--line-height-input);
+    font-weight: var(--font-weight-input);
+
+    &.active {
+      color: var(--color-gray-900);
+    }
+
+  }
+
+}

package/src/Components/Icons/Communication/PaperPlaneTilt/PaperPlaneTilt.tsx

@@ -0,0 +1,37 @@
+import IconProps from "../../IconProps";
+
+const PaperPlaneTilt = ({type}: IconProps) => {
+
+  if (type === 'thin') {
+    return <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path d="M28.0586 3.94003C27.8693 3.74971 27.6319 3.61432 27.3717 3.54828C27.1115 3.48225 26.8382 3.48803 26.5811 3.56503L2.59234 10.8338C2.2982 10.9165 2.03635 11.0871 1.84181 11.3227C1.64728 11.5584 1.52935 11.8478 1.50379 12.1523C1.47824 12.4568 1.54628 12.7618 1.69882 13.0265C1.85135 13.2913 2.08111 13.5032 2.35734 13.6338L13.0586 18.7025C13.1632 18.7517 13.2476 18.8356 13.2973 18.94L18.3661 29.6425C18.4859 29.8996 18.6769 30.1169 18.9163 30.2689C19.1558 30.4208 19.4337 30.501 19.7173 30.5C19.7598 30.5 19.8036 30.5 19.8423 30.5C20.1456 30.4764 20.4342 30.3603 20.6694 30.1674C20.9046 29.9744 21.0749 29.714 21.1573 29.4213L28.4336 5.42128V5.41128C28.5096 5.15503 28.5149 4.88297 28.4489 4.62395C28.3829 4.36493 28.248 4.12861 28.0586 3.94003ZM27.4811 5.13253L20.2023 29.1325C20.1746 29.2303 20.1178 29.3174 20.0393 29.3821C19.9609 29.4467 19.8646 29.486 19.7633 29.4945C19.662 29.5031 19.5605 29.4805 19.4724 29.4299C19.3842 29.3793 19.3135 29.3031 19.2698 29.2113L14.2011 18.5125L20.3561 12.3588C20.4025 12.3123 20.4394 12.2572 20.4645 12.1965C20.4897 12.1358 20.5026 12.0707 20.5026 12.005C20.5026 11.9393 20.4897 11.8743 20.4645 11.8136C20.4394 11.7529 20.4025 11.6977 20.3561 11.6513C20.3096 11.6048 20.2545 11.568 20.1938 11.5428C20.1331 11.5177 20.068 11.5047 20.0023 11.5047C19.9366 11.5047 19.8716 11.5177 19.8109 11.5428C19.7502 11.568 19.695 11.6048 19.6486 11.6513L13.4936 17.8063L2.78609 12.73C2.69166 12.6878 2.61319 12.6166 2.56214 12.5266C2.51109 12.4366 2.49014 12.3327 2.50234 12.23C2.50979 12.126 2.55014 12.0271 2.61756 11.9475C2.68497 11.868 2.77596 11.8119 2.87734 11.7875L26.8623 4.52003C26.907 4.50688 26.9533 4.50015 26.9998 4.50003C27.1311 4.5019 27.2564 4.55533 27.3486 4.64878C27.4121 4.71007 27.4579 4.78734 27.4812 4.87247C27.5045 4.95759 27.5045 5.04743 27.4811 5.13253Z" fill="currentColor"/>
+    </svg>
+  }
+  if (type === 'regular') {
+    return <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path d="M28.415 3.58509C28.1635 3.33375 27.8496 3.15401 27.5055 3.06436C27.1614 2.97472 26.7997 2.97842 26.4575 3.07509H26.4388L2.44626 10.3551C2.0557 10.4674 1.70863 10.696 1.45126 11.0105C1.19388 11.325 1.03842 11.7105 1.00557 12.1155C0.97272 12.5206 1.06404 12.926 1.26738 13.2779C1.47071 13.6297 1.77641 13.9113 2.14376 14.0851L12.8463 19.1538L17.915 29.8563C18.075 30.1991 18.3298 30.4889 18.6492 30.6915C18.9686 30.8942 19.3393 31.0013 19.7175 31.0001C19.775 31.0001 19.8325 30.9976 19.89 30.9926C20.2936 30.9599 20.6776 30.8046 20.9904 30.5474C21.3032 30.2902 21.5299 29.9435 21.64 29.5538L28.915 5.56134C28.915 5.55509 28.915 5.54884 28.915 5.54259C29.0129 5.20129 29.0182 4.84008 28.9304 4.49606C28.8425 4.15204 28.6646 3.83762 28.415 3.58509ZM19.7288 28.9813L19.7225 28.9988L14.8025 18.6126L20.7075 12.7063C20.8871 12.5173 20.9858 12.2655 20.9824 12.0048C20.9791 11.744 20.874 11.4949 20.6896 11.3105C20.5052 11.1261 20.2561 11.021 19.9953 11.0176C19.7346 11.0143 19.4828 11.113 19.2938 11.2926L13.3875 17.1976L3.00001 12.2776H3.01751L27 5.00009L19.7288 28.9813Z" fill="currentColor"/>
+    </svg>
+  }
+  if (type === 'bold') {
+    return <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path d="M28.7673 3.2325C28.4531 2.91823 28.0608 2.69337 27.6309 2.5811C27.2009 2.46883 26.7488 2.4732 26.3211 2.59375L26.2936 2.6025L2.3048 9.875C1.81755 10.0163 1.38481 10.3024 1.06406 10.6955C0.743306 11.0886 0.549727 11.5699 0.509034 12.0756C0.46834 12.5813 0.582457 13.0874 0.836227 13.5267C1.09 13.9659 1.47141 14.3176 1.9298 14.535L12.4698 19.535L17.4698 30.075C17.6694 30.5031 17.9873 30.8653 18.3859 31.1186C18.7846 31.372 19.2474 31.5061 19.7198 31.505C19.791 31.505 19.8636 31.505 19.9361 31.4963C20.4413 31.456 20.9221 31.2617 21.3135 30.9396C21.7049 30.6175 21.988 30.1831 22.1248 29.695L29.3973 5.70625C29.401 5.69734 29.4039 5.68814 29.406 5.67875C29.5266 5.25103 29.531 4.7989 29.4187 4.36893C29.3064 3.93896 29.0816 3.54668 28.7673 3.2325ZM19.6248 27.615L15.4098 18.7163L21.066 13.06C21.3478 12.7782 21.5062 12.396 21.5062 11.9975C21.5062 11.599 21.3478 11.2168 21.066 10.935C20.7843 10.6532 20.4021 10.4949 20.0035 10.4949C19.605 10.4949 19.2228 10.6532 18.941 10.935L13.2848 16.5913L4.3848 12.375L26.2498 5.75L19.6248 27.615Z" fill="currentColor"/>
+    </svg>
+  }
+  if (type === 'fill') {
+    return <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path d="M28.925 5.54242C28.925 5.54242 28.925 5.55492 28.925 5.56117L21.65 29.5537C21.5399 29.9434 21.3132 30.2901 21.0004 30.5472C20.6876 30.8044 20.3036 30.9597 19.9 30.9924C19.8425 30.9974 19.785 30.9999 19.7275 30.9999C19.3492 31.0011 18.9785 30.894 18.6592 30.6914C18.3398 30.4887 18.085 30.1989 17.925 29.8562L13.4612 20.4324C13.4172 20.3392 13.403 20.2346 13.4207 20.133C13.4384 20.0314 13.487 19.9378 13.56 19.8649L20.7175 12.7062C20.8971 12.5171 20.9958 12.2654 20.9924 12.0046C20.9891 11.7438 20.884 11.4947 20.6996 11.3103C20.5152 11.1259 20.2661 11.0208 20.0053 11.0175C19.7446 11.0141 19.4928 11.1128 19.3037 11.2924L12.135 18.4499C12.0621 18.5229 11.9685 18.5715 11.8669 18.5892C11.7653 18.6069 11.6607 18.5927 11.5675 18.5487L2.19249 14.1074C1.8243 13.9387 1.51444 13.6646 1.30216 13.3197C1.08987 12.9748 0.984714 12.5746 0.999992 12.1699C1.02035 11.754 1.17094 11.3549 1.43047 11.0292C1.69 10.7035 2.04533 10.4676 2.44624 10.3549L26.4387 3.07992H26.4575C26.7991 2.98394 27.1601 2.98058 27.5034 3.07017C27.8468 3.15976 28.1601 3.33908 28.4112 3.58972C28.6624 3.84037 28.8423 4.15333 28.9326 4.49648C29.0229 4.83963 29.0203 5.20062 28.925 5.54242Z" fill="currentColor"/>
+    </svg>
+  }
+  if (type === 'duotone') {
+    return <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path opacity="0.2" d="M27.9612 5.27256L20.6837 29.2726C20.6281 29.4681 20.5143 29.6421 20.3574 29.7713C20.2004 29.9005 20.0078 29.9788 19.8052 29.9958C19.6027 30.0128 19.3997 29.9676 19.2235 29.8663C19.0472 29.765 18.906 29.6124 18.8187 29.4288L13.7499 18.7263C13.6511 18.5179 13.4833 18.3501 13.2749 18.2513L2.57244 13.1813C2.38886 13.094 2.23624 12.9528 2.13495 12.7765C2.03365 12.6003 1.98847 12.3973 2.00545 12.1948C2.02242 11.9922 2.10073 11.7996 2.22994 11.6426C2.35916 11.4857 2.53314 11.3719 2.72869 11.3163L26.7287 4.03882C26.8997 3.99089 27.0803 3.98936 27.2521 4.03438C27.4239 4.0794 27.5805 4.16934 27.706 4.29496C27.8315 4.42058 27.9213 4.57736 27.9662 4.74917C28.011 4.92098 28.0093 5.10163 27.9612 5.27256Z" fill="currentColor"/>
+      <path d="M28.415 3.58509C28.1635 3.33375 27.8496 3.15401 27.5055 3.06436C27.1614 2.97472 26.7997 2.97842 26.4575 3.07509H26.4388L2.44626 10.3551C2.0557 10.4674 1.70863 10.696 1.45126 11.0105C1.19388 11.325 1.03842 11.7105 1.00557 12.1155C0.97272 12.5206 1.06404 12.926 1.26738 13.2779C1.47071 13.6297 1.77641 13.9113 2.14376 14.0851L12.8463 19.1538L17.915 29.8563C18.075 30.1991 18.3298 30.4889 18.6492 30.6915C18.9686 30.8942 19.3393 31.0013 19.7175 31.0001C19.775 31.0001 19.8325 30.9976 19.89 30.9926C20.2936 30.9599 20.6776 30.8046 20.9904 30.5474C21.3032 30.2902 21.5299 29.9435 21.64 29.5538L28.915 5.56134C28.915 5.55509 28.915 5.54884 28.915 5.54259C29.0129 5.20129 29.0182 4.84008 28.9304 4.49606C28.8425 4.15204 28.6646 3.83762 28.415 3.58509ZM19.7288 28.9813L19.7225 28.9988L14.8025 18.6126L20.7075 12.7063C20.8871 12.5173 20.9858 12.2655 20.9824 12.0048C20.9791 11.744 20.874 11.4949 20.6896 11.3105C20.5052 11.1261 20.2561 11.021 19.9953 11.0176C19.7346 11.0143 19.4828 11.113 19.2938 11.2926L13.3875 17.1976L3.00001 12.2776H3.01751L27 5.00009L19.7288 28.9813Z" fill="currentColor"/>
+    </svg>
+  }
+
+  return <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+    <path d="M28.2351 3.76497C28.0165 3.54298 27.7419 3.3842 27.4405 3.30543C27.139 3.22666 26.8219 3.23082 26.5226 3.31747H26.5088L2.51759 10.5962C2.1757 10.6942 1.87177 10.8939 1.64627 11.169C1.42077 11.444 1.28441 11.7812 1.25536 12.1356C1.22631 12.4901 1.30594 12.8449 1.48365 13.153C1.66136 13.4611 1.92871 13.7077 2.25009 13.86L12.9513 18.9287C13.003 18.9541 13.0447 18.9958 13.0701 19.0475L18.1401 29.75C18.2801 30.0496 18.5029 30.303 18.7821 30.4802C19.0614 30.6574 19.3856 30.751 19.7163 30.75C19.7663 30.75 19.8176 30.75 19.8676 30.7437C20.2219 30.7159 20.5592 30.58 20.8339 30.3545C21.1086 30.1289 21.3075 29.8246 21.4038 29.4825L28.6788 5.49122V5.47747C28.766 5.17852 28.7707 4.86159 28.6926 4.56016C28.6145 4.25873 28.4564 3.98399 28.2351 3.76497ZM27.2351 5.06497L19.9663 29.0537V29.0675C19.9546 29.1176 19.9267 29.1625 19.887 29.1953C19.8472 29.228 19.7978 29.2468 19.7463 29.2487C19.6947 29.2565 19.642 29.2466 19.5967 29.2208C19.5513 29.1949 19.516 29.1546 19.4963 29.1062L14.4963 18.5612L20.5263 12.5312C20.6671 12.3905 20.7461 12.1996 20.7461 12.0006C20.7461 11.8016 20.6671 11.6107 20.5263 11.47C20.3856 11.3292 20.1947 11.2502 19.9957 11.2502C19.7967 11.2502 19.6058 11.3292 19.4651 11.47L13.4401 17.5L2.89384 12.5C2.84751 12.4784 2.8089 12.4431 2.78324 12.3989C2.75757 12.3547 2.74607 12.3037 2.7503 12.2527C2.75452 12.2018 2.77426 12.1533 2.80685 12.114C2.83945 12.0746 2.88333 12.0461 2.93259 12.0325H2.94634L26.9351 4.75997C26.9772 4.74813 27.0218 4.74793 27.0641 4.75937C27.1063 4.77081 27.1447 4.79348 27.1751 4.82497C27.2059 4.85583 27.2281 4.89422 27.2395 4.93632C27.251 4.97842 27.2511 5.02277 27.2401 5.06497H27.2351Z" fill="currentColor"/>
+  </svg>
+};
+
+export default PaperPlaneTilt;

package/src/Components/Icons/OfficeAndEditing/Paperclip/Paperclip.tsx

@@ -0,0 +1,37 @@
+import IconProps from "../../IconProps";
+
+const Paperclip = ({type}: IconProps) => {
+
+  if (type === 'thin') {
+    return <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path d="M25.8533 15.646C25.8998 15.6924 25.9367 15.7476 25.9618 15.8083C25.987 15.869 25.9999 15.9341 25.9999 15.9998C25.9999 16.0655 25.987 16.1305 25.9618 16.1912C25.9367 16.2519 25.8998 16.3071 25.8533 16.3535L15.5958 26.6035C14.3766 27.8225 12.7231 28.5073 10.9991 28.5072C9.27506 28.507 7.62167 27.8221 6.40267 26.6029C5.18367 25.3837 4.49891 23.7302 4.49902 22.0062C4.49914 20.2821 5.18413 18.6288 6.40329 17.4098L18.8145 4.81851C19.2323 4.40041 19.7283 4.0687 20.2743 3.8423C20.8203 3.6159 21.4055 3.49926 21.9965 3.49902C22.5876 3.49879 23.1729 3.61498 23.719 3.84095C24.2652 4.06691 24.7614 4.39824 25.1795 4.81601C25.5976 5.23378 25.9294 5.7298 26.1558 6.27577C26.3822 6.82173 26.4988 7.40695 26.499 7.99799C26.4993 8.58904 26.3831 9.17434 26.1571 9.72048C25.9311 10.2666 25.5998 10.7629 25.182 11.181L12.7695 23.7673C12.5375 23.9995 12.262 24.1838 11.9588 24.3096C11.6555 24.4354 11.3304 24.5003 11.0021 24.5004C10.6738 24.5006 10.3487 24.4361 10.0453 24.3106C9.7419 24.1852 9.4662 24.0012 9.23392 23.7691C9.00164 23.5371 8.81734 23.2616 8.69154 22.9583C8.56574 22.6551 8.5009 22.33 8.50073 22.0017C8.50056 21.6734 8.56505 21.3483 8.69053 21.0449C8.81601 20.7415 9.00002 20.4658 9.23204 20.2335L19.6433 9.64851C19.6889 9.59986 19.7438 9.56082 19.8047 9.53369C19.8656 9.50657 19.9313 9.4919 19.998 9.49056C20.0647 9.48922 20.131 9.50123 20.1929 9.52588C20.2549 9.55053 20.3113 9.58733 20.3588 9.63411C20.4063 9.68088 20.444 9.73669 20.4697 9.79825C20.4953 9.85982 20.5084 9.92588 20.5081 9.99257C20.5078 10.0593 20.4942 10.1252 20.468 10.1865C20.4419 10.2479 20.4037 10.3034 20.3558 10.3498L9.94204 20.9373C9.80252 21.0764 9.69175 21.2416 9.61608 21.4235C9.54041 21.6055 9.50132 21.8005 9.50103 21.9975C9.50074 22.1946 9.53926 22.3897 9.61439 22.5719C9.68953 22.754 9.7998 22.9196 9.93892 23.0591C10.078 23.1987 10.2433 23.3094 10.4252 23.3851C10.6071 23.4608 10.8022 23.4999 10.9992 23.5002C11.1962 23.5004 11.3914 23.4619 11.5736 23.3868C11.7557 23.3117 11.9213 23.2014 12.0608 23.0623L24.472 10.476C24.7973 10.1512 25.0554 9.76541 25.2316 9.3408C25.4078 8.9162 25.4986 8.46105 25.4989 8.00134C25.4992 7.54164 25.4089 7.08637 25.2333 6.66155C25.0576 6.23672 24.8 5.85065 24.4752 5.52538C24.1503 5.20012 23.7646 4.94202 23.34 4.76583C22.9154 4.58964 22.4602 4.4988 22.0005 4.49851C21.5408 4.49822 21.0855 4.58848 20.6607 4.76414C20.2359 4.93979 19.8498 5.1974 19.5245 5.52226L7.11329 18.1085C6.08127 19.1397 5.50116 20.5386 5.50057 21.9975C5.49998 23.4565 6.07897 24.8559 7.11017 25.8879C8.14136 26.9199 9.54029 27.5 10.9992 27.5006C12.4581 27.5012 13.8575 26.9222 14.8895 25.891L25.1395 15.641C25.1864 15.5939 25.2422 15.5566 25.3037 15.5313C25.3651 15.506 25.431 15.4932 25.4975 15.4937C25.5639 15.4942 25.6296 15.5079 25.6907 15.534C25.7518 15.5602 25.8071 15.5982 25.8533 15.646Z" fill="currentColor"/>
+    </svg>
+  }
+  if (type === 'regular') {
+    return <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path d="M26.2071 15.2924C26.3 15.3853 26.3738 15.4956 26.4241 15.617C26.4744 15.7384 26.5003 15.8685 26.5003 15.9999C26.5003 16.1313 26.4744 16.2614 26.4241 16.3828C26.3738 16.5042 26.3 16.6145 26.2071 16.7074L15.9508 26.9574C14.6378 28.2702 12.8571 29.0077 11.0004 29.0076C9.14363 29.0075 7.363 28.2698 6.05017 26.9568C4.73735 25.6438 3.99988 23.8631 4 22.0063C4.00012 20.1496 4.73781 18.369 6.0508 17.0561L18.4583 4.46615C19.3957 3.52778 20.6674 3.00022 21.9938 2.99951C23.3201 2.99881 24.5924 3.52503 25.5308 4.4624C26.4692 5.39977 26.9967 6.67152 26.9974 7.99787C26.9981 9.32422 26.4719 10.5965 25.5345 11.5349L13.1245 24.1249C12.561 24.6885 11.7966 25.0051 10.9995 25.0051C10.2025 25.0051 9.43813 24.6885 8.87455 24.1249C8.31096 23.5613 7.99435 22.7969 7.99435 21.9999C7.99435 21.2029 8.31096 20.4385 8.87455 19.8749L19.287 9.2974C19.3783 9.2001 19.488 9.12202 19.6099 9.06777C19.7317 9.01352 19.8632 8.98419 19.9965 8.98151C20.1298 8.97882 20.2624 9.00284 20.3863 9.05214C20.5102 9.10145 20.623 9.17504 20.7181 9.26859C20.8131 9.36215 20.8885 9.47377 20.9398 9.59689C20.9911 9.72002 21.0172 9.85215 21.0166 9.98552C21.0161 10.1189 20.9888 10.2508 20.9365 10.3735C20.8842 10.4962 20.8079 10.6072 20.712 10.6999L10.2983 21.2887C10.2051 21.3812 10.131 21.4911 10.0802 21.6122C10.0295 21.7334 10.0031 21.8633 10.0026 21.9947C10.002 22.126 10.0274 22.2562 10.0772 22.3777C10.1269 22.4992 10.2002 22.6098 10.2927 22.703C10.3852 22.7963 10.4951 22.8704 10.6163 22.9211C10.7374 22.9719 10.8674 22.9982 10.9987 22.9988C11.13 22.9993 11.2602 22.9739 11.3817 22.9242C11.5033 22.8744 11.6138 22.8012 11.707 22.7087L24.1158 10.1249C24.6794 9.56248 24.9965 8.7992 24.9973 8.00299C24.9981 7.20678 24.6826 6.44286 24.1202 5.87928C23.5577 5.31569 22.7945 4.99861 21.9983 4.99779C21.2021 4.99697 20.4381 5.31248 19.8745 5.8749L7.46955 18.4599C7.00483 18.9239 6.63606 19.4748 6.38427 20.0813C6.13249 20.6878 6.00263 21.338 6.0021 21.9947C6.00158 22.6514 6.13041 23.3017 6.38123 23.9086C6.63205 24.5155 6.99995 25.0671 7.46392 25.5318C7.9279 25.9965 8.47887 26.3653 9.08536 26.6171C9.69186 26.8688 10.342 26.9987 10.9987 26.9992C11.6554 26.9997 12.3057 26.8709 12.9126 26.6201C13.5195 26.3693 14.0711 26.0014 14.5358 25.5374L24.7933 15.2874C24.9815 15.1007 25.2361 14.9963 25.5012 14.9972C25.7663 14.9982 26.0202 15.1043 26.2071 15.2924Z" fill="currentColor"/>
+    </svg>
+  }
+  if (type === 'bold') {
+    return <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path d="M26.5597 17.0614L16.3022 27.3114C14.8953 28.7179 12.9872 29.5078 10.9978 29.5075C9.00839 29.5071 7.1006 28.7165 5.69412 27.3095C4.28765 25.9026 3.4977 23.9945 3.49805 22.0051C3.4984 20.0157 4.28903 18.1079 5.696 16.7014L17.966 4.46516C18.904 3.52762 20.1761 3.00111 21.5023 3.00147C22.159 3.00164 22.8092 3.13116 23.4159 3.38262C24.0225 3.63408 24.5737 4.00257 25.0379 4.46704C25.5021 4.9315 25.8703 5.48286 26.1214 6.08962C26.3726 6.69639 26.5017 7.34668 26.5016 8.00336C26.5014 8.66005 26.3719 9.31027 26.1204 9.9169C25.869 10.5235 25.5005 11.0747 25.036 11.5389L25.0147 11.5589L13.0397 23.0864C12.8978 23.223 12.7303 23.3303 12.5468 23.4021C12.3634 23.4739 12.1676 23.5089 11.9706 23.5051C11.7736 23.5013 11.5793 23.4587 11.3988 23.3798C11.2183 23.3009 11.0551 23.1872 10.9185 23.0452C10.7819 22.9032 10.6747 22.7357 10.6028 22.5522C10.531 22.3688 10.496 22.173 10.4998 21.976C10.5036 21.779 10.5462 21.5847 10.6251 21.4042C10.7041 21.2237 10.8178 21.0605 10.9597 20.9239L22.9235 9.40891C23.2975 9.03263 23.5066 8.52322 23.505 7.99272C23.5033 7.46223 23.291 6.95412 22.9147 6.58016C22.7284 6.395 22.5075 6.24834 22.2645 6.14857C22.0215 6.0488 21.7612 5.99787 21.4986 5.99868C20.9681 6.00032 20.46 6.21263 20.086 6.58891L7.816 18.8214C6.97211 19.6656 6.49816 20.8105 6.49839 22.0042C6.49851 22.5952 6.61504 23.1804 6.84133 23.7265C7.06762 24.2725 7.39924 24.7686 7.81725 25.1864C8.23526 25.6043 8.73149 25.9357 9.27758 26.1618C9.82368 26.3878 10.409 26.5041 11 26.504C12.1937 26.5038 13.3384 26.0294 14.1822 25.1852L24.4397 14.9352C24.5793 14.7956 24.7449 14.6849 24.9272 14.6094C25.1095 14.5339 25.3049 14.4951 25.5022 14.4951C25.6996 14.4951 25.895 14.5339 26.0773 14.6094C26.2596 14.6849 26.4252 14.7956 26.5647 14.9352C26.7043 15.0747 26.815 15.2403 26.8905 15.4226C26.966 15.6049 27.0049 15.8003 27.0049 15.9977C27.0049 16.195 26.966 16.3904 26.8905 16.5727C26.815 16.755 26.7043 16.9206 26.5647 17.0602L26.5597 17.0614Z" fill="currentColor"/>
+    </svg>
+  }
+  if (type === 'fill') {
+    return <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path d="M16 3C13.4288 3 10.9154 3.76244 8.77759 5.1909C6.63975 6.61935 4.97351 8.64968 3.98957 11.0251C3.00563 13.4006 2.74819 16.0144 3.2498 18.5362C3.75141 21.0579 4.98953 23.3743 6.80762 25.1924C8.6257 27.0105 10.9421 28.2486 13.4638 28.7502C15.9856 29.2518 18.5995 28.9944 20.9749 28.0104C23.3503 27.0265 25.3807 25.3603 26.8091 23.2224C28.2376 21.0846 29 18.5712 29 16C28.9964 12.5533 27.6256 9.24882 25.1884 6.81163C22.7512 4.37445 19.4467 3.00364 16 3ZM20.7075 9.2925C20.6146 9.19952 20.5043 9.12576 20.3829 9.07544C20.2615 9.02512 20.1314 8.99921 20 8.99921C19.8686 8.99921 19.7385 9.02512 19.6171 9.07544C19.4957 9.12576 19.3854 9.19952 19.2925 9.2925L10.8863 17.875C10.6072 18.1533 10.3857 18.4839 10.2344 18.8478C10.0831 19.2117 10.0049 19.6019 10.0044 19.996C10.0039 20.3902 10.081 20.7805 10.2313 21.1448C10.3817 21.5092 10.6023 21.8403 10.8806 22.1194C11.159 22.3984 11.4895 22.6199 11.8534 22.7712C12.2174 22.9226 12.6075 23.0007 13.0017 23.0012C13.3958 23.0017 13.7861 22.9246 14.1505 22.7743C14.5148 22.624 14.8459 22.4033 15.125 22.125L21.29 15.835C21.3811 15.7376 21.4907 15.6595 21.6124 15.6051C21.7341 15.5507 21.8655 15.5212 21.9988 15.5183C22.1321 15.5154 22.2646 15.5393 22.3885 15.5883C22.5125 15.6374 22.6254 15.7108 22.7205 15.8041C22.8157 15.8975 22.8913 16.0089 22.9428 16.1319C22.9942 16.2549 23.0206 16.3869 23.0203 16.5202C23.0201 16.6535 22.9931 16.7854 22.9411 16.9082C22.8891 17.0309 22.8131 17.1421 22.7175 17.235L16.5463 23.5325C16.0843 24.0057 15.5332 24.3827 14.9246 24.6414C14.316 24.9002 13.6621 25.0356 13.0009 25.04C12.3396 25.0443 11.684 24.9174 11.0721 24.6666C10.4602 24.4159 9.9041 24.0462 9.43603 23.5791C8.96797 23.1119 8.59722 22.5565 8.34526 21.9451C8.09331 21.3337 7.96514 20.6784 7.96818 20.0171C7.97122 19.3558 8.10542 18.7017 8.36299 18.0926C8.62057 17.4835 8.99641 16.9316 9.46876 16.4688L17.875 7.88625C18.1533 7.60719 18.4839 7.38568 18.8478 7.23438C19.2117 7.08307 19.6019 7.00492 19.996 7.0044C20.3902 7.00388 20.7805 7.08099 21.1448 7.23133C21.5092 7.38167 21.8403 7.6023 22.1194 7.88062C22.3984 8.15895 22.6199 8.48951 22.7713 8.85343C22.9226 9.21736 23.0007 9.60752 23.0012 10.0016C23.0018 10.3958 22.9246 10.7861 22.7743 11.1505C22.624 11.5148 22.4033 11.8459 22.125 12.125L13.7138 20.7C13.6227 20.7974 13.5131 20.8755 13.3914 20.9299C13.2696 20.9843 13.1383 21.0138 13.005 21.0167C12.8717 21.0196 12.7392 20.9957 12.6152 20.9467C12.4913 20.8976 12.3784 20.8242 12.2832 20.7309C12.188 20.6375 12.1125 20.5261 12.061 20.4031C12.0095 20.2801 11.9831 20.1481 11.9834 20.0148C11.9837 19.8815 12.0106 19.7496 12.0626 19.6268C12.1147 19.5041 12.1907 19.3929 12.2863 19.3L20.7 10.7137C20.7944 10.6213 20.8696 10.511 20.9211 10.3893C20.9726 10.2676 20.9995 10.1369 21.0002 10.0047C21.0009 9.87253 20.9754 9.74154 20.9251 9.6193C20.8749 9.49705 20.8009 9.38598 20.7075 9.2925Z" fill="currentColor"/>
+    </svg>
+  }
+  if (type === 'duotone') {
+    return <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path opacity="0.2" d="M22.5934 13.0937L25.4996 16L15.2421 26.2425C14.1138 27.3525 12.5926 27.9718 11.0097 27.9654C9.42693 27.9589 7.91077 27.3273 6.79154 26.2081C5.67231 25.0888 5.04067 23.5727 5.03423 21.9898C5.02778 20.407 5.64705 18.8858 6.75713 17.7575L19.1709 5.17122C19.9211 4.42099 20.9386 3.99951 21.9996 3.99951C23.0606 3.99951 24.0781 4.42099 24.8284 5.17122C25.5786 5.92145 26.0001 6.93898 26.0001 7.99997C26.0001 9.06096 25.5786 10.0785 24.8284 10.8287L22.5934 13.0937Z" fill="currentColor"/>
+      <path d="M26.2071 15.2924C26.3 15.3853 26.3738 15.4956 26.4241 15.617C26.4744 15.7384 26.5003 15.8685 26.5003 15.9999C26.5003 16.1313 26.4744 16.2614 26.4241 16.3828C26.3738 16.5042 26.3 16.6145 26.2071 16.7074L15.9508 26.9574C14.6378 28.2702 12.8571 29.0077 11.0004 29.0076C9.14363 29.0075 7.363 28.2698 6.05017 26.9568C4.73735 25.6438 3.99988 23.8631 4 22.0063C4.00012 20.1496 4.73781 18.369 6.0508 17.0561L18.4583 4.46615C19.3957 3.52778 20.6674 3.00022 21.9938 2.99951C23.3201 2.99881 24.5924 3.52503 25.5308 4.4624C26.4692 5.39977 26.9967 6.67152 26.9974 7.99787C26.9981 9.32422 26.4719 10.5965 25.5345 11.5349L13.1245 24.1249C12.561 24.6885 11.7966 25.0051 10.9995 25.0051C10.2025 25.0051 9.43813 24.6885 8.87455 24.1249C8.31096 23.5613 7.99435 22.7969 7.99435 21.9999C7.99435 21.2029 8.31096 20.4385 8.87455 19.8749L19.287 9.2974C19.3783 9.2001 19.488 9.12202 19.6099 9.06777C19.7317 9.01352 19.8632 8.98419 19.9965 8.98151C20.1298 8.97882 20.2624 9.00284 20.3863 9.05214C20.5102 9.10145 20.623 9.17504 20.7181 9.26859C20.8131 9.36215 20.8885 9.47377 20.9398 9.59689C20.9911 9.72002 21.0172 9.85215 21.0166 9.98552C21.0161 10.1189 20.9888 10.2508 20.9365 10.3735C20.8842 10.4962 20.8079 10.6072 20.712 10.6999L10.2983 21.2887C10.2051 21.3812 10.131 21.4911 10.0802 21.6122C10.0295 21.7334 10.0031 21.8633 10.0026 21.9947C10.002 22.126 10.0274 22.2562 10.0772 22.3777C10.1269 22.4992 10.2002 22.6098 10.2927 22.703C10.3852 22.7963 10.4951 22.8704 10.6163 22.9211C10.7374 22.9719 10.8674 22.9982 10.9987 22.9988C11.13 22.9993 11.2602 22.9739 11.3817 22.9242C11.5033 22.8744 11.6138 22.8012 11.707 22.7087L24.1158 10.1249C24.6794 9.56248 24.9965 8.7992 24.9973 8.00299C24.9981 7.20678 24.6826 6.44286 24.1202 5.87928C23.5577 5.31569 22.7945 4.99861 21.9983 4.99779C21.2021 4.99697 20.4381 5.31248 19.8745 5.8749L7.46955 18.4599C7.00483 18.9239 6.63606 19.4748 6.38427 20.0813C6.13249 20.6878 6.00263 21.338 6.0021 21.9947C6.00158 22.6514 6.13041 23.3017 6.38123 23.9086C6.63205 24.5155 6.99995 25.0671 7.46392 25.5318C7.9279 25.9965 8.47887 26.3653 9.08536 26.6171C9.69186 26.8688 10.342 26.9987 10.9987 26.9992C11.6554 26.9997 12.3057 26.8709 12.9126 26.6201C13.5195 26.3693 14.0711 26.0014 14.5358 25.5374L24.7933 15.2874C24.9815 15.1007 25.2361 14.9963 25.5012 14.9972C25.7663 14.9982 26.0202 15.1043 26.2071 15.2924Z" fill="currentColor"/>
+    </svg>
+  }
+
+  return <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+    <path d="M26.0316 15.4699C26.1014 15.5396 26.1567 15.6223 26.1944 15.7134C26.2322 15.8044 26.2516 15.902 26.2516 16.0006C26.2516 16.0991 26.2322 16.1967 26.1944 16.2878C26.1567 16.3788 26.1014 16.4615 26.0316 16.5312L15.7741 26.7812C14.5079 28.0469 12.7907 28.7578 11.0003 28.7575C9.20992 28.7571 7.49301 28.0456 6.22726 26.7793C4.96152 25.5131 4.25063 23.7959 4.25098 22.0055C4.25133 20.2151 4.96289 18.4982 6.22914 17.2324L18.6379 4.64244C19.0788 4.20112 19.6023 3.85096 20.1786 3.61196C20.7548 3.37296 21.3725 3.2498 21.9963 3.24951C22.6201 3.24922 23.2379 3.37181 23.8144 3.61027C24.3908 3.84874 24.9147 4.19841 25.356 4.63932C25.7973 5.08023 26.1475 5.60375 26.3865 6.17999C26.6255 6.75623 26.7487 7.3739 26.7489 7.99773C26.7492 8.62157 26.6266 9.23935 26.3882 9.81581C26.1497 10.3923 25.8 10.9161 25.3591 11.3574L12.9491 23.9424C12.694 24.1981 12.3909 24.401 12.0573 24.5396C11.7237 24.6781 11.3661 24.7496 11.0049 24.75C10.6437 24.7503 10.2859 24.6795 9.95208 24.5416C9.61823 24.4037 9.3148 24.2014 9.05914 23.9462C8.80347 23.691 8.60057 23.388 8.46201 23.0544C8.32346 22.7208 8.25196 22.3632 8.25162 22.002C8.25127 21.6408 8.32207 21.283 8.45998 20.9491C8.59789 20.6153 8.80021 20.3119 9.05539 20.0562L19.4654 9.47244C19.5345 9.40219 19.6168 9.34623 19.7075 9.30777C19.7982 9.2693 19.8957 9.24909 19.9942 9.24828C20.0927 9.24746 20.1905 9.26607 20.2818 9.30303C20.3732 9.33999 20.4564 9.39459 20.5266 9.46369C20.5969 9.5328 20.6529 9.61507 20.6913 9.70581C20.7298 9.79654 20.75 9.89396 20.7508 9.99251C20.7516 10.0911 20.733 10.1888 20.696 10.2801C20.6591 10.3715 20.6045 10.4547 20.5354 10.5249L10.1254 21.1137C10.009 21.2295 9.91657 21.3671 9.85336 21.5186C9.79016 21.6702 9.75741 21.8327 9.75701 21.9969C9.7566 22.161 9.78854 22.3237 9.85099 22.4755C9.91345 22.6274 10.0052 22.7654 10.121 22.8818C10.2368 22.9982 10.3744 23.0906 10.526 23.1538C10.6775 23.2171 10.84 23.2498 11.0042 23.2502C11.1684 23.2506 11.331 23.2187 11.4829 23.1562C11.6347 23.0938 11.7728 23.002 11.8891 22.8862L24.2941 10.2999C24.9041 9.69094 25.2472 8.86456 25.2479 8.0026C25.2486 7.14063 24.9069 6.31369 24.2979 5.70369C23.6889 5.0937 22.8625 4.75061 22.0005 4.7499C21.1386 4.7492 20.3116 5.09094 19.7016 5.69994L7.29164 18.2849C6.30636 19.2691 5.75237 20.6043 5.75155 21.9969C5.75073 23.3894 6.30314 24.7253 7.28726 25.7106C8.27138 26.6958 9.60659 27.2498 10.9992 27.2507C12.3917 27.2515 13.7276 26.6991 14.7129 25.7149L24.9704 15.4649C25.0404 15.3955 25.1233 15.3406 25.2146 15.3033C25.3058 15.266 25.4035 15.247 25.502 15.2475C25.6006 15.2479 25.6981 15.2678 25.789 15.306C25.8799 15.3442 25.9623 15.3999 26.0316 15.4699Z" fill="currentColor"/>
+  </svg>
+};
+
+export default Paperclip;

package/src/Components/Icons/SystemAndDevice/CheckCircle/CheckCircle.tsx

@@ -0,0 +1,35 @@
+import IconProps from "../../IconProps";
+
+const CheckCircle = ({type}: IconProps) => {
+  if (type === 'thin') {
+    return <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path d="M21.3538 12.6462C21.4002 12.6927 21.4371 12.7478 21.4623 12.8085C21.4874 12.8692 21.5004 12.9343 21.5004 13C21.5004 13.0657 21.4874 13.1308 21.4623 13.1915C21.4371 13.2522 21.4002 13.3073 21.3538 13.3538L14.3538 20.3538C14.3073 20.4002 14.2522 20.4371 14.1915 20.4623C14.1308 20.4874 14.0657 20.5004 14 20.5004C13.9343 20.5004 13.8692 20.4874 13.8085 20.4623C13.7478 20.4371 13.6927 20.4002 13.6463 20.3538L10.6463 17.3538C10.5524 17.2599 10.4997 17.1327 10.4997 17C10.4997 16.8673 10.5524 16.7401 10.6463 16.6462C10.7401 16.5524 10.8673 16.4997 11 16.4997C11.1327 16.4997 11.2599 16.5524 11.3538 16.6462L14 19.2925L20.6463 12.6462C20.6927 12.5998 20.7478 12.5629 20.8085 12.5377C20.8692 12.5126 20.9343 12.4996 21 12.4996C21.0657 12.4996 21.1308 12.5126 21.1915 12.5377C21.2522 12.5629 21.3073 12.5998 21.3538 12.6462ZM28.5 16C28.5 18.4723 27.7669 20.889 26.3934 22.9446C25.0199 25.0002 23.0676 26.6024 20.7835 27.5485C18.4995 28.4946 15.9861 28.7421 13.5614 28.2598C11.1366 27.7775 8.90933 26.587 7.16117 24.8388C5.41301 23.0907 4.2225 20.8634 3.74019 18.4386C3.25787 16.0139 3.50542 13.5005 4.45151 11.2165C5.39761 8.93238 6.99976 6.98015 9.05538 5.60663C11.111 4.23311 13.5277 3.5 16 3.5C19.3141 3.50364 22.4914 4.82177 24.8348 7.16518C27.1782 9.5086 28.4964 12.6859 28.5 16ZM27.5 16C27.5 13.7255 26.8255 11.5021 25.5619 9.61094C24.2983 7.71978 22.5022 6.24579 20.4009 5.37539C18.2995 4.50498 15.9872 4.27724 13.7565 4.72097C11.5257 5.1647 9.47658 6.25997 7.86828 7.86827C6.25997 9.47658 5.1647 11.5257 4.72097 13.7565C4.27724 15.9872 4.50498 18.2995 5.37539 20.4009C6.2458 22.5022 7.71978 24.2983 9.61095 25.5619C11.5021 26.8255 13.7255 27.5 16 27.5C19.049 27.4967 21.9721 26.284 24.1281 24.1281C26.284 21.9721 27.4967 19.049 27.5 16Z" fill="currentColor"/>
+    </svg>
+  }
+  if (type === 'regular') {
+    return <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path d="M21.7075 12.2925C21.8005 12.3854 21.8742 12.4957 21.9246 12.6171C21.9749 12.7385 22.0008 12.8686 22.0008 13C22.0008 13.1314 21.9749 13.2615 21.9246 13.3829C21.8742 13.5043 21.8005 13.6146 21.7075 13.7075L14.7075 20.7075C14.6146 20.8005 14.5043 20.8742 14.3829 20.9246C14.2615 20.9749 14.1314 21.0008 14 21.0008C13.8686 21.0008 13.7385 20.9749 13.6171 20.9246C13.4957 20.8742 13.3854 20.8005 13.2925 20.7075L10.2925 17.7075C10.1049 17.5199 9.99945 17.2654 9.99945 17C9.99945 16.7346 10.1049 16.4801 10.2925 16.2925C10.4801 16.1049 10.7346 15.9994 11 15.9994C11.2654 15.9994 11.5199 16.1049 11.7075 16.2925L14 18.5863L20.2925 12.2925C20.3854 12.1995 20.4957 12.1258 20.6171 12.0754C20.7385 12.0251 20.8686 11.9992 21 11.9992C21.1314 11.9992 21.2615 12.0251 21.3829 12.0754C21.5043 12.1258 21.6146 12.1995 21.7075 12.2925ZM29 16C29 18.5712 28.2376 21.0846 26.8091 23.2224C25.3807 25.3603 23.3503 27.0265 20.9749 28.0104C18.5995 28.9944 15.9856 29.2518 13.4638 28.7502C10.9421 28.2486 8.6257 27.0105 6.80762 25.1924C4.98953 23.3743 3.75141 21.0579 3.2498 18.5362C2.74819 16.0144 3.00563 13.4006 3.98957 11.0251C4.97351 8.64968 6.63975 6.61935 8.77759 5.1909C10.9154 3.76244 13.4288 3 16 3C19.4467 3.00364 22.7512 4.37445 25.1884 6.81163C27.6256 9.24882 28.9964 12.5533 29 16ZM27 16C27 13.8244 26.3549 11.6977 25.1462 9.88873C23.9375 8.07979 22.2195 6.66989 20.2095 5.83733C18.1995 5.00476 15.9878 4.78692 13.854 5.21136C11.7202 5.6358 9.76021 6.68345 8.22183 8.22183C6.68345 9.7602 5.63581 11.7202 5.21137 13.854C4.78693 15.9878 5.00477 18.1995 5.83733 20.2095C6.66989 22.2195 8.07979 23.9375 9.88873 25.1462C11.6977 26.3549 13.8244 27 16 27C18.9164 26.9967 21.7123 25.8367 23.7745 23.7745C25.8367 21.7123 26.9967 18.9164 27 16Z" fill="currentColor"/>
+    </svg>
+  }
+  if (type === 'bold') {
+    return <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path d="M22.0613 11.9388C22.2011 12.0781 22.312 12.2437 22.3878 12.426C22.4635 12.6083 22.5024 12.8038 22.5024 13.0013C22.5024 13.1987 22.4635 13.3942 22.3878 13.5765C22.312 13.7588 22.2011 13.9244 22.0613 14.0638L15.0613 21.0637C14.9219 21.2036 14.7563 21.3145 14.574 21.3903C14.3917 21.466 14.1962 21.5049 13.9988 21.5049C13.8013 21.5049 13.6059 21.466 13.4235 21.3903C13.2412 21.3145 13.0756 21.2036 12.9363 21.0637L9.93626 18.0637C9.79673 17.9242 9.68605 17.7586 9.61053 17.5763C9.53502 17.394 9.49615 17.1986 9.49615 17.0012C9.49615 16.8039 9.53502 16.6085 9.61053 16.4262C9.68605 16.2439 9.79673 16.0783 9.93626 15.9388C10.0758 15.7992 10.2414 15.6885 10.4237 15.613C10.606 15.5375 10.8014 15.4986 10.9988 15.4986C11.1961 15.4986 11.3915 15.5375 11.5738 15.613C11.7561 15.6885 11.9217 15.7992 12.0613 15.9388L14 17.875L19.9388 11.935C20.0783 11.7958 20.2439 11.6854 20.4262 11.6103C20.6084 11.5351 20.8037 11.4966 21.0008 11.4969C21.1979 11.4973 21.393 11.5365 21.575 11.6123C21.757 11.6881 21.9222 11.799 22.0613 11.9388ZM29.5 16C29.5 18.67 28.7082 21.2801 27.2248 23.5002C25.7414 25.7203 23.633 27.4506 21.1662 28.4724C18.6994 29.4942 15.985 29.7615 13.3663 29.2406C10.7475 28.7197 8.34207 27.434 6.45406 25.5459C4.56606 23.6579 3.28031 21.2525 2.7594 18.6337C2.2385 16.015 2.50585 13.3006 3.52763 10.8338C4.54942 8.36697 6.27974 6.25856 8.49981 4.77516C10.7199 3.29176 13.33 2.5 16 2.5C19.5792 2.50397 23.0107 3.92756 25.5416 6.45844C28.0724 8.98932 29.496 12.4208 29.5 16ZM26.5 16C26.5 13.9233 25.8842 11.8932 24.7304 10.1665C23.5767 8.4398 21.9368 7.09399 20.0182 6.29926C18.0996 5.50454 15.9884 5.29661 13.9516 5.70175C11.9148 6.1069 10.0438 7.10693 8.57538 8.57538C7.10693 10.0438 6.10691 11.9148 5.70176 13.9516C5.29662 15.9884 5.50455 18.0996 6.29927 20.0182C7.09399 21.9368 8.4398 23.5767 10.1665 24.7304C11.8932 25.8842 13.9233 26.5 16 26.5C18.7839 26.497 21.4529 25.3898 23.4213 23.4213C25.3898 21.4528 26.497 18.7839 26.5 16Z" fill="currentColor"/>
+    </svg>
+  }
+  if (type === 'fill') {
+    return <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path d="M16 3C13.4288 3 10.9154 3.76244 8.77759 5.1909C6.63975 6.61935 4.97351 8.64968 3.98957 11.0251C3.00563 13.4006 2.74819 16.0144 3.2498 18.5362C3.75141 21.0579 4.98953 23.3743 6.80762 25.1924C8.6257 27.0105 10.9421 28.2486 13.4638 28.7502C15.9856 29.2518 18.5995 28.9944 20.9749 28.0104C23.3503 27.0265 25.3807 25.3603 26.8091 23.2224C28.2376 21.0846 29 18.5712 29 16C28.9964 12.5533 27.6256 9.24882 25.1884 6.81163C22.7512 4.37445 19.4467 3.00364 16 3ZM21.7075 13.7075L14.7075 20.7075C14.6146 20.8005 14.5043 20.8742 14.3829 20.9246C14.2615 20.9749 14.1314 21.0008 14 21.0008C13.8686 21.0008 13.7385 20.9749 13.6171 20.9246C13.4957 20.8742 13.3854 20.8005 13.2925 20.7075L10.2925 17.7075C10.1049 17.5199 9.99945 17.2654 9.99945 17C9.99945 16.7346 10.1049 16.4801 10.2925 16.2925C10.4801 16.1049 10.7346 15.9994 11 15.9994C11.2654 15.9994 11.5199 16.1049 11.7075 16.2925L14 18.5863L20.2925 12.2925C20.3854 12.1996 20.4957 12.1259 20.6171 12.0756C20.7385 12.0253 20.8686 11.9994 21 11.9994C21.1314 11.9994 21.2615 12.0253 21.3829 12.0756C21.5043 12.1259 21.6146 12.1996 21.7075 12.2925C21.8004 12.3854 21.8741 12.4957 21.9244 12.6171C21.9747 12.7385 22.0006 12.8686 22.0006 13C22.0006 13.1314 21.9747 13.2615 21.9244 13.3829C21.8741 13.5043 21.8004 13.6146 21.7075 13.7075Z" fill="currentColor"/>
+    </svg>
+  }
+  if (type === 'duotone') {
+    return <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+      <path opacity="0.2" d="M28 16C28 18.3734 27.2962 20.6935 25.9776 22.6668C24.6591 24.6402 22.7849 26.1783 20.5922 27.0866C18.3995 27.9948 15.9867 28.2324 13.6589 27.7694C11.3312 27.3064 9.19295 26.1635 7.51472 24.4853C5.83649 22.8071 4.6936 20.6689 4.23058 18.3411C3.76756 16.0133 4.0052 13.6005 4.91345 11.4078C5.8217 9.21509 7.35977 7.34094 9.33316 6.02236C11.3066 4.70379 13.6266 4 16 4C19.1826 4 22.2348 5.26428 24.4853 7.51472C26.7357 9.76516 28 12.8174 28 16Z" fill="currentColor"/>
+      <path d="M21.7075 12.2925C21.8005 12.3854 21.8742 12.4957 21.9246 12.6171C21.9749 12.7385 22.0008 12.8686 22.0008 13C22.0008 13.1314 21.9749 13.2615 21.9246 13.3829C21.8742 13.5043 21.8005 13.6146 21.7075 13.7075L14.7075 20.7075C14.6146 20.8005 14.5043 20.8742 14.3829 20.9246C14.2615 20.9749 14.1314 21.0008 14 21.0008C13.8686 21.0008 13.7385 20.9749 13.6171 20.9246C13.4957 20.8742 13.3854 20.8005 13.2925 20.7075L10.2925 17.7075C10.1049 17.5199 9.99945 17.2654 9.99945 17C9.99945 16.7346 10.1049 16.4801 10.2925 16.2925C10.4801 16.1049 10.7346 15.9994 11 15.9994C11.2654 15.9994 11.5199 16.1049 11.7075 16.2925L14 18.5863L20.2925 12.2925C20.3854 12.1995 20.4957 12.1258 20.6171 12.0754C20.7385 12.0251 20.8686 11.9992 21 11.9992C21.1314 11.9992 21.2615 12.0251 21.3829 12.0754C21.5043 12.1258 21.6146 12.1995 21.7075 12.2925ZM29 16C29 18.5712 28.2376 21.0846 26.8091 23.2224C25.3807 25.3603 23.3503 27.0265 20.9749 28.0104C18.5995 28.9944 15.9856 29.2518 13.4638 28.7502C10.9421 28.2486 8.6257 27.0105 6.80762 25.1924C4.98953 23.3743 3.75141 21.0579 3.2498 18.5362C2.74819 16.0144 3.00563 13.4006 3.98957 11.0251C4.97351 8.64968 6.63975 6.61935 8.77759 5.1909C10.9154 3.76244 13.4288 3 16 3C19.4467 3.00364 22.7512 4.37445 25.1884 6.81163C27.6256 9.24882 28.9964 12.5533 29 16ZM27 16C27 13.8244 26.3549 11.6977 25.1462 9.88873C23.9375 8.07979 22.2195 6.66989 20.2095 5.83733C18.1995 5.00476 15.9878 4.78692 13.854 5.21136C11.7202 5.6358 9.76021 6.68345 8.22183 8.22183C6.68345 9.7602 5.63581 11.7202 5.21137 13.854C4.78693 15.9878 5.00477 18.1995 5.83733 20.2095C6.66989 22.2195 8.07979 23.9375 9.88873 25.1462C11.6977 26.3549 13.8244 27 16 27C18.9164 26.9967 21.7123 25.8367 23.7745 23.7745C25.8367 21.7123 26.9967 18.9164 27 16Z" fill="currentColor"/>
+    </svg>
+  }
+  return <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+    <path d="M21.53 12.47C21.6705 12.6106 21.7493 12.8012 21.7493 13C21.7493 13.1988 21.6705 13.3894 21.53 13.53L14.53 20.53C14.3894 20.6705 14.1988 20.7493 14 20.7493C13.8013 20.7493 13.6106 20.6705 13.47 20.53L10.47 17.53C10.3375 17.3878 10.2654 17.1998 10.2688 17.0055C10.2723 16.8112 10.351 16.6258 10.4884 16.4884C10.6258 16.351 10.8112 16.2723 11.0055 16.2688C11.1998 16.2654 11.3878 16.3375 11.53 16.47L14 18.9387L20.47 12.47C20.6106 12.3295 20.8013 12.2507 21 12.2507C21.1988 12.2507 21.3894 12.3295 21.53 12.47ZM28.75 16C28.75 18.5217 28.0022 20.9868 26.6012 23.0835C25.2003 25.1802 23.209 26.8144 20.8792 27.7795C18.5495 28.7445 15.9859 28.997 13.5126 28.505C11.0393 28.0131 8.76751 26.7987 6.98439 25.0156C5.20127 23.2325 3.98696 20.9607 3.49499 18.4874C3.00303 16.0141 3.25552 13.4505 4.22054 11.1208C5.18556 8.79103 6.81976 6.79975 8.91648 5.39876C11.0132 3.99777 13.4783 3.25 16 3.25C19.3803 3.25397 22.621 4.59854 25.0112 6.98877C27.4015 9.379 28.746 12.6197 28.75 16ZM27.25 16C27.25 13.775 26.5902 11.5999 25.354 9.74984C24.1179 7.89978 22.3609 6.45784 20.3052 5.60636C18.2495 4.75487 15.9875 4.53208 13.8052 4.96617C11.623 5.40025 9.6184 6.47171 8.04505 8.04505C6.47171 9.61839 5.40025 11.6229 4.96617 13.8052C4.53209 15.9875 4.75488 18.2495 5.60636 20.3052C6.45785 22.3609 7.89979 24.1179 9.74984 25.354C11.5999 26.5902 13.775 27.25 16 27.25C18.9827 27.2467 21.8422 26.0604 23.9513 23.9513C26.0604 21.8422 27.2467 18.9827 27.25 16Z" fill="currentColor"/>
+  </svg>
+};
+
+export default CheckCircle;

package/src/Components/Icons/index.ts

@@ -7,6 +7,7 @@ export { default as CaretRight } from './Arrows/CaretRight/CaretRight';
 export { default as CaretLeft } from './Arrows/CaretLeft/CaretLeft';
 export { default as CaretUpDown } from './Arrows/CaretUpDown/CaretUpDown.tsx';
 export { default as ArrowLeft } from './Arrows/ArrowLeft/ArrowLeft.tsx';
+export { default as ArrowRight } from './Arrows/ArrowRight/ArrowRight.tsx';
 export { default as ArrowsDownUp } from './Arrows/ArrowsDownUp/ArrowsDownUp.tsx';
 export { default as ArrowsOutCardinal } from './Arrows/ArrowsOutCardinal/ArrowsOutCardinal.tsx';
 export { default as CaretCircleRight } from './Arrows/CaretCircleRight/CaretCircleRight.tsx';
@@ -31,6 +32,7 @@ export { default as Phone } from './Communication/Phone/Phone.tsx';
 export { default as EnvelopeSimple } from './Communication/EnvelopeSimple/EnvelopeSimple.tsx';
 export { default as Export } from './Communication/Export/Export.tsx';
 export { default as ChatCircleText } from './Communication/ChatCircleText/ChatCircleText.tsx';
+export {default as PaperPlaneTilt} from './Communication/PaperPlaneTilt/PaperPlaneTilt.tsx';
 
 // Design
 export { default as Eye } from './Design/Eye/Eye';
@@ -96,7 +98,8 @@ export { default as FloppyDisk } from './OfficeAndEditing/FloppyDisk/FloppyDisk.
 export { default as Copy } from './OfficeAndEditing/Copy/Copy.tsx';
 export { default as Files } from './OfficeAndEditing/Files/Files.tsx';
 export { default as FileText } from './OfficeAndEditing/FileText/FileText.tsx';
-export { default as FolderSimplePlus } from './OfficeAndEditing/FolderSimplePlus/FolderSimplePlus.tsx'
+export { default as FolderSimplePlus } from './OfficeAndEditing/FolderSimplePlus/FolderSimplePlus.tsx';
+export { default as Paperclip } from './OfficeAndEditing/Paperclip/Paperclip.tsx';
 
 //People
 export { default as User } from './People/User/User.tsx';
@@ -138,6 +141,7 @@ export { default as ToggleLeft } from './SystemAndDevice/ToggleLeft/ToggleLeft.t
 export { default as CloudCheck } from './SystemAndDevice/CloudCheck/CloudCheck.tsx';
 export { default as DeviceMobile } from './SystemAndDevice/DeviceMobile/DeviceMobile.tsx';
 export { default as Desktop } from './SystemAndDevice/Desktop/Desktop.tsx';
+export { default as CheckCircle} from './SystemAndDevice/CheckCircle/CheckCircle.tsx';
 
 
 

package/src/Components/Layout/Footer/Footer.tsx

@@ -15,13 +15,12 @@ const Footer = (props: FooterProps) => {
         <footer className={`${styles.footer} ${extraClass}`}>
             {footerTop}
             {footerMiddle && <div className={styles.footerMiddle}>
-                <Container>
+                <Container border={false}>
                     <div className={styles.footerMiddleWrapper}>
                         <div className={styles.footerLogoContainer}>
                             <img src={logo} alt="" />
                         </div>
                         {footerMiddle}
-                        
                     </div>
                 </Container>
             </div>}

package/src/Components/Layout/Footer/FooterBottom.tsx

@@ -8,13 +8,13 @@ const FooterBottom = (props: FooterBottomProps) => {
     } = props
 
     return (
-        <div className={styles.footerBottom}>
-            <Container>
-                <div className={styles.footerBottomWrapper}>
-                    {children}
-                </div>
-            </Container>
-        </div>
+      <div className={styles.footerBottom}>
+        <Container border={false}>
+          <div className={styles.footerBottomWrapper}>
+              {children}
+          </div>
+          </Container>
+      </div>
     )
 }
 

package/src/Components/Layout/Footer/FooterProps.tsx

@@ -5,7 +5,7 @@ interface FooterProps {
     footerMiddle?: ReactNode
     footerBottom?: ReactNode
     extraClass?: string
-    logo?: string
+    logo?: string | undefined
 }
 
 export default FooterProps;

package/src/Components/Layout/Footer/FooterTop.tsx

@@ -8,7 +8,7 @@ const FooterTop = (props: FooterTopProps) => {
 
     return (
         <div className={styles.footerTop}>
-            <Container>
+            <Container border={false}>
                 <div className={styles.footerTopWrapper}>
                     <div className={styles.footerTopLeft}>
                         <h1>{title}</h1>

package/src/Components/Layout/Footer/footer.module.scss

@@ -58,7 +58,7 @@
       .footerItem {
         h3 {
           color: var(--color-taste);
-          font-size: var(--font-size-small);
+          font-size: 36px;
           font-weight: var(--font-weight-h4);
         }
 
@@ -192,7 +192,7 @@
           align-items: center;
 
           p {
-            font-size: var(--font-size-small);
+            font-size: var(--font-size-body-regular);
           }
         }
       }
@@ -244,6 +244,7 @@
 
         h3 {
           padding-bottom: 28px;
+          font-size: 18px !important;
           font-weight: var(--font-weight-body-sm);
         }
 

package/src/Components/Layout/Header/Header.stories.tsx

@@ -61,30 +61,30 @@ const HeaderTemplate: Story = {
         <HeaderRightItem extraClass={'desktop-item'}>
           <MagnifyingGlass/>
         </HeaderRightItem>
-        <HeaderRightItem extraClass={'mobile-item'}>
-          <List/>
-        </HeaderRightItem>
+        {/*<HeaderRightItem extraClass={'mobile-item'}>*/}
+        {/*  <List/>*/}
+        {/*</HeaderRightItem>*/}
       </HeaderRight>
-      <MobileNavigation>
-        <li>
-          <MobileNavigationItem label={'Attractions'}/>
-        </li>
-        <li>
-          <MobileNavigationItem label={'Eateries'}/>
-        </li>
-        <li>
-          <MobileNavigationItem label={'Accommodation'}/>
-        </li>
-        <li>
-          <MobileNavigationItem label={'Why visit Selwyn'}/>
-        </li>
-        <li>
-          <MobileNavigationItem label={'Events'}/>
-        </li>
-        <li>
-          <MobileNavigationItem label={'Venues'}/>
-        </li>
-      </MobileNavigation>
+      {/*<MobileNavigation>*/}
+      {/*  <li>*/}
+      {/*    <MobileNavigationItem label={'Attractions'}/>*/}
+      {/*  </li>*/}
+      {/*  <li>*/}
+      {/*    <MobileNavigationItem label={'Eateries'}/>*/}
+      {/*  </li>*/}
+      {/*  <li>*/}
+      {/*    <MobileNavigationItem label={'Accommodation'}/>*/}
+      {/*  </li>*/}
+      {/*  <li>*/}
+      {/*    <MobileNavigationItem label={'Why visit Selwyn'}/>*/}
+      {/*  </li>*/}
+      {/*  <li>*/}
+      {/*    <MobileNavigationItem label={'Events'}/>*/}
+      {/*  </li>*/}
+      {/*  <li>*/}
+      {/*    <MobileNavigationItem label={'Venues'}/>*/}
+      {/*  </li>*/}
+      {/*</MobileNavigation>*/}
     </Header>
   },
 };

package/src/Components/Layout/Header/Header.tsx

@@ -3,10 +3,10 @@ import HeaderProps from "./HeaderProps.tsx";
 import Container from "../../Shared/Container/Container.tsx";
 const Header = (props : HeaderProps) => {
 
-  const { children, logoSmall, logo } = props
+  const { children, logoSmall, logo, active } = props
 
-  return <header className={styles.header}>
-   <Container>
+  return <header className={`${styles.header} ${active ? styles.active : ''}`}>
+   <Container border={false}>
      <div className={styles.headerWrapper}>
        <div className={styles.headerLogo}>
          <div className={`${styles.logo} HeaderLogo`}>

package/src/Components/Layout/Header/HeaderProps.tsx

@@ -4,6 +4,7 @@ interface HeaderProps{
   children?:ReactNode
   logo?: ReactNode,
   logoSmall?: ReactNode,
+  active?:boolean
 }
 
 export default HeaderProps