@evershop/evershop 2.1.0 → 2.1.1

package/src/components/admin/Badge.scss

@@ -1,111 +0,0 @@
-.badge {
-  border-radius: 30px;
-  padding: 0.1rem 0.531rem;
-  font-size: 0.813rem;
-  display: inline-flex;
-  .title {
-    color: var(--text);
-    padding-left: 0.313rem;
-  }
-  .progress {
-    width: 0.625rem;
-    height: 0.625rem;
-    display: block;
-    align-self: center;
-    background-color: currentColor;
-    border-color: currentColor;
-    &.default {
-      width: 0 !important;
-      height: 0 !important;
-    }
-    &.partiallycomplete {
-      span {
-        background-color: currentColor;
-        display: block;
-        width: 100%;
-        height: 50%;
-      }
-    }
-    &.incomplete {
-      background-color: transparent !important;
-      border-width: 2px;
-    }
-  }
-  &.default {
-    color: #e4e5e7;
-    background-color: #e4e5e7;
-    .progress {
-      background-color: #5c5f62;
-      border-color: #5c5f62;
-      span {
-        border-color: inherit;
-      }
-    }
-  }
-  &.success {
-    color: #aee9d1;
-    background-color: #aee9d1;
-    .progress {
-      background-color: #007f5f;
-      border-color: #007f5f;
-      span {
-        border-color: inherit;
-      }
-    }
-  }
-  &.info {
-    color: #a4e8f2;
-    background-color: #a4e8f2;
-    .progress {
-      background-color: #00a0ac;
-      border-color: #00a0ac;
-      span {
-        border-color: inherit;
-      }
-    }
-  }
-  &.attention {
-    color: #ffea8a;
-    background-color: #ffea8a;
-    .progress {
-      background-color: #202223;
-      border-color: #202223;
-      span {
-        border-color: inherit;
-      }
-    }
-  }
-  &.critical {
-    color: #fed3d1;
-    background-color: #fed3d1;
-    .progress {
-      background-color: #d72c0d;
-      border-color: #d72c0d;
-      span {
-        border-color: inherit;
-      }
-    }
-  }
-  &.warning {
-    color: #ffd79d;
-    background-color: #ffd79d;
-    .progress {
-      background-color: #b98900;
-      border-color: #b98900;
-      span {
-        border-color: inherit;
-      }
-    }
-  }
-  &.new {
-    color: #e4e5e7;
-    background-color: #e4e5e7;
-    .progress {
-      background-color: #5c5f62;
-      border-color: #5c5f62;
-      span {
-        border-color: inherit;
-      }
-    }
-  }
-}

package/src/components/admin/Badge.tsx

@@ -1,49 +0,0 @@
-import React from 'react';
-import './Badge.scss';
-
-export type BadgeProps = {
-  title: string;
-  variant?:
-    | 'default'
-    | 'success'
-    | 'info'
-    | 'attention'
-    | 'critical'
-    | 'warning'
-    | 'new';
-  progress?: 'incomplete' | 'complete' | 'partiallycomplete' | 'default';
-};
-
-export function Badge({
-  title,
-  variant = 'default',
-  progress = 'default'
-}: BadgeProps) {
-  const badgeVariant = [
-    'default',
-    'success',
-    'info',
-    'attention',
-    'critical',
-    'warning',
-    'new'
-  ].includes(variant)
-    ? `${variant}`
-    : 'default';
-  const badgeProgress = [
-    'incomplete',
-    'complete',
-    'partiallycomplete',
-    'default'
-  ].includes(progress)
-    ? `${progress}`
-    : 'default';
-  return (
-    <span className={`${badgeVariant} badge`}>
-      <span className={`${badgeProgress} progress rounded-full`}>
-        {progress === 'partiallycomplete' && <span />}
-      </span>
-      <span className="self-center title">{title}</span>
-    </span>
-  );
-}

package/src/components/admin/Card.scss

@@ -1,38 +0,0 @@
-.card {
-  background-color: white;
-  border-radius: 6px;
-  &.subdued {
-    background-color: #fafbfb;
-  }
-}
-.card-title {
-  font-size: 1rem;
-  font-weight: 600;
-}
-.card-header {
-  padding: 1.25rem;
-}
-.card-section {
-  border-color: var(--divider);
-  padding: 1.25rem;
-  > .card-section {
-    padding: 0;
-  }
-}
-.card .card-section:last-child {
-  border-bottom: none;
-}
-.card-header + .card-section {
-  padding-top: 0;
-}
-.card-session-title {
-  font-size: 0.75rem;
-  text-transform: uppercase;
-  font-weight: 600;
-}
-.card-session-title + .card-session-content {
-  padding-top: 0.531rem;
-}
-.card-action a:hover {
-  text-decoration: underline;
-}

package/src/components/admin/Card.tsx

