@sikka/hawa 0.2.16-beta → 0.2.18-beta

package/src/blocks/Misc/NotFound.tsx

@@ -1,39 +0,0 @@
-import React, { FC } from "react"
-import { Card, CardContent } from "../../elements/Card"
-import { Button } from "../../elements/Button"
-
-type NotFoundTypes = {
-  variant?: "outlined" | "contained" | "neobrutalism"
-  texts?: {
-    pageNotFound?: string
-    ifLost?: string
-    home?: string
-  }
-}
-
-export const NotFound: FC<NotFoundTypes> = ({
-  variant = "contained",
-  texts,
-}) => {
-  return (
-    <Card>
-      <CardContent headless>
-        <div className="flex flex-col items-center dark:text-white">
-          <div className="text-center text-6xl font-bold ">404</div>
-          <div className="m-2 text-center text-xl font-bold ">
-            {texts?.pageNotFound ?? "Page Not Found"}
-          </div>
-          <div className="mb-4 text-center">
-            {texts?.ifLost ?? (
-              <>
-                If you're lost please contact us{" "}
-                <span className="clickable-link">help@sikka.io</span>
-              </>
-            )}
-          </div>
-          <Button className="w-full">{texts?.home ?? "Home"}</Button>
-        </div>
-      </CardContent>
-    </Card>
-  )
-}

package/src/blocks/Misc/Testimonial.tsx

@@ -1,47 +0,0 @@
-import React, { FC } from "react"
-import { Card, CardContent } from "../../elements/Card"
-
-type TEmptyState = {
-  variant?: "outlined" | "contained" | "neobrutalism"
-}
-
-export const Testimonial: FC<TEmptyState> = (props) => {
-  return (
-    <Card>
-      <CardContent headless>
-        <div>
-          <p className="mb-4 max-w-sm">
-            The team at Sikka Software is simply amazing. The tech is easy to
-            follow, easy to work with, and infinitely flexible. The solution
-            opportunities created by Tines are endless.
-          </p>
-        </div>
-        <div className="flex flex-row gap-4">
-          <svg width="48" height="48" viewBox="0 0 48 48" fill="none">
-            <rect width="48" height="48" rx="24" fill="#45BE8B"></rect>
-            <path
-              d="M14.1412 22.4427L17.5803 16.5199C17.7671 16.1981 18.1112 16 18.4834 16H20.8581C21.653 16 22.1565 16.8528 21.7725 17.5488L19.3042 22.0225C19.2202 22.1747 19.1762 22.3458 19.1762 22.5196C19.1762 23.0879 19.6369 23.5486 20.2052 23.5486H21.5827C22.1594 23.5486 22.627 24.0162 22.627 24.5929V31.347C22.627 31.9237 22.1594 32.3913 21.5827 32.3913H15.0443C14.4676 32.3913 14 31.9237 14 31.347V22.9671C14 22.7829 14.0487 22.602 14.1412 22.4427Z"
-              fill="#FFFFFF"
-            ></path>
-            <path
-              d="M25.356 22.4427L28.7951 16.5199C28.982 16.1981 29.326 16 29.6982 16H32.0729C32.8679 16 33.3713 16.8528 32.9873 17.5488L30.5191 22.0225C30.4351 22.1747 30.391 22.3458 30.391 22.5196C30.391 23.0879 30.8518 23.5486 31.4201 23.5486H32.7975C33.3743 23.5486 33.8418 24.0162 33.8418 24.5929V31.347C33.8418 31.9237 33.3743 32.3913 32.7975 32.3913H26.2592C25.6824 32.3913 25.2148 31.9237 25.2148 31.347V22.9671C25.2148 22.7829 25.2636 22.602 25.356 22.4427Z"
-              fill="#FFFFFF"
-            ></path>
-          </svg>
-          <span className="border border-l "></span>{" "}
-          <div>
-            <strong>Brent Lassi</strong>
-            <div> Chief Information Security Officer</div>
-          </div>
-          {/* <div>
-          <img
-            src="https://www.datocms-assets.com/55802/1636449069-bluecore-logo-dark.svg"
-            title="Logo of Brent Lassi"
-            alt="Logo of Brent Lassi"
-          />
-        </div> */}
-        </div>
-      </CardContent>
-    </Card>
-  )
-}

package/src/blocks/Misc/index.ts

