sveltekit-ui 1.1.17 → 1.1.18

package/dist/Components/Time/index.svelte.js

@@ -0,0 +1,38 @@
+import { get_time_object_from_val } from "../TimeInput/index.js"
+import { set_closurable_color, set_closurable } from "../../client/index.js"
+
+export function create_time_manager(config) {
+  let datetime = $state(null)
+  let content = $state(null)
+  let text_color = $derived(set_closurable_color(config?.text_color, null))
+
+  function init(config) {
+    const time_full = get_time_object_from_val(
+      set_closurable(config?.val),
+      set_closurable(config?.format),
+      set_closurable(config?.granularity),
+      set_closurable(config?.timezone)
+    )
+    datetime = time_full?.datetime ?? time_full?.iso_8601 ?? null
+    content = time_full?.content ?? set_closurable(config?.val)
+    if (config?.display_format == "calendar_date" && time_full?.year) {
+      content = `${time_full?.year}-${String(time_full?.month).padStart(2, "0")}-${String(
+        time_full?.day_of_month
+      ).padStart(2, "0")}`
+    }
+  }
+
+  init(config)
+
+  return {
+    get text_color() {
+      return text_color
+    },
+    get datetime() {
+      return datetime
+    },
+    get content() {
+      return content
+    },
+  }
+}

package/dist/Components/TimeInput/NumberToggler/index.svelte

@@ -0,0 +1,34 @@
+<script>
+  import TextInput from "../../TextInput/index.svelte"
+  import Button from "../../Button/index.svelte"
+
+  let { manager } = $props()
+</script>
+
+<div class="segment">
+  <div style="width: 100%;">
+    <Button manager={manager?.number_plus_one_button_manager} />
+  </div>
+  <p class="time_text">{manager?.label}</p>
+  <TextInput manager={manager?.number_text_input_manager} />
+  <div style="width: 100%;">
+    <Button manager={manager?.number_minus_one_button_manager} />
+  </div>
+</div>
+
+<style>
+  .segment {
+    display: flex;
+    flex: 1;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    border: 1px solid var(--shadow2-t);
+    border-radius: 1rem;
+    margin: 0.1rem;
+  }
+  .time_text {
+    font-size: 1.2rem;
+    color: var(--g8-t);
+  }
+</style>

package/dist/Components/TimeInput/NumberToggler/index.svelte.js

@@ -0,0 +1,79 @@
+import { create_text_input_manager } from "../../TextInput/index.svelte.js"
+import { create_button_manager } from "../../Button/index.svelte.js"
+
+export function create_number_toggler(config) {
+  let number_plus_one_button_manager = $state(null)
+  let number_minus_one_button_manager = $state(null)
+  let number_text_input_manager = $state(null)
+  let label = $state(null)
+
+  function handle_change(input) {
+    if (typeof config?.on_change == "function") {
+      config?.on_change(input)
+    }
+  }
+
+  function set_val(input) {
+    if (input != number_text_input_manager?.val) {
+      number_text_input_manager?.set_val(input)
+    }
+  }
+
+  function init(config) {
+    label = config?.label
+    number_plus_one_button_manager = create_button_manager({
+      type: "soft",
+      support_icon: "arrow",
+      icon_pos: "center",
+      min_height: 2.4,
+      pt: 0,
+      g_base: 8,
+      icon_sw: 40,
+      on_click: () =>
+        number_text_input_manager.set_val(
+          Number.isInteger(number_text_input_manager?.val) ? number_text_input_manager?.val + 1 : 0
+        ),
+    })
+    number_minus_one_button_manager = create_button_manager({
+      type: "soft",
+      support_icon: "arrow",
+      icon_pos: "center",
+      icon_deg: 180,
+      min_height: 2.4,
+      pt: 0,
+      g_base: 8,
+      icon_sw: 40,
+      on_click: () =>
+        number_text_input_manager.set_val(
+          Number.isInteger(number_text_input_manager?.val) ? number_text_input_manager?.val - 1 : 0
+        ),
+    })
+    number_text_input_manager = create_text_input_manager({
+      type: "number",
+      placeholder: "-",
+      val: config?.val,
+      on_change: (input) => handle_change(input),
+    })
+  }
+
+  init(config)
+
+  return {
+    get val() {
+      return number_text_input_manager?.val
+    },
+    get label() {
+      return label
+    },
+    get number_plus_one_button_manager() {
+      return number_plus_one_button_manager
+    },
+    get number_minus_one_button_manager() {
+      return number_minus_one_button_manager
+    },
+    get number_text_input_manager() {
+      return number_text_input_manager
+    },
+    set_val,
+  }
+}