@@ -1,130 +0,0 @@
-import React from 'react';
-
-import './Card.scss';
-
-export interface CardProps {
-  title?: string | React.ReactNode;
-  actions?: Array<{
-    onAction?: () => void;
-    variant?: 'primary' | 'secondary' | 'critical' | 'interactive';
-    name: string;
-  }>;
-  subdued?: boolean;
-  children: React.ReactNode;
-}
-
-function Card({ title, actions = [], subdued = false, children }: CardProps) {
-  return (
-    <div className={subdued ? 'card shadow subdued' : 'card shadow'}>
-      {(title || actions.length > 0) && (
-        <div className="flex justify-between card-header">
-          {title && <h2 className="card-title">{title}</h2>}
-          {actions.length > 0 && (
-            <div className="flex space-x-2">
-              {actions.map((action, index) => {
-                const className = {
-                  primary: 'text-primary',
-                  critical: 'text-critical',
-                  interactive: 'text-interactive',
-                  secondary: 'text-secondary'
-                };
-                return (
-                  <div key={index} className="card-action">
-                    <a
-                      href="#"
-                      onClick={(e) => {
-                        e.preventDefault();
-                        if (action.onAction) action.onAction.call(null);
-                      }}
-                      className={
-                        className[
-                          action.variant ? action.variant : 'interactive'
-                        ]
-                      }
-                    >
-                      {action.name}
-                    </a>
-                  </div>
-                );
-              })}
-            </div>
-          )}
-        </div>
-      )}
-      {children}
-    </div>
-  );
-}
-
-Card.defaultProps = {
-  actions: [],
-  subdued: false,
-  title: ''
-};
-
-export interface CardSessionProps {
-  actions?: Array<{
-    onAction?: () => void;
-    variant?: 'primary' | 'secondary' | 'critical' | 'interactive';
-    name: string;
-  }>;
-  title?: string | React.ReactNode;
-  children: React.ReactNode;
-}
-
-const Session = function Session({
-  actions = [],
-  title,
-  children
-}: CardSessionProps) {
-  return (
-    <div className="card-section border-b box-border">
-      {(title || actions.length > 0) && (
-        <div className="flex justify-between card-section-header mb-2">
-          {title && <h3 className="card-session-title">{title}</h3>}
-          {actions.length > 0 && (
-            <div className="flex space-x-2">
-              {actions.map((action, index) => {
-                const className = {
-                  primary: 'text-primary',
-                  critical: 'text-critical',
-                  interactive: 'text-interactive',
-                  secondary: 'text-secondary'
-                };
-                return (
-                  <div key={index} className="card-action">
-                    <a
-                      href="#"
-                      onClick={(e) => {
-                        e.preventDefault();
-                        if (action.onAction) action.onAction.call(null);
-                      }}
-                      className={
-                        className[
-                          action.variant ? action.variant : 'interactive'
-                        ]
-                      }
-                    >
-                      {action.name}
-                    </a>
-                  </div>
-                );
-              })}
-            </div>
-          )}
-        </div>
-      )}
-      <div className="card-session-content pt-lg">{children}</div>
-    </div>
-  );
-};
-
-Session.defaultProps = {
-  actions: [],
-  title: '',
-  children: null
-};
-
-Card.Session = Session;
-
-export { Card };

package/src/components/admin/CategorySelector.scss

@@ -1,23 +0,0 @@
-.category-list-skeleton {
-  width: 100%;
-
-  .category-skeleton-item {
-    padding: 0.625rem 0;
-  }
-
-  .skeleton-pulse {
-    animation: skeletonPulse 1.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;
-  }
-}
-
-@keyframes skeletonPulse {
-  0% {
-    opacity: 0.6;
-  }
-  50% {
-    opacity: 0.8;
-  }
-  100% {
-    opacity: 0.6;
-  }
-}

package/src/components/admin/Circle.scss

@@ -1,90 +0,0 @@
-.circle {
-  border-radius: 100%;
-  display: inline-flex;
-  border: 4px solid;
-  span {
-    border: 2px solid;
-    border-radius: 100%;
-    display: block;
-    width: 1.125rem;
-    height: 1.125rem;
-    display: flex;
-    justify-content: center;
-    span {
-      display: block;
-      width: 40%;
-      height: 40%;
-      align-self: center;
-    }
-  }
-  &.default {
-    color: #e4e5e7;
-    border-color: #e4e5e7;
-    span {
-      border-color: #5c5f62;
-      span {
-        background-color: #5c5f62;
-      }
-    }
-  }
-  &.success {
-    color: #aee9d1;
-    border-color: #aee9d1;
-    span {
-      border-color: #007f5f;
-      span {
-        background-color: #007f5f;
-      }
-    }
-  }
-  &.info {
-    color: #a4e8f2;
-    border-color: #a4e8f2;
-    span {
-      border-color: #00a0ac;
-      span {
-        background-color: #00a0ac;
-      }
-    }
-  }
-  &.attention {
-    color: #ffea8a;
-    border-color: #ffea8a;
-    span {
-      border-color: #202223;
-      span {
-        background-color: #202223;
-      }
-    }
-  }
-  &.critical {
-    color: #fed3d1;
-    border-color: #fed3d1;
-    span {
-      border-color: #d72c0d;
-      span {
-        background-color: #d72c0d;
-      }
-    }
-  }
-  &.warning {
-    color: #ffd79d;
-    border-color: #ffd79d;
-    span {
-      border-color: #b98900;
-      span {
-        background-color: #b98900;
-      }
-    }
-  }
-  &.new {
-    color: #e4e5e7;
-    border-color: #e4e5e7;
-    span {
-      border-color: #5c5f62;
-      span {
-        background-color: #5c5f62;
-      }
-    }
-  }
-}