@@ -1,6 +0,0 @@
-export * from "./NotFound"
-export * from "./EmptyState"
-export * from "./Testimonial"
-export * from "./LeadGenerator"
-export * from "./Announcement"
-export * from "./NoPermission"

package/src/blocks/Payment/ChargeWalletForm.tsx

@@ -1,79 +0,0 @@
-import React, { useState, FC } from "react"
-import { Card, CardContent } from "../../elements/Card"
-import { Button } from "../../elements/Button"
-import { Input } from "../../elements/Input"
-
-type ChargeWalletTypes = {
-  currency: any
-  handleChargeWallet: any
-  texts: {
-    amountLabel: string
-    amountRequired: string
-    chargeWallet: string
-  }
-}
-export const ChargeWalletForm: FC<ChargeWalletTypes> = (props) => {
-  const [walletAmount, setWalletAmount] = useState(0)
-
-  return (
-    <Card>
-      <CardContent headless>
-        <div className="p-4 text-center">
-          <div className=" text-5xl font-extrabold">
-            {Number(walletAmount).toLocaleString("en") || "0"}
-          </div>
-          <div className="text-sm font-normal">{props.currency || "SAR"}</div>
-        </div>
-        <div className="mb-2 flex w-full flex-col gap-4 text-center">
-          <div className="mb-2 flex w-full flex-row gap-4 text-center">
-            <Button variant="outline" className="h-full w-full">
-              10 SAR
-            </Button>
-            <Button variant="outline" className="h-full w-full">
-              50 SAR
-            </Button>
-            <Button variant="outline" className="h-full w-full">
-              100 SAR
-            </Button>
-          </div>
-
-          <Input placeholder="Custom Amount" type="number" name="amount" />
-        </div>
-        {/* <FormProvider {...methods}>
-        <form onSubmit={handleSubmit(props.handleChargeWallet)}>
-          <Controller
-            control={control}
-            name="amount"
-            render={({ field }) => (
-              <HawaTextField
-                width="full"
-                placeholder={props.texts.amountLabel}
-                type="number"
-                {...field}
-                value={field.value ?? ""}
-                inputProps={{
-                  inputMode: "numeric",
-                  min: "1",
-                  max: "9999999",
-                  step: "0.01",
-                }}
-                onChange={(e: any) => {
-                  field.onChange(parseFloat(e.target.value))
-                  setWalletAmount(e.target.value)
-                }}
-                helpertext={errors.amount?.message}
-              />
-            )}
-            rules={{
-              required: props.texts.amountRequired,
-            }}
-          />
-
-      
-          </form>
-        </FormProvider> */}
-        <Button className="mt-6 w-full">{props.texts.chargeWallet}</Button>
-      </CardContent>
-    </Card>
-  )
-}

package/src/blocks/Payment/CheckoutForm.tsx

