feat(dashboard,types,js-sdk,ui): Tax Regions UI (#7935)

packages/admin-next/dashboard/src/components/common/condition-block/condition-block.tsx

@@ -1,59 +0,0 @@
-import { PropsWithChildren, createContext } from "react"
-
-type ConditionOperator =
-  | "eq"
-  | "ne"
-  | "gt"
-  | "lt"
-  | "gte"
-  | "lte"
-  | "in"
-  | "nin"
-
-type ConditionBlockValue<TValue> = {
-  attribute: string
-  operator: ConditionOperator
-  value: TValue
-}
-
-type ConditionBlockState<TValue> = {
-  defaultValue?: ConditionBlockValue<TValue>
-  value?: ConditionBlockValue<TValue>
-  onChange: (value: ConditionBlockValue<TValue>) => void
-}
-
-const ConditionBlockContext = createContext<ConditionBlockState<any> | null>(
-  null
-)
-
-const useConditionBlock = () => {
-  const context = ConditionBlockContext
-
-  if (!context) {
-    throw new Error("useConditionBlock must be used within a ConditionBlock")
-  }
-
-  return context
-}
-
-type ConditionBlockProps<TValue> = PropsWithChildren<
-  ConditionBlockState<TValue>
->
-
-const Root = <TValue,>({ children, ...props }: ConditionBlockProps<TValue>) => {
-  return (
-    <ConditionBlockContext.Provider value={props}>
-      {children}
-    </ConditionBlockContext.Provider>
-  )
-}
-
-const Divider = () => {}
-
-const Operator = () => {}
-
-const Item = () => {}
-
-export const ConditionBlock = Object.assign(Root, {
-  Divider,
-})

packages/admin-next/dashboard/src/components/common/icon-avatar/icon-avatar.tsx

@@ -3,6 +3,7 @@ import { PropsWithChildren } from "react"
 
 type IconAvatarProps = PropsWithChildren<{
   className?: string
+  size?: "small" | "large" | "xlarge"
 }>
 
 /**
@@ -10,12 +11,24 @@ type IconAvatarProps = PropsWithChildren<{
  *
  * The `<Avatar/>` component from `@medusajs/ui` does not support passing an icon as a child.
  */
-export const IconAvatar = ({ children, className }: IconAvatarProps) => {
+export const IconAvatar = ({
+  size = "small",
+  children,
+  className,
+}: IconAvatarProps) => {
   return (
     <div
       className={clx(
-        "shadow-borders-base bg-ui-bg-base flex size-7 items-center justify-center rounded-md",
-        "[&>div]:bg-ui-bg-field [&>div]:text-ui-fg-subtle [&>div]:flex [&>div]:size-6 [&>div]:items-center [&>div]:justify-center [&>div]:rounded-[4px]",
+        "shadow-borders-base flex size-7 items-center justify-center",
+        "[&>div]:bg-ui-bg-field [&>div]:text-ui-fg-subtle [&>div]:flex [&>div]:size-6 [&>div]:items-center [&>div]:justify-center",
+        {
+          "size-7 rounded-md [&>div]:size-6 [&>div]:rounded-[4px]":
+            size === "small",
+          "size-10 rounded-lg [&>div]:size-9 [&>div]:rounded-[6px]":
+            size === "large",
+          "size-12 rounded-xl [&>div]:size-11 [&>div]:rounded-[10px]":
+            size === "xlarge",
+        },
         className
       )}
     >

packages/admin-next/dashboard/src/components/common/skeleton/skeleton.tsx

@@ -136,6 +136,23 @@ export const GeneralSectionSkeleton = ({
   )
 }
 
+export const TableFooterSkeleton = ({ layout }: { layout: "fill" | "fit" }) => {
+  return (
+    <div
+      className={clx("flex items-center justify-between p-4", {
+        "border-t": layout === "fill",
+      })}
+    >
+      <Skeleton className="h-7 w-[138px]" />
+      <div className="flex items-center gap-x-2">
+        <Skeleton className="h-7 w-24" />
+        <Skeleton className="h-7 w-11" />
+        <Skeleton className="h-7 w-11" />
+      </div>
+    </div>
+  )
+}
+
 type TableSkeletonProps = {
   rowCount?: number
   search?: boolean
@@ -182,20 +199,7 @@ export const TableSkeleton = ({
           <Skeleton key={row} className="h-10 w-full rounded-none" />
         ))}
       </div>
-      {pagination && (
-        <div
-          className={clx("flex items-center justify-between p-4", {
-            "border-t": layout === "fill",
-          })}
-        >
-          <Skeleton className="h-7 w-[138px]" />
-          <div className="flex items-center gap-x-2">
-            <Skeleton className="h-7 w-24" />
-            <Skeleton className="h-7 w-11" />
-            <Skeleton className="h-7 w-11" />
-          </div>
-        </div>
-      )}
+      {pagination && <TableFooterSkeleton layout={layout} />}
     </div>
   )
 }