@ikas/component-cli 0.133.0 → 1.1.0

package/templates/create-full/src/components/ProductSlider/styles.css

@@ -1,105 +0,0 @@
-/* ===== Product Slider Section ===== */
-.kombos-product-slider {
-  box-sizing: border-box;
-  width: 100%;
-  max-width: 100%;
-  overflow: hidden;
-}
-
-.kombos-product-slider__wrapper {
-  padding-top: 1rem;
-  padding-bottom: 1rem;
-  display: flex;
-  flex-direction: column;
-  gap: 1.5rem;
-}
-
-.kombos-product-slider__title {
-  color: var(--kombos-gray-900);
-}
-
-/* Slider wrapper */
-.kombos-product-slider__slider {
-  position: relative;
-  overflow: hidden;
-}
-
-/* Scrollable track */
-.kombos-product-slider__track {
-  display: flex;
-  gap: 1rem;
-  width: 100%;
-  overflow-x: auto;
-  scroll-snap-type: x mandatory;
-  -webkit-overflow-scrolling: touch;
-  scrollbar-width: none;
-}
-
-.kombos-product-slider__track::-webkit-scrollbar {
-  display: none;
-}
-
-/* Card sizing — mobile: 2 columns, desktop: driven by --columns */
-.kombos-product-slider__card {
-  flex: 0 0 calc((100% - 1rem) / 2);
-  min-width: 0;
-  scroll-snap-align: start;
-  display: flex;
-  flex-direction: column;
-  gap: 0.5rem;
-}
-
-.kombos-product-slider__card-content {
-  display: flex;
-  flex-direction: column;
-  gap: 0.5rem;
-}
-
-/* Navigation arrows */
-.kombos-product-slider__arrow {
-  position: absolute;
-  top: 50%;
-  transform: translateY(-50%);
-  z-index: var(--kombos-z-dropdown);
-}
-
-.kombos-product-slider__arrow--left {
-  left: 0.5rem;
-}
-
-.kombos-product-slider__arrow--right {
-  right: 0.5rem;
-}
-
-/* ===== Tablet (>=768px) ===== */
-@media (min-width: 768px) {
-  .kombos-product-slider__wrapper {
-    padding-top: 1.5rem;
-    padding-bottom: 1.5rem;
-  }
-}
-
-/* ===== Desktop (>=1024px) ===== */
-@media (min-width: 1024px) {
-  .kombos-product-slider__wrapper {
-    padding-top: 2rem;
-    padding-bottom: 2rem;
-    gap: 2rem;
-  }
-
-  .kombos-product-slider__track {
-    gap: 1.5rem;
-  }
-
-  .kombos-product-slider__card {
-    flex: 0 0 calc((100% - (var(--columns) - 1) * 1.5rem) / var(--columns));
-  }
-
-  .kombos-product-slider__arrow--left {
-    left: 1rem;
-  }
-
-  .kombos-product-slider__arrow--right {
-    right: 1rem;
-  }
-}

package/templates/create-full/src/components/ProductSlider/types.ts

@@ -1,17 +0,0 @@
-// This file is auto-generated — do not edit manually.
-import type { IkasProductList } from "@ikas/bp-storefront";
-import type { AspectRatio, NumberOfColumns, ObjectFit } from "../../global-types";
-
-export interface Props {
-  productList: IkasProductList;
-  title?: string;
-  addToCartText?: string;
-  addedToCartText?: string;
-  outOfStockText?: string;
-  goToProductText?: string;
-  desktopColumns?: NumberOfColumns;
-  aspectRatio?: AspectRatio;
-  objectFit?: ObjectFit;
-  hideAddToCartButton?: boolean;
-  components?: any;
-}

package/templates/create-full/src/components/RecoverPassword/components/RecoverPasswordForm/index.tsx

