@stacksjs/defaults 0.70.54

package/resources/components/Dashboard/Settings/Forms/FileSystemForm.stx

@@ -0,0 +1,259 @@
+<script>
+interface FileSystemFormProps {
+  defaultDisk?: string
+  localDriver?: string
+  localRoot?: string
+  publicDriver?: string
+  publicRoot?: string
+  privateDriver?: string
+  privateRoot?: string
+  efsDriver?: string
+  efsRoot?: string
+  s3Driver?: string
+  s3Root?: string
+  publicVisibility?: boolean
+  privateVisibility?: boolean
+}
+
+const { defaultDisk = 'local', localDriver = 'local', localRoot = 'storage', publicDriver = 'public', publicRoot = 'storage/public', privateDriver = 'private', privateRoot = 'storage/private', efsDriver = 'local', efsRoot = '/mnt/efs', s3Driver = 's3', s3Root = 's3', publicVisibility = true, privateVisibility = false } = defineProps<FileSystemFormProps>()
+
+// Local disk settings
+  // Public disk settings
+  // Private disk settings
+  // EFS disk settings
+  // S3 disk settings
+</script>
+<form>
+    <main class="border-b border-gray-900/10">
+      <!-- Settings forms -->
+      <div class="divide-gray-900/10 divide-y">
+        <div class="grid gap-x-8 gap-y-10 grid-cols-1 md:grid-cols-3 py-16 max-w-7xl">
+          <div>
+            <h2 class="font-semibold leading-7 text-base text-gray-900 dark:text-neutral-100">
+              Default File System Settings
+            </h2>
+            <p class="mt-1 leading-6 text-gray-600 text-sm">
+              Update your default File System settings
+            </p>
+          </div>
+
+          <div class="md:col-span-2">
+            <div class="grid gap-x-6 gap-y-8 grid-cols-1 sm:grid-cols-6 w-full">
+              <div class="sm:col-span-3">
+                <label for="default-disk" class="block font-medium leading-6 text-gray-900 text-sm">Default</label>
+                <div class="mt-2">
+                  <select id="default-disk" name="default-disk" class="block py-1.5 w-full sm:max-w-xs text-gray-900 sm:leading-6 sm:text-sm border-0 ring-1 ring-gray-300 ring-inset rounded-md focus:ring-2 focus:ring-indigo-600 focus:ring-inset shadow-sm">
+                    <option {{ defaultDisk == 'local' ? 'selected' : '' }}>local</option>
+                    <option {{ defaultDisk == 'public' ? 'selected' : '' }}>public</option>
+                    <option {{ defaultDisk == 'private' ? 'selected' : '' }}>private</option>
+                    <option {{ defaultDisk == 'efs' ? 'selected' : '' }}>efs</option>
+                    <option {{ defaultDisk == 's3' ? 'selected' : '' }}>s3</option>
+                  </select>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div class="grid gap-x-8 gap-y-10 grid-cols-1 md:grid-cols-3 py-16 max-w-7xl">
+          <div>
+            <h2 class="font-semibold leading-7 text-base text-gray-900 dark:text-neutral-100">
+              Local Disk
+            </h2>
+            <p class="mt-1 leading-6 text-gray-600 text-sm">
+              Update your local disk configurations
+            </p>
+          </div>
+
+          <div class="md:col-span-2">
+            <div class="grid gap-x-6 gap-y-8 grid-cols-1 sm:grid-cols-6 w-full">
+              <div class="sm:col-span-3">
+                <label for="local-driver" class="block font-medium leading-6 text-gray-900 text-sm">Driver</label>
+                <div class="mt-2">
+                  <input id="local-driver" type="text" name="local-driver" value="{{ localDriver }}" class="block py-1.5 w-full text-gray-900 sm:leading-6 sm:text-sm placeholder:text-gray-400 border-0 ring-1 ring-gray-300 ring-inset rounded-md focus:ring-2 focus:ring-indigo-600 focus:ring-inset shadow-sm">
+                </div>
+              </div>
+
+              <div class="sm:col-span-3">
+                <label for="local-root" class="block font-medium leading-6 text-gray-900 text-sm">Root</label>
+                <div class="mt-2">
+                  <input id="local-root" type="text" name="local-root" value="{{ localRoot }}" class="block py-1.5 w-full text-gray-900 sm:leading-6 sm:text-sm placeholder:text-gray-400 border-0 ring-1 ring-gray-300 ring-inset rounded-md focus:ring-2 focus:ring-indigo-600 focus:ring-inset shadow-sm">
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div class="grid gap-x-8 gap-y-10 grid-cols-1 md:grid-cols-3 py-16 max-w-7xl">
+          <div>
+            <h2 class="font-semibold leading-7 text-base text-gray-900 dark:text-neutral-100">
+              Public Disk
+            </h2>
+            <p class="mt-1 leading-6 text-gray-600 text-sm">
+              Update your public disk configurations
+            </p>
+          </div>
+
+          <div class="md:col-span-2">
+            <div class="grid gap-x-6 gap-y-8 grid-cols-1 sm:grid-cols-6 w-full">
+              <div class="sm:col-span-3">
+                <label for="public-driver" class="block font-medium leading-6 text-gray-900 text-sm">Driver</label>
+                <div class="mt-2">
+                  <input id="public-driver" type="text" name="public-driver" value="{{ publicDriver }}" class="block py-1.5 w-full text-gray-900 sm:leading-6 sm:text-sm placeholder:text-gray-400 border-0 ring-1 ring-gray-300 ring-inset rounded-md focus:ring-2 focus:ring-indigo-600 focus:ring-inset shadow-sm">
+                </div>
+              </div>
+
+              <div class="sm:col-span-3">
+                <label for="public-root" class="block font-medium leading-6 text-gray-900 text-sm">Root</label>
+                <div class="mt-2">
+                  <input id="public-root" type="text" name="public-root" value="{{ publicRoot }}" class="block py-1.5 w-full text-gray-900 sm:leading-6 sm:text-sm placeholder:text-gray-400 border-0 ring-1 ring-gray-300 ring-inset rounded-md focus:ring-2 focus:ring-indigo-600 focus:ring-inset shadow-sm">
+                </div>
+              </div>
+
+              <div class="sm:col-span-2">
+                <label for="public-visibility" class="block font-medium leading-6 text-gray-900 text-sm">Visibility</label>
+                <div class="flex gap-x-4 items-center">
+                  <div class="mt-2">
+                    <button
+                      type="button"
+                      class="relative h-6 w-11 inline-flex flex-shrink-0 cursor-pointer border-2 border-transparent rounded-full {{ publicVisibility ? 'bg-indigo-600' : 'bg-gray-200' }} transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-600"
+                      role="switch"
+                      aria-checked="{{ publicVisibility ? 'true' : 'false' }}"
+                      data-action="toggle-public-visibility"
+                    >
+                      <span class="sr-only">Public Visibility</span>
+                      <span
+                        aria-hidden="true"
+                        class="pointer-events-none inline-block h-5 w-5 {{ publicVisibility ? 'translate-x-5' : 'translate-x-0' }} transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out"
+                      ></span>
+                    </button>
+                  </div>
+                  <span class="font-medium leading-6 text-gray-900 text-sm">Public</span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div class="grid gap-x-8 gap-y-10 grid-cols-1 md:grid-cols-3 py-16 max-w-7xl">
+          <div>
+            <h2 class="font-semibold leading-7 text-base text-gray-900 dark:text-neutral-100">
+              Private Disk
+            </h2>
+            <p class="mt-1 leading-6 text-gray-600 text-sm">
+              Update your private disk configurations
+            </p>
+          </div>
+
+          <div class="md:col-span-2">
+            <div class="grid gap-x-6 gap-y-8 grid-cols-1 sm:grid-cols-6 w-full">
+              <div class="sm:col-span-3">
+                <label for="private-driver" class="block font-medium leading-6 text-gray-900 text-sm">Driver</label>
+                <div class="mt-2">
+                  <input id="private-driver" type="text" name="private-driver" value="{{ privateDriver }}" class="block py-1.5 w-full text-gray-900 sm:leading-6 sm:text-sm placeholder:text-gray-400 border-0 ring-1 ring-gray-300 ring-inset rounded-md focus:ring-2 focus:ring-indigo-600 focus:ring-inset shadow-sm">
+                </div>
+              </div>
+
+              <div class="sm:col-span-3">
+                <label for="private-root" class="block font-medium leading-6 text-gray-900 text-sm">Root</label>
+                <div class="mt-2">
+                  <input id="private-root" type="text" name="private-root" value="{{ privateRoot }}" class="block py-1.5 w-full text-gray-900 sm:leading-6 sm:text-sm placeholder:text-gray-400 border-0 ring-1 ring-gray-300 ring-inset rounded-md focus:ring-2 focus:ring-indigo-600 focus:ring-inset shadow-sm">
+                </div>
+              </div>
+
+              <div class="sm:col-span-2">
+                <label for="private-visibility" class="block font-medium leading-6 text-gray-900 text-sm">Visibility</label>
+                <div class="flex gap-x-4 items-center">
+                  <div class="mt-2">
+                    <button
+                      type="button"
+                      class="relative h-6 w-11 inline-flex flex-shrink-0 cursor-pointer border-2 border-transparent rounded-full {{ privateVisibility ? 'bg-indigo-600' : 'bg-gray-200' }} transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-600"
+                      role="switch"
+                      aria-checked="{{ privateVisibility ? 'true' : 'false' }}"
+                      data-action="toggle-private-visibility"
+                    >
+                      <span class="sr-only">Private Visibility</span>
+                      <span
+                        aria-hidden="true"
+                        class="pointer-events-none inline-block h-5 w-5 {{ privateVisibility ? 'translate-x-5' : 'translate-x-0' }} transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out"
+                      ></span>
+                    </button>
+                  </div>
+                  <span class="font-medium leading-6 text-gray-900 text-sm">Private</span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div class="grid gap-x-8 gap-y-10 grid-cols-1 md:grid-cols-3 py-16 max-w-7xl">
+          <div>
+            <h2 class="font-semibold leading-7 text-base text-gray-900 dark:text-neutral-100">
+              EFS Disk
+            </h2>
+            <p class="mt-1 leading-6 text-gray-600 text-sm">
+              Update your EFS disk configurations
+            </p>
+          </div>
+
+          <div class="md:col-span-2">
+            <div class="grid gap-x-6 gap-y-8 grid-cols-1 sm:grid-cols-6 w-full">
+              <div class="sm:col-span-3">
+                <label for="efs-driver" class="block font-medium leading-6 text-gray-900 text-sm">Driver</label>
+                <div class="mt-2">
+                  <input id="efs-driver" type="text" name="efs-driver" value="{{ efsDriver }}" class="block py-1.5 w-full text-gray-900 sm:leading-6 sm:text-sm placeholder:text-gray-400 border-0 ring-1 ring-gray-300 ring-inset rounded-md focus:ring-2 focus:ring-indigo-600 focus:ring-inset shadow-sm">
+                </div>
+              </div>
+
+              <div class="sm:col-span-3">
+                <label for="efs-root" class="block font-medium leading-6 text-gray-900 text-sm">Root</label>
+                <div class="mt-2">
+                  <input id="efs-root" type="text" name="efs-root" value="{{ efsRoot }}" class="block py-1.5 w-full text-gray-900 sm:leading-6 sm:text-sm placeholder:text-gray-400 border-0 ring-1 ring-gray-300 ring-inset rounded-md focus:ring-2 focus:ring-indigo-600 focus:ring-inset shadow-sm">
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div class="grid gap-x-8 gap-y-10 grid-cols-1 md:grid-cols-3 py-16 max-w-7xl">
+          <div>
+            <h2 class="font-semibold leading-7 text-base text-gray-900 dark:text-neutral-100">
+              S3 Disk
+            </h2>
+            <p class="mt-1 leading-6 text-gray-600 text-sm">
+              Update your S3 disk configurations
+            </p>
+          </div>
+
+          <div class="md:col-span-2">
+            <div class="grid gap-x-6 gap-y-8 grid-cols-1 sm:grid-cols-6 w-full">
+              <div class="sm:col-span-3">
+                <label for="s3-driver" class="block font-medium leading-6 text-gray-900 text-sm">Driver</label>
+                <div class="mt-2">
+                  <input id="s3-driver" type="text" name="s3-driver" value="{{ s3Driver }}" class="block py-1.5 w-full text-gray-900 sm:leading-6 sm:text-sm placeholder:text-gray-400 border-0 ring-1 ring-gray-300 ring-inset rounded-md focus:ring-2 focus:ring-indigo-600 focus:ring-inset shadow-sm">
+                </div>
+              </div>
+
+              <div class="sm:col-span-3">
+                <label for="s3-root" class="block font-medium leading-6 text-gray-900 text-sm">Root</label>
+                <div class="mt-2">
+                  <input id="s3-root" type="text" name="s3-root" value="{{ s3Root }}" class="block py-1.5 w-full text-gray-900 sm:leading-6 sm:text-sm placeholder:text-gray-400 border-0 ring-1 ring-gray-300 ring-inset rounded-md focus:ring-2 focus:ring-indigo-600 focus:ring-inset shadow-sm">
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </main>
+    <div class="flex gap-x-6 items-center justify-end mt-6">
+      <button type="button" class="font-semibold leading-6 text-gray-900 text-sm">
+        Cancel
+      </button>
+      <button
+        type="submit"
+        class="px-3 py-2 font-semibold text-sm text-white bg-indigo-600 hover:bg-indigo-500 rounded-md focus-visible:outline focus-visible:outline-2 focus-visible:outline-indigo-600 focus-visible:outline-offset-2 shadow-sm"
+      >
+        Save
+      </button>
+    </div>
+  </form>