@@ -1,265 +0,0 @@
-import React, { FC } from "react"
-import { HawaTextField, HawaTable, HawaSelect } from "../../elements"
-import { Controller, FormProvider, useForm } from "react-hook-form"
-import countries from "../../countries"
-import {
-  Card,
-  CardContent,
-  CardFooter,
-  CardHeader,
-  CardTitle,
-} from "../../elements/Card"
-import { Button } from "../../elements/Button"
-
-type CheckoutFormTypes = {
-  lang: string
-  products: any
-  total: any
-  handlePayNow: any
-  countriesList: any
-  texts: {
-    orderDetails: string
-    billingAddress: string
-    payNow: string
-    emailLabel: string
-    emailRequiredText: string
-    emailInvalidText: string
-    firstNameLabel: string
-    required: string
-    lastNameLabel: string
-    streetAddressLabel: string
-    buildingNumberLabel: string
-    cityLabel: string
-    stateLabel: string
-    countryLabel: string
-    zipCodeLabel: string
-  }
-}
-
-export const CheckoutForm: FC<CheckoutFormTypes> = (props) => {
-  let isArabic = props.lang === "ar"
-  const methods = useForm()
-  const {
-    formState: { errors },
-    handleSubmit,
-    register,
-    control,
-  } = methods
-
-  let containerStyle = {
-    display: "flex",
-    padding: 0,
-    paddingRight: "0px !important",
-    paddingLeft: "0px !important",
-    flexDirection: {
-      xs: "column",
-      sm: "row",
-      md: "row",
-      lg: "row",
-      xl: "row",
-    },
-  }
-  return (
-    <Card>
-      <CardHeader>
-        <CardTitle>{props.texts.orderDetails}</CardTitle>
-      </CardHeader>
-      <CardContent>
-        <div>
-          <div className="rounded border border-gray-300">
-            <HawaTable
-              pagination={false}
-              direction={isArabic ? "rtl" : "ltr"}
-              columns={[
-                { hidden: false, value: "Product" },
-                { hidden: true, value: "ID" },
-                { hidden: false, value: "Price" },
-              ]}
-              borders="inner"
-              rows={props.products}
-              bordersWidth="1"
-            />
-          </div>
-        </div>
-      </CardContent>
-      <CardHeader>
-        <CardTitle>{props.texts.billingAddress}</CardTitle>
-      </CardHeader>
-      <form onSubmit={handleSubmit(props.handlePayNow)}>
-        <CardContent>
-          <div>
-            <FormProvider {...methods}>
-              <div>
-                <Controller
-                  control={control}
-                  name="firstName"
-                  rules={{ required: props.texts?.required }}
-                  render={({ field }) => (
-                    <HawaTextField
-                      type="text"
-                      label={props.texts?.firstNameLabel + " *"}
-                      helpertext={errors.firstName?.message}
-                      {...field}
-                      value={field.value ?? ""}
-                    />
-                  )}
-                />
-                <div style={{ width: 20 }} />
-
-                <Controller
-                  control={control}
-                  name="lastName"
-                  rules={{ required: props.texts?.required }}
-                  render={({ field }) => (
-                    <HawaTextField
-                      width="full"
-                      type="text"
-                      label={props.texts?.lastNameLabel + " *"}
-                      helpertext={errors.lastName?.message}
-                      {...field}
-                      value={field.value ?? ""}
-                    />
-                  )}
-                />
-              </div>
-              <Controller
-                control={control}
-                name="email"
-                render={({ field }) => (
-                  <HawaTextField
-                    width="full"
-                    type="text"
-                    label={props.texts?.emailLabel + " *"}
-                    helpertext={errors.email?.message}
-                    {...field}
-                    value={field.value ?? ""}
-                  />
-                )}
-                rules={{
-                  required: props.texts?.emailRequiredText,
-                  pattern: {
-                    value:
-                      /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/,
-                    message: props.texts?.emailInvalidText,
-                  },
-                }}
-              />
-              <div className="flex flex-col md:flex-row">
-                <Controller
-                  control={control}
-                  name="streetAddress"
-                  rules={{ required: props.texts?.required }}
-                  render={({ field }) => (
-                    <HawaTextField
-                      width="full"
-                      type="text"
-                      label={props.texts?.streetAddressLabel + " *"}
-                      helpertext={errors.streetAddress?.message}
-                      {...field}
-                      value={field.value ?? ""}
-                    />
-                  )}
-                />
-              </div>
-
-              <div className="flex flex-col md:flex-row">
-                <Controller
-                  control={control}
-                  name="province"
-                  rules={{ required: props.texts?.required }}
-                  render={({ field }) => (
-                    <HawaTextField
-                      width="full"
-                      type="text"
-                      label={props.texts?.stateLabel + " *"}
-                      helpertext={errors.province?.message}
-                      {...field}
-                      value={field.value ?? ""}
-                    />
-                  )}
-                />
-                <div style={{ width: 20 }} />
-
-                <Controller
-                  control={control}
-                  name="city"
-                  rules={{ required: props.texts?.required }}
-                  render={({ field }) => (
-                    <HawaTextField
-                      width="full"
-                      type="text"
-                      label={props.texts?.cityLabel + " *"}
-                      helpertext={errors.city?.message}
-                      {...field}
-                      value={field.value ?? ""}
-                    />
-                  )}
-                />
-              </div>
-              <div className="flex flex-col md:flex-row">
-                <Controller
-                  control={control}
-                  name="buildingNumber"
-                  rules={{ required: props.texts?.required }}
-                  render={({ field }) => (
-                    <HawaTextField
-                      width="full"
-                      type="text"
-                      label={props.texts?.buildingNumberLabel + " *"}
-                      helpertext={errors.buildingNumber?.message}
-                      {...field}
-                      value={field.value ?? ""}
-                    />
-                  )}
-                />
-                <div style={{ width: 20 }} />
-                <Controller
-                  control={control}
-                  name="zipCode"
-                  rules={{ required: props.texts?.required }}
-                  render={({ field }) => (
-                    <HawaTextField
-                      width="full"
-                      type="number"
-                      label={props.texts?.zipCodeLabel + " *"}
-                      helpertext={errors.zipCode?.message}
-                      {...field}
-                      value={field.value ?? ""}
-                    />
-                  )}
-                />
-                {/* <div style={{ width: 20 }} /> */}
-              </div>
-              <div className="mb-3">
-                <Controller
-                  control={control}
-                  name="country"
-                  rules={{ required: props.texts?.required }}
-                  render={({ field }) => (
-                    <HawaSelect
-                      native
-                      label={props.texts?.countryLabel + " *"}
-                      helperText={errors.country?.message}
-                      options={countries}
-                      getOptionLabel={(countries) => countries.country_label}
-                      onChange={(e) => field.onChange(e.country_label)}
-                      value={field.value ?? ""}
-                    >
-                      <option></option>
-                      {props.countriesList.map((country: any, i: any) => (
-                        <option key={i}>{country}</option>
-                      ))}
-                    </HawaSelect>
-                  )}
-                />
-              </div>
-            </FormProvider>
-          </div>
-        </CardContent>
-        <CardFooter>
-          <Button className="w-full">{props.texts.payNow}</Button>
-        </CardFooter>{" "}
-      </form>
-    </Card>
-  )
-}