@@ -1,133 +0,0 @@
-import {
-  getRecoverPasswordForm,
-  setRecoverPasswordFormPassword,
-  setRecoverPasswordFormPasswordAgain,
-  submitRecoverPasswordForm,
-  Router,
-} from "@ikas/bp-storefront";
-import { observer } from "@ikas/component-utils";
-
-import { Props } from "../../types";
-import Button from "../../../../sub-components/Button";
-import Input from "../../../../sub-components/Input";
-import FormItem from "../../../../sub-components/FormItem";
-
-interface RecoverPasswordFormProps extends Omit<Props, "backgroundColor"> {
-  recoverForm: ReturnType<typeof getRecoverPasswordForm>;
-}
-
-const RecoverPasswordForm = observer(function RecoverPasswordForm({
-  recoverForm,
-  title = "Change Password",
-  subtitle = "Please set your new password.",
-  passwordLabel = "New Password",
-  passwordPlaceholder = "Password",
-  passwordAgainLabel = "Confirm New Password",
-  passwordAgainPlaceholder = "Password",
-  submitButtonText = "Change",
-  submittingButtonText = "Changing...",
-  successMessage = "Your password has been successfully changed.",
-  loginLinkText = "Sign In",
-}: RecoverPasswordFormProps) {
-  const handleSubmit = async (e: Event) => {
-    e.preventDefault();
-    const success = await submitRecoverPasswordForm(recoverForm);
-    if (success) {
-      Router.navigateToPage("LOGIN");
-    }
-  };
-
-  return (
-    <div className="recover-password__container">
-      <div className="recover-password__header">
-        <h1 className="recover-password__title text-xl-medium md:display-xs-medium">{title}</h1>
-        <p className="recover-password__subtitle text-sm-regular">{subtitle}</p>
-      </div>
-
-      {recoverForm.isSuccess && (
-        <div className="recover-password__success-banner text-sm-regular">
-          {successMessage}
-        </div>
-      )}
-
-      {recoverForm.isFailure && recoverForm.responseMessage && (
-        <div className="recover-password__error-banner text-sm-regular">
-          {recoverForm.responseMessage}
-        </div>
-      )}
-
-      {!recoverForm.isSuccess && (
-        <form className="recover-password__form" onSubmit={handleSubmit}>
-          <FormItem
-            label={passwordLabel}
-            htmlFor="recover-password"
-            status={recoverForm.password?.hasError ? "error" : "default"}
-            helper={
-              recoverForm.password?.hasError
-                ? recoverForm.password.message
-                : undefined
-            }
-          >
-            <Input
-              id="recover-password"
-              password
-              placeholder={passwordPlaceholder}
-              value={recoverForm.password?.value ?? ""}
-              onInput={(e: Event) =>
-                setRecoverPasswordFormPassword(
-                  recoverForm,
-                  (e.target as HTMLInputElement).value,
-                )
-              }
-            />
-          </FormItem>
-
-          <FormItem
-            label={passwordAgainLabel}
-            htmlFor="recover-password-again"
-            status={recoverForm.passwordAgain?.hasError ? "error" : "default"}
-            helper={
-              recoverForm.passwordAgain?.hasError
-                ? recoverForm.passwordAgain.message
-                : undefined
-            }
-          >
-            <Input
-              id="recover-password-again"
-              password
-              placeholder={passwordAgainPlaceholder}
-              value={recoverForm.passwordAgain?.value ?? ""}
-              onInput={(e: Event) =>
-                setRecoverPasswordFormPasswordAgain(
-                  recoverForm,
-                  (e.target as HTMLInputElement).value,
-                )
-              }
-            />
-          </FormItem>
-
-          <Button
-            variant="primary"
-            size="s"
-            className="recover-password__submit-btn"
-            disabled={recoverForm.isSubmitting}
-          >
-            {recoverForm.isSubmitting ? submittingButtonText : submitButtonText}
-          </Button>
-        </form>
-      )}
-
-      <div className="recover-password__footer">
-        <button
-          type="button"
-          className="recover-password__login-link text-sm-medium"
-          onClick={() => Router.navigateToPage("LOGIN")}
-        >
-          {loginLinkText}
-        </button>
-      </div>
-    </div>
-  );
-});
-
-export default RecoverPasswordForm;

