Update translation file creation date and add new dependencies in pnpm-lock.yaml

- Updated POT-Creation-Date in codeideal-open-fields.pot to 2026-02-24T12:22:57+00:00.
- Added '@wordpress/i18n' dependency with version 6.13.0.
- Introduced several '@Tannin' packages with their respective versions.
- Updated dependencies for '@wordpress/hooks' and '@wordpress/i18n'.
- Added new packages including 'gettext-parser', 'encoding', and 'memize' with their dependencies.

Author: novincode

admin/src/App.tsx

@@ -111,7 +111,7 @@ function MainLayout({ initialTab }: MainLayoutProps) {
 	];
 
 	return (
-		<div className="openfields-main-layout -ml-5 -mr-2.5">
+		<div className="openfields-main-layout -ms-5 -me-2.5">
 			{/* Header */}
 			<header className="bg-white border-b border-gray-200 px-4 sm:px-6 py-4">
 				<div className="flex flex-col sm:flex-row sm:items-center justify-between gap-4">

admin/src/components/ui/alert-dialog.tsx

@@ -49,7 +49,7 @@ const AlertDialogHeader = ({
 }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
     className={cn(
-      "flex flex-col space-y-2 text-center sm:text-left",
+      "flex flex-col space-y-2 text-center sm:text-start",
       className
     )}
     {...props}

admin/src/components/ui/async-combobox.tsx

@@ -179,11 +179,11 @@ export function AsyncCombobox({
       return (
         <div className="flex flex-wrap gap-1">
           {selectedValues.map(val => (
-            <Badge key={val} variant="secondary" className="pr-1">
+            <Badge key={val} variant="secondary" className="pe-1">
               {getLabel(val)}
               <button
                 type="button"
-                className="ml-1 rounded-full hover:bg-muted"
+                className="ms-1 rounded-full hover:bg-muted"
                 onClick={(e) => handleRemove(e, val)}
               >
                 <X className="h-3 w-3" />
@@ -212,7 +212,7 @@ export function AsyncCombobox({
           )}
         >
           {renderTriggerContent()}
-          <div className="flex items-center gap-1 shrink-0 ml-2">
+          <div className="flex items-center gap-1 shrink-0 ms-2">
             {clearable && selectedValues.length > 0 && (
               <X
                 className="h-4 w-4 opacity-50 hover:opacity-100 cursor-pointer"
@@ -235,7 +235,7 @@ export function AsyncCombobox({
           <CommandList>
             {loading && (
               <div className="flex items-center justify-center py-6 text-sm text-muted-foreground">
-                <Loader2 className="h-4 w-4 animate-spin mr-2" />
+                <Loader2 className="h-4 w-4 animate-spin me-2" />
                 {loadingText}
               </div>
             )}
@@ -256,13 +256,13 @@ export function AsyncCombobox({
                   >
                     <Check
                       className={cn(
-                        "mr-2 h-4 w-4",
+                        "me-2 h-4 w-4",
                         selectedValues.includes(option.value)
                           ? "opacity-100"
                           : "opacity-0"
                       )}
                     />
-                    {option.icon && <span className="mr-2">{option.icon}</span>}
+                    {option.icon && <span className="me-2">{option.icon}</span>}
                     <div className="flex flex-col">
                       <span>{option.label}</span>
                       {option.description && (

admin/src/components/ui/command.tsx

@@ -38,7 +38,7 @@ const CommandInput = React.forwardRef<
   React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>
 >(({ className, ...props }, ref) => (
   <div className="flex items-center border-b px-3" cmdk-input-wrapper="">
-    <Search className="mr-2 h-4 w-4 shrink-0 opacity-50" />
+    <Search className="me-2 h-4 w-4 shrink-0 opacity-50" />
     <CommandPrimitive.Input
       ref={ref}
       className={cn(

admin/src/components/ui/dialog.tsx

@@ -44,7 +44,7 @@ const DialogContent = React.forwardRef<
       {...props}
     >
       {children}
-      <DialogPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
+      <DialogPrimitive.Close className="absolute end-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
         <X className="h-4 w-4" />
         <span className="sr-only">Close</span>
       </DialogPrimitive.Close>
@@ -59,7 +59,7 @@ const DialogHeader = ({
 }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
     className={cn(
-      "flex flex-col space-y-1.5 text-center sm:text-left",
+      "flex flex-col space-y-1.5 text-center sm:text-start",
       className
     )}
     {...props}

admin/src/components/ui/drawer.tsx

@@ -58,7 +58,7 @@ const DrawerHeader = ({
   ...props
 }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
-    className={cn("grid gap-1.5 p-4 text-center sm:text-left", className)}
+    className={cn("grid gap-1.5 p-4 text-center sm:text-start", className)}
     {...props}
   />
 )

admin/src/components/ui/scroll-area.tsx

@@ -31,7 +31,7 @@ const ScrollBar = React.forwardRef<
     className={cn(
       "flex touch-none select-none transition-colors",
       orientation === "vertical" &&
-        "h-full w-2.5 border-l border-l-transparent p-[1px]",
+        "h-full w-2.5 border-s border-s-transparent p-[1px]",
       orientation === "horizontal" &&
         "h-2.5 flex-col border-t border-t-transparent p-[1px]",
       className

admin/src/components/ui/select.tsx

@@ -103,7 +103,7 @@ const SelectLabel = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SelectPrimitive.Label
     ref={ref}
-    className={cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className)}
+    className={cn("py-1.5 ps-8 pe-2 text-sm font-semibold", className)}
     {...props}
   />
 ))
@@ -116,12 +116,12 @@ const SelectItem = React.forwardRef<
   <SelectPrimitive.Item
     ref={ref}
     className={cn(
-      "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 ps-8 pe-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
       className
     )}
     {...props}
   >
-    <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
+    <span className="absolute start-2 flex h-3.5 w-3.5 items-center justify-center">
       <SelectPrimitive.ItemIndicator>
         <Check className="h-4 w-4" />
       </SelectPrimitive.ItemIndicator>

admin/src/components/ui/toast.tsx

@@ -14,7 +14,7 @@ const ToastViewport = React.forwardRef<
 	<ToastPrimitives.Viewport
 		ref={ref}
 		className={cn(
-			'fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]',
+			'fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:end-0 sm:top-auto sm:flex-col md:max-w-[420px]',
 			className
 		)}
 		{...props}
@@ -23,7 +23,7 @@ const ToastViewport = React.forwardRef<
 ToastViewport.displayName = ToastPrimitives.Viewport.displayName;
 
 const toastVariants = cva(
-	'group pointer-events-auto relative flex w-full items-center justify-between space-x-2 overflow-hidden rounded-md border p-4 pr-6 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full',
+	'group pointer-events-auto relative flex w-full items-center justify-between space-x-2 overflow-hidden rounded-md border p-4 pe-6 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full',
 	{
 		variants: {
 			variant: {
@@ -75,7 +75,7 @@ const ToastClose = React.forwardRef<
 	<ToastPrimitives.Close
 		ref={ref}
 		className={cn(
-			'absolute right-1 top-1 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-1 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600',
+			'absolute end-1 top-1 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-1 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600',
 			className
 		)}
 		toast-close=""

admin/src/fields/SelectFieldSettings.tsx

@@ -150,7 +150,7 @@ export function SelectFieldSettings({ field, onSettingsChange }: FieldSettingsPr
 						onClick={handleAddChoice}
 						className="w-full mt-2"
 					>
-						<Plus className="h-3 w-3 mr-1" />{__('Add Choice', 'codeideal-open-fields')}</Button>
+						<Plus className="h-3 w-3 me-1" />{__('Add Choice', 'codeideal-open-fields')}</Button>
 				</div>
 			</div>