package/src/blocks/Payment/Confirmation.tsx

@@ -1,96 +0,0 @@
-import React, { FC } from "react"
-import { Card, CardContent } from "../../elements/Card"
-import { Button } from "../../elements/Button"
-
-type ConfirmationPageTypes = {
-  texts: {
-    print: string
-    history: string
-    homePage: string
-    successMessage: string
-    orderDetails: string
-    fasterPaymentNote: string
-    yourOrderNumber: string
-    emailLabel: string
-    emailRequiredText: string
-    emailInvalidText: string
-    firstNameLabel: string
-    required: string
-    lastNameLabel: string
-    streetAddressLabel: string
-    buildingNumberLabel: string
-    cityLabel: string
-    stateLabel: string
-    countryLabel: string
-    zipCodeLabel: string
-    refundPolicy: string
-  }
-  products: any
-  countriesList: any
-  lang: string
-  total: string
-  userEmail: string
-  orderNumber: string
-  confirmationTitle: string
-  handleHome: any
-  handlePrint: any
-  handleHistory: any
-  handleRefundPolicyLink: any
-}
-
-export const ConfirmationPage: FC<ConfirmationPageTypes> = (props) => {
-  let isArabic = props.lang === "ar"
-
-  return (
-    <Card>
-      <CardContent headless>
-        {" "}
-        <div className="py-5 text-center text-3xl font-bold dark:text-white">
-          {props.confirmationTitle}
-        </div>
-        <div className="py-5 dark:text-white">
-          <div className="mb-2 text-center">
-            {props.texts.successMessage} <strong>{props.userEmail}</strong>
-          </div>
-          <div className="text-center">{props.texts.yourOrderNumber}</div>
-          <div className="text-center font-bold">{props.orderNumber}</div>
-        </div>
-        {/* <div className="py-5">
-        <div className="mb-3 text-center text-xl font-semibold">
-          {props.texts.orderDetails}
-        </div>
-        {props.products && (
-          <HawaTable
-            direction={isArabic ? "rtl" : "ltr"}
-            columns={[
-              { hidden: false, value: "Product" },
-              { hidden: false, value: "Price" },
-            ]}
-            rows={props.products}
-          />
-        )}
-      </div> */}
-        <div className="flex flex-col items-center justify-center gap-4 py-5 pt-0">
-          <Button className="w-full" onClick={props.handlePrint}>
-            {props.texts.print}
-          </Button>
-          <Button className="w-full" onClick={props.handleHistory}>
-            {props.texts.history}
-          </Button>
-          <Button className="w-full" onClick={props.handleHome}>
-            {props.texts.homePage}
-          </Button>
-          <div className=" text-center text-sm dark:text-white">
-            {props.texts.fasterPaymentNote}
-          </div>
-          <a
-            className="clickable-link text-xs"
-            onClick={props.handleRefundPolicyLink}
-          >
-            {props.texts.refundPolicy}
-          </a>
-        </div>
-      </CardContent>
-    </Card>
-  )
-}