package/templates/create-full/src/components/RecoverPassword/index.tsx

@@ -1,30 +0,0 @@
-import {
-  customerStore,
-  getRecoverPasswordForm,
-  initRecoverPasswordForm,
-} from "@ikas/bp-storefront";
-import { useRedirectIfLoggedIn } from "../../hooks/useRedirectIfLoggedIn";
-
-import { Props } from "./types";
-import RecoverPasswordForm from "./components/RecoverPasswordForm";
-import PageLoader from "../../sub-components/PageLoader";
-
-export function RecoverPassword(props: Props) {
-  const recoverForm = getRecoverPasswordForm(customerStore);
-
-  const isChecking = useRedirectIfLoggedIn(() => {
-    initRecoverPasswordForm(recoverForm);
-  });
-
-  if (isChecking) return <PageLoader />;
-
-  return (
-    <section className="recover-password">
-      <div className="recover-password__wrapper kombos-container">
-        <RecoverPasswordForm recoverForm={recoverForm} {...props} />
-      </div>
-    </section>
-  );
-}
-
-export default RecoverPassword;

package/templates/create-full/src/components/RecoverPassword/styles.css

@@ -1,93 +0,0 @@
-.recover-password {
-  width: 100%;
-}
-
-.recover-password__wrapper {
-  display: flex;
-  justify-content: center;
-  align-items: flex-start;
-  padding-top: 1rem;
-  padding-bottom: 1rem;
-}
-
-.recover-password__container {
-  width: 100%;
-  max-width: 29rem;
-  display: flex;
-  flex-direction: column;
-  gap: 2rem;
-}
-
-.recover-password__header {
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-  text-align: center;
-}
-
-.recover-password__title {
-  color: var(--kombos-gray-900);
-  margin: 0;
-}
-
-.recover-password__subtitle {
-  color: var(--kombos-gray-700);
-  margin: 0;
-}
-
-.recover-password__success-banner {
-  padding: 0.75rem 1rem;
-  background: rgba(18, 183, 106, 0.08);
-  border: 1px solid var(--kombos-success);
-  border-radius: 6px;
-  color: var(--kombos-success);
-}
-
-.recover-password__error-banner {
-  padding: 0.75rem 1rem;
-  background: rgba(255, 60, 72, 0.08);
-  border: 1px solid var(--kombos-error);
-  border-radius: 6px;
-  color: var(--kombos-error);
-}
-
-.recover-password__form {
-  display: flex;
-  flex-direction: column;
-  gap: 1.5rem;
-}
-
-.recover-password__submit-btn {
-  width: 100%;
-}
-
-.recover-password__footer {
-  text-align: center;
-}
-
-.recover-password__login-link {
-  background: none;
-  border: none;
-  padding: 0;
-  color: var(--kombos-gray-700);
-  cursor: pointer;
-  text-decoration: underline;
-}
-
-.recover-password__login-link:hover {
-  color: var(--kombos-gray-900);
-}
-
-@media (min-width: 768px) {
-  .recover-password__wrapper {
-    padding-top: 1.5rem;
-    padding-bottom: 1.5rem;
-  }
-}
-
-@media (min-width: 1024px) {
-  .recover-password__wrapper {
-    padding-top: 2rem;
-    padding-bottom: 2rem;
-  }
-}

package/templates/create-full/src/components/RecoverPassword/types.ts

@@ -1,13 +0,0 @@
-// This file is auto-generated — do not edit manually.
-export interface Props {
-  title?: string;
-  subtitle?: string;
-  passwordLabel?: string;
-  passwordPlaceholder?: string;
-  passwordAgainLabel?: string;
-  passwordAgainPlaceholder?: string;
-  submitButtonText?: string;
-  submittingButtonText?: string;
-  successMessage?: string;
-  loginLinkText?: string;
-}