package/resources/components/Dashboard/Settings/Forms/HashingForm.stx

@@ -0,0 +1,119 @@
+<script>
+interface HashingFormProps {
+  driver?: string
+  bcryptRounds?: string
+  bcryptCost?: string
+  argon2Memory?: string
+  argon2Threads?: string
+  argon2Time?: string
+}
+
+const { driver = 'argon2', bcryptRounds = '10', bcryptCost = '4', argon2Memory = '65596', argon2Threads = '1', argon2Time = '1' } = defineProps<HashingFormProps>()
+</script>
+<form>
+    <main class="border-b border-gray-900/10">
+      <!-- Settings forms -->
+      <div class="divide-gray-900/10 divide-y">
+        <div class="grid gap-x-8 gap-y-10 grid-cols-1 md:grid-cols-3 py-16 max-w-7xl">
+          <div>
+            <h2 class="font-semibold leading-7 text-base text-gray-900 dark:text-neutral-100">
+              Default Hashing Settings
+            </h2>
+            <p class="mt-1 leading-6 text-gray-600 text-sm">
+              Update your default Hashing settings
+            </p>
+          </div>
+
+          <div class="md:col-span-2">
+            <div class="grid gap-x-6 gap-y-8 grid-cols-1 sm:grid-cols-6 w-full">
+              <div class="sm:col-span-3">
+                <label for="type" class="block font-medium leading-6 text-gray-900 text-sm">Driver</label>
+                <div class="mt-2">
+                  <select id="type" name="type" class="block py-1.5 w-full sm:max-w-xs text-gray-900 sm:leading-6 sm:text-sm border-0 ring-1 ring-gray-300 ring-inset rounded-md focus:ring-2 focus:ring-indigo-600 focus:ring-inset shadow-sm">
+                    <option {{ driver == 'argon2' ? 'selected' : '' }}>argon2</option>
+                    <option {{ driver == 'bcrypt' ? 'selected' : '' }}>bcrypt</option>
+                  </select>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div class="grid gap-x-8 gap-y-10 grid-cols-1 md:grid-cols-3 py-16 max-w-7xl">
+          <div>
+            <h2 class="font-semibold leading-7 text-base text-gray-900 dark:text-neutral-100">
+              Bcrypt Hashing
+            </h2>
+            <p class="mt-1 leading-6 text-gray-600 text-sm">
+              Update your Bcrypt Hashing configurations
+            </p>
+          </div>
+
+          <div class="md:col-span-2">
+            <div class="grid gap-x-6 gap-y-8 grid-cols-1 sm:grid-cols-6 w-full">
+              <div class="sm:col-span-3">
+                <label for="bcrypt-rounds" class="block font-medium leading-6 text-gray-900 text-sm">rounds</label>
+                <div class="mt-2">
+                  <input id="bcrypt-rounds" type="text" name="bcrypt-rounds" value="{{ bcryptRounds }}" class="block py-1.5 w-full text-gray-900 sm:leading-6 sm:text-sm placeholder:text-gray-400 border-0 ring-1 ring-gray-300 ring-inset rounded-md focus:ring-2 focus:ring-indigo-600 focus:ring-inset shadow-sm">
+                </div>
+              </div>
+
+              <div class="sm:col-span-3">
+                <label for="bcrypt-cost" class="block font-medium leading-6 text-gray-900 text-sm">Cost</label>
+                <div class="mt-2">
+                  <input id="bcrypt-cost" type="text" name="bcrypt-cost" value="{{ bcryptCost }}" class="block py-1.5 w-full text-gray-900 sm:leading-6 sm:text-sm placeholder:text-gray-400 border-0 ring-1 ring-gray-300 ring-inset rounded-md focus:ring-2 focus:ring-indigo-600 focus:ring-inset shadow-sm">
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div class="grid gap-x-8 gap-y-10 grid-cols-1 md:grid-cols-3 py-16 max-w-7xl">
+          <div>
+            <h2 class="font-semibold leading-7 text-base text-gray-900 dark:text-neutral-100">
+              Argon2 Hashing
+            </h2>
+            <p class="mt-1 leading-6 text-gray-600 text-sm">
+              Update your Argon2 Hashing configurations
+            </p>
+          </div>
+
+          <div class="md:col-span-2">
+            <div class="grid gap-x-6 gap-y-8 grid-cols-1 sm:grid-cols-6 w-full">
+              <div class="sm:col-span-3">
+                <label for="argon2-memory" class="block font-medium leading-6 text-gray-900 text-sm">Memory</label>
+                <div class="mt-2">
+                  <input id="argon2-memory" type="text" name="argon2-memory" value="{{ argon2Memory }}" class="block py-1.5 w-full text-gray-900 sm:leading-6 sm:text-sm placeholder:text-gray-400 border-0 ring-1 ring-gray-300 ring-inset rounded-md focus:ring-2 focus:ring-indigo-600 focus:ring-inset shadow-sm">
+                </div>
+              </div>
+
+              <div class="sm:col-span-3">
+                <label for="argon2-threads" class="block font-medium leading-6 text-gray-900 text-sm">Threads</label>
+                <div class="mt-2">
+                  <input id="argon2-threads" type="text" name="argon2-threads" value="{{ argon2Threads }}" class="block py-1.5 w-full text-gray-900 sm:leading-6 sm:text-sm placeholder:text-gray-400 border-0 ring-1 ring-gray-300 ring-inset rounded-md focus:ring-2 focus:ring-indigo-600 focus:ring-inset shadow-sm">
+                </div>
+              </div>
+
+              <div class="sm:col-span-3">
+                <label for="argon2-time" class="block font-medium leading-6 text-gray-900 text-sm">Time</label>
+                <div class="mt-2">
+                  <input id="argon2-time" type="text" name="argon2-time" value="{{ argon2Time }}" class="block py-1.5 w-full text-gray-900 sm:leading-6 sm:text-sm placeholder:text-gray-400 border-0 ring-1 ring-gray-300 ring-inset rounded-md focus:ring-2 focus:ring-indigo-600 focus:ring-inset shadow-sm">
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </main>
+    <div class="flex gap-x-6 items-center justify-end mt-6">
+      <button type="button" class="font-semibold leading-6 text-gray-900 text-sm">
+        Cancel
+      </button>
+      <button
+        type="submit"
+        class="px-3 py-2 font-semibold text-sm text-white bg-indigo-600 hover:bg-indigo-500 rounded-md focus-visible:outline focus-visible:outline-2 focus-visible:outline-indigo-600 focus-visible:outline-offset-2 shadow-sm"
+      >
+        Save
+      </button>
+    </div>
+  </form>