package/src/components/admin/Circle.tsx

@@ -1,36 +0,0 @@
-import React from 'react';
-import './Circle.scss';
-
-export type CircleVariant =
-  | 'default'
-  | 'success'
-  | 'info'
-  | 'attention'
-  | 'critical'
-  | 'warning'
-  | 'new';
-
-export interface CircleProps {
-  variant: CircleVariant;
-}
-
-export function Circle({ variant = 'default' }: CircleProps) {
-  const circleVariant = [
-    'default',
-    'success',
-    'info',
-    'attention',
-    'critical',
-    'warning',
-    'new'
-  ].includes(variant)
-    ? `${variant}`
-    : 'default';
-  return (
-    <span className={`${circleVariant} circle`}>
-      <span className="self-center">
-        <span />
-      </span>
-    </span>
-  );
-}

package/src/components/admin/CollectionSelector.scss

@@ -1,23 +0,0 @@
-.collection-list-skeleton {
-  width: 100%;
-
-  .collection-skeleton-item {
-    padding: 0.625rem 0;
-  }
-
-  .skeleton-pulse {
-    animation: skeletonPulse 1.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;
-  }
-}
-
-@keyframes skeletonPulse {
-  0% {
-    opacity: 0.6;
-  }
-  50% {
-    opacity: 0.8;
-  }
-  100% {
-    opacity: 0.6;
-  }
-}

package/src/components/admin/Dot.scss

@@ -1,32 +0,0 @@
-.dot {
-  border-radius: 100%;
-  display: inline-block;
-  &.default {
-    color: #e4e5e7;
-    background-color: #e4e5e7;
-  }
-  &.success {
-    color: #aee9d1;
-    background-color: #aee9d1;
-  }
-  &.info {
-    color: #a4e8f2;
-    background-color: #a4e8f2;
-  }
-  &.attention {
-    color: #ffea8a;
-    background-color: #ffea8a;
-  }
-  &.critical {
-    color: #fed3d1;
-    background-color: #fed3d1;
-  }
-  &.warning {
-    color: #ffd79d;
-    background-color: #ffd79d;
-  }
-  &.new {
-    color: #e4e5e7;
-    background-color: #e4e5e7;
-  }
-}

package/src/components/admin/Dot.tsx

@@ -1,35 +0,0 @@
-import React from 'react';
-import './Dot.scss';
-
-export type DotProps = {
-  size?: string;
-  variant?:
-    | 'default'
-    | 'primary'
-    | 'success'
-    | 'info'
-    | 'attention'
-    | 'critical'
-    | 'warning'
-    | 'new';
-};
-
-export function Dot({ size = '1rem', variant = 'primary' }: DotProps) {
-  const dotVariant = [
-    'default',
-    'success',
-    'info',
-    'attention',
-    'critical',
-    'warning',
-    'new'
-  ].includes(variant)
-    ? `${variant}`
-    : 'default';
-  return (
-    <span
-      className={`${dotVariant} dot`}
-      style={{ width: size, height: size }}
-    />
-  );
-}

package/src/components/admin/ProductListSkeleton.scss

@@ -1,23 +0,0 @@
-.product-list-skeleton {
-  width: 100%;
-
-  .product-skeleton-item {
-    padding: 0.625rem 0;
-  }
-
-  .skeleton-pulse {
-    animation: skeletonPulse 1.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;
-  }
-}
-
-@keyframes skeletonPulse {
-  0% {
-    opacity: 0.6;
-  }
-  50% {
-    opacity: 0.8;
-  }
-  100% {
-    opacity: 0.6;
-  }
-}

package/src/components/admin/SettingMenu.scss

@@ -1,8 +0,0 @@
-.setting-page-menu {
-  .card-section-header {
-    a:hover {
-      color: var(--interactive);
-      text-decoration: underline;
-    }
-  }
-}

package/src/components/admin/grid/Filter.scss

@@ -1,39 +0,0 @@
-.filter-container {
-  display: flex;
-  flex-direction: column;
-  gap: 0.625rem;
-  position: relative;
-}
-
-.filter-container button {
-  background: none;
-  border-bottom: 1px solid #ccc;
-  color: var(--color-text);
-  font-size: 0.938rem;
-  text-align: left;
-  font-size: 12px;
-  padding: 0 5px;
-  text-transform: capitalize;
-}
-
-.filter-container ul {
-  list-style: none;
-  padding: 10px;
-  position: absolute;
-  background: white;
-  border: 1px solid #ccc;
-  border-radius: 0.313rem;
-  box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.1);
-  z-index: 1;
-  top: 100%;
-  left: 0;
-  width: max-content;
-}
-
-.filter-container ul li {
-  padding: 3px 5px;
-  text-transform: capitalize;
-  &:hover {
-    background: #f9f9f9;
-  }
-}