ex4nicegui 0.2.16__tar.gz → 0.2.18__tar.gz

{ex4nicegui-0.2.16 → ex4nicegui-0.2.18}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.1
 Name: ex4nicegui
-Version: 0.2.16
+Version: 0.2.18
 Summary: ...
 Home-page: 
 Author: carson_jia

{ex4nicegui-0.2.16 → ex4nicegui-0.2.18}/ex4nicegui/__init__.py

@@ -16,4 +16,4 @@ from signe import batch
 from ex4nicegui.experimental_ import gridLayout as exp_ui
 
 
-__version__ = "0.2.16"
+__version__ = "0.2.18"

ex4nicegui-0.2.18/ex4nicegui/experimental_/gridLayout/__init__.py

@@ -0,0 +1 @@
+from .index import column, row, item, grid_flex

ex4nicegui-0.2.18/ex4nicegui/experimental_/gridLayout/index.py

@@ -0,0 +1,181 @@
+from nicegui import ui
+
+
+from typing_extensions import Literal
+from typing import Optional, Union
+
+TBreakpoint = Literal[
+    "xs[0px]",
+    "sm[600px]",
+    "md[1024px]",
+    "lg[1440px]",
+    "xl[1920px]",
+    ">xs[0px]",
+    "<sm[600px]",
+    ">sm[600px]",
+    "<md[1024px]",
+    ">md[1024px]",
+    "<lg[1440px]",
+    ">lg[1440px]",
+    "<xl[1920px]",
+    ">xl[1920px]",
+]
+
+Breakpoint_map = {
+    "xs[0px]": "xs",
+    "sm[600px]": "sm",
+    "md[1024px]": "md",
+    "lg[1440px]": "lg",
+    "xl[1920px]": "xl",
+    ">xs[0px]": "gt-xs",
+    "<sm[600px]": "lt-sm",
+    ">sm[600px]": "gt-sm",
+    "<md[1024px]": "lt-md",
+    ">md[1024px]": "gt-md",
+    "<lg[1440px]": "lt-lg",
+    ">lg[1440px]": "gt-lg",
+    "<xl[1920px]": "lt-xl",
+    ">xl[1920px]": "gt-xl",
+}
+
+
+def _gap_value(value: Union[str, float, int]):
+    if isinstance(value, (float, int)):
+        value = f"{value}rem"
+    return value
+
+
+THorizontal = Literal["left", "center", "right", "stretch"]
+Horizontal_map = {
+    "left": "start",
+    "center": "center",
+    "right": "end",
+    "stretch": "stretch",
+}
+
+TVertical = Literal["top", "center", "bottom", "stretch"]
+Vertical_map = {
+    "top": "start",
+    "center": "center",
+    "bottom": "end",
+    "stretch": "stretch",
+}
+
+_TGrid_Type = Literal["row", "column"]
+
+
+class GridFlex(ui.element):
+    def __init__(self) -> None:
+        """ """
+        super().__init__("div")
+        self._classes = ["grid"]
+
+    @staticmethod
+    def set_classes(
+        grid_flex: "GridFlex",
+        type: _TGrid_Type,
+        template: str,
+        horizontal: THorizontal = "stretch",
+        vertical: TVertical = "stretch",
+        gap: Union[str, float, int] = 1,
+        width_full=True,
+        break_point: Optional[TBreakpoint] = None,
+    ):
+        _template = template.strip().replace(" ", "_")
+        _type = f"{type}s"
+        _justify_items = f"justify-items-{Horizontal_map[horizontal]}"
+        _align_items = f"items-{Vertical_map[vertical]}"
+        _gap = f"gap-[{_gap_value(gap)}]"
+        _w_full = "w-full" if width_full else ""
+
+        class_names = [
+            f"grid-{_type}-[{_template}]",
+            _justify_items,
+            _align_items,
+            _gap,
+            _w_full,
+        ]
+
+        if break_point is not None:
+            class_names = [f"{Breakpoint_map[break_point]}-{n}" for n in class_names]
+
+        grid_flex.classes(" ".join(class_names))
+        return grid_flex
+
+    def grid_flex(
+        self,
+        type: _TGrid_Type,
+        template: str,
+        *,
+        horizontal: THorizontal = "stretch",
+        vertical: TVertical = "stretch",
+        gap: Union[str, float, int] = 1,
+        width_full=True,
+        break_point: Optional[TBreakpoint] = None,
+    ):
+        return GridFlex.set_classes(
+            self, type, template, horizontal, vertical, gap, width_full, break_point
+        )
+
+
+def grid_flex(
+    type: _TGrid_Type,
+    template: str,
+    *,
+    horizontal: THorizontal = "stretch",
+    vertical: TVertical = "stretch",
+    gap: Union[str, float, int] = 1,
+    width_full=True,
+    break_point: Optional[TBreakpoint] = None,
+):
+    gf = GridFlex()
+
+    return GridFlex.set_classes(
+        gf, type, template, horizontal, vertical, gap, width_full, break_point
+    )
+
+
+def column(
+    template: str,
+    horizontal: THorizontal = "stretch",
+    vertical: TVertical = "stretch",
+    gap: Union[str, float, int] = 1,
+    width_full=True,
+):
+    gap = f"gap-[{_gap_value(gap)}]"
+    w_full = "w-full" if width_full else ""
+
+    box = ui.element("div").classes(f"grid {gap} {w_full}")
+    box._style["grid-template-rows"] = template
+    box._style["justify-items"] = Horizontal_map[horizontal]
+    box._style["align-items"] = Vertical_map[vertical]
+    return box
+
+
+def row(
+    template: str,
+    vertical: TVertical = "stretch",
+    horizontal: THorizontal = "stretch",
+    gap: Union[str, float, int] = 1,
+    width_full=True,
+):
+    gap = f"gap-[{_gap_value(gap)}]"
+    w_full = "w-full" if width_full else ""
+
+    box = ui.element("div").classes(f"grid {gap} {w_full}")
+    box._style["grid-template-columns"] = template
+    box._style["justify-items"] = Horizontal_map[horizontal]
+    box._style["align-items"] = Vertical_map[vertical]
+    return box
+
+
+def item(
+    *, horizontal: Optional[THorizontal] = None, vertical: Optional[TVertical] = None
+):
+    res = []
+    if horizontal is not None:
+        res.append(f"justify-self-{Horizontal_map[horizontal]}")
+
+    if vertical is not None:
+        res.append(f"self-{Vertical_map[vertical]}")
+    return " ".join(res)

ex4nicegui-0.2.18/ex4nicegui/layout/__init__.py

@@ -0,0 +1,2 @@
+from .gridFlex import *
+from .rxFlex import *

ex4nicegui-0.2.18/ex4nicegui/layout/gridFlex/GridFlex.js

@@ -0,0 +1,156 @@
+const M = Vue.getCurrentScope
+const _ = Vue.onScopeDispose
+const k = Vue.toRef
+const q = Vue.readonly
+const j = Vue.customRef
+const d = Vue.ref
+const m = Vue.computed
+const B = Vue.watchEffect
+const L = Vue.getCurrentInstance
+const C = Vue.onMounted
+const N = Vue.defineComponent
+const R = Vue.openBlock
+const G = Vue.createElementBlock
+const W = Vue.normalizeStyle
+const z = Vue.unref
+const D = Vue.renderSlot
+function F(n) {
+  return M() ? (_(n), !0) : !1;
+}
+const I = typeof window < "u", Q = () => {
+};
+function P(n, s) {
+  var r;
+  if (typeof n == "number")
+    return n + s;
+  const o = ((r = n.match(/^-?[0-9]+\.?[0-9]*/)) == null ? void 0 : r[0]) || "", l = n.slice(o.length), t = Number.parseFloat(o) + s;
+  return Number.isNaN(t) ? n : t + l;
+}
+function U(...n) {
+  if (n.length !== 1)
+    return k(...n);
+  const s = n[0];
+  return typeof s == "function" ? q(j(() => ({ get: s, set: Q }))) : d(s);
+}
+const p = I ? window : void 0;
+function V() {
+  const n = d(!1);
+  return L() && C(() => {
+    n.value = !0;
+  }), n;
+}
+function A(n) {
+  const s = V();
+  return m(() => (s.value, !!n()));
+}
+function c(n, s = {}) {
+  const { window: r = p } = s, o = A(() => r && "matchMedia" in r && typeof r.matchMedia == "function");
+  let l;
+  const t = d(!1), i = () => {
+    l && ("removeEventListener" in l ? l.removeEventListener("change", e) : l.removeListener(e));
+  }, e = () => {
+    o.value && (i(), l = r.matchMedia(U(n).value), t.value = !!(l != null && l.matches), l && ("addEventListener" in l ? l.addEventListener("change", e) : l.addListener(e)));
+  };
+  return B(e), F(() => i()), t;
+}
+function H(n, s = {}) {
+  function r(e, u) {
+    let a = n[e];
+    return u != null && (a = P(a, u)), typeof a == "number" && (a = `${a}px`), a;
+  }
+  const { window: o = p } = s;
+  function l(e) {
+    return o ? o.matchMedia(e).matches : !1;
+  }
+  const t = (e) => c(`(min-width: ${r(e)})`, s), i = Object.keys(n).reduce((e, u) => (Object.defineProperty(e, u, {
+    get: () => t(u),
+    enumerable: !0,
+    configurable: !0
+  }), e), {});
+  return Object.assign(i, {
+    greater(e) {
+      return c(`(min-width: ${r(e, 0.1)})`, s);
+    },
+    greaterOrEqual: t,
+    smaller(e) {
+      return c(`(max-width: ${r(e, -0.1)})`, s);
+    },
+    smallerOrEqual(e) {
+      return c(`(max-width: ${r(e)})`, s);
+    },
+    between(e, u) {
+      return c(`(min-width: ${r(e)}) and (max-width: ${r(u, -0.1)})`, s);
+    },
+    isGreater(e) {
+      return l(`(min-width: ${r(e, 0.1)})`);
+    },
+    isGreaterOrEqual(e) {
+      return l(`(min-width: ${r(e)})`);
+    },
+    isSmaller(e) {
+      return l(`(max-width: ${r(e, -0.1)})`);
+    },
+    isSmallerOrEqual(e) {
+      return l(`(max-width: ${r(e)})`);
+    },
+    isInBetween(e, u) {
+      return l(`(min-width: ${r(e)}) and (max-width: ${r(u, -0.1)})`);
+    },
+    current() {
+      const e = Object.keys(n).map((u) => [u, t(u)]);
+      return m(() => e.filter(([, u]) => u.value).map(([u]) => u));
+    }
+  });
+}
+const T = /* @__PURE__ */ N({
+  __name: "GridFlex",
+  props: {
+    normalStyles: null,
+    breakpointStyleMap: null
+  },
+  setup(n) {
+    const s = n, r = m(() => new Map(
+      Object.entries(s.breakpointStyleMap)
+    ));
+    function o() {
+      const t = H({
+        sm: 600,
+        md: 1024,
+        lg: 1440,
+        xl: 1920
+      }), i = t.smaller("sm"), e = t.between("sm", "md"), u = t.between("md", "lg"), a = t.between("lg", "xl"), g = t.greaterOrEqual("xl"), h = t.smaller("sm"), w = t.smaller("md"), v = t.smaller("lg"), y = t.smaller("xl"), x = t.greaterOrEqual("sm"), b = t.greaterOrEqual("md"), O = t.greaterOrEqual("lg"), S = t.greaterOrEqual("xl"), E = {
+        xs: i,
+        sm: e,
+        md: u,
+        lg: a,
+        xl: g,
+        "lt-sm": h,
+        "lt-md": w,
+        "lt-lg": v,
+        "lt-xl": y,
+        "gt-xs": x,
+        "gt-sm": b,
+        "gt-md": O,
+        "gt-lg": S
+      };
+      return m(() => {
+        if (r.value.size === 0)
+          return s.normalStyles;
+        for (const [f, $] of Object.entries(E))
+          if ($.value && r.value.has(f))
+            return r.value.get(f);
+        return s.normalStyles;
+      });
+    }
+    const l = o();
+    return (t, i) => (R(), G("div", {
+      class: "grid",
+      style: W(z(l))
+    }, [
+      D(t.$slots, "default")
+    ], 4));
+  }
+});
+export {
+  T as default
+};

ex4nicegui-0.2.18/ex4nicegui/layout/gridFlex/__init__.py

@@ -0,0 +1 @@
+from .gridFlex import grid_flex, grid_box, mark_area, item_position, GridFlex

ex4nicegui-0.2.18/ex4nicegui/layout/gridFlex/gridFlex.py

@@ -0,0 +1,276 @@
+from typing import Any, Callable, Dict, Optional, cast
+from dataclasses import dataclass
+from nicegui.dataclasses import KWONLY_SLOTS
+from nicegui import ui, app
+from nicegui.element import Element
+from signe import createSignal, effect, batch
+from ex4nicegui.utils.signals import ref_from_signal
+
+from typing_extensions import Literal
+from typing import Optional, Union
+from . import utils
+
+
+TBreakpoint = Literal[
+    "xs[0px-599.99px]",
+    "sm[600px-1023.99px]",
+    "md[1024px-1439.99px]",
+    "lg[1440px-1919.99px]",
+    "xl[1920px-Infinity]",
+    ">xs[600px-Infinity]",
+    "<sm[0-599.99px]",
+    ">sm[1024px-Infinity]",
+    "<md[0-1023.99px]",
+    ">md[1440px-Infinity]",
+    "<lg[0-1439.99px]",
+    ">lg[1920px-Infinity]",
+    "<xl[0-1919.99px]",
+]
+
+Breakpoint_map = {
+    "xs[0px-599.99px]": "xs",
+    "sm[600px-1023.99px]": "sm",
+    "md[1024px-1439.99px]": "md",
+    "lg[1440px-1919.99px]": "lg",
+    "xl[1920px-Infinity]": "xl",
+    ">xs[600px-Infinity]": "gt-xs",
+    "<sm[0-599.99px]": "lt-sm",
+    ">sm[1024px-Infinity]": "gt-sm",
+    "<md[0-1023.99px]": "lt-md",
+    ">md[1440px-Infinity]": "gt-md",
+    "<lg[0-1439.99px]": "lt-lg",
+    ">lg[1920px-Infinity]": "gt-lg",
+    "<xl[0-1919.99px]": "lt-xl",
+}
+
+
+def _gap_value(value: Optional[Union[str, float, int]]):
+    if value is None:
+        return value
+
+    if isinstance(value, (float, int)):
+        value = f"{value}rem"
+    return value
+
+
+THorizontal = Literal["left", "center", "right", "stretch"]
+Horizontal_map = {
+    "left": "start",
+    "center": "center",
+    "right": "end",
+    "stretch": "stretch",
+}
+
+TVertical = Literal["top", "center", "bottom", "stretch"]
+Vertical_map = {
+    "top": "start",
+    "center": "center",
+    "bottom": "end",
+    "stretch": "stretch",
+}
+
+_TGrid_Type = Literal["row", "column"]
+Grid_Type_map = {
+    "row": "columns",
+    "column": "rows",
+}
+
+
+class GridFlex(Element, component="GridFlex.js"):
+    def __init__(self) -> None:
+        super().__init__()
+
+        self._props["normalStyles"] = {}
+        self._props["breakpointStyleMap"] = {}
+
+        self.__breakpointStyleMap = {}
+
+    @staticmethod
+    def _cleanStyle(styles: Dict):
+        return {k: v for k, v in styles.items() if v is not None}
+
+    @staticmethod
+    def to_styles(
+        type: _TGrid_Type,
+        template: str,
+        horizontal: THorizontal = "stretch",
+        vertical: TVertical = "stretch",
+        gap: Union[str, float, int] = 1,
+        width_full=True,
+    ):
+        styles = {
+            f"grid-template-{Grid_Type_map[type]}": template,
+            "justify-items": Horizontal_map[horizontal],
+            "align-items": Vertical_map[vertical],
+            "gap": _gap_value(gap),
+        }
+
+        if width_full:
+            styles.update({"width": "100%"})
+
+        return styles
+
+    def grid_flex(
+        self,
+        type: _TGrid_Type,
+        template: str,
+        *,
+        horizontal: THorizontal = "stretch",
+        vertical: TVertical = "stretch",
+        gap: Union[str, float, int] = 1,
+        width_full=True,
+        break_point: Optional[TBreakpoint] = None,
+    ):
+        styles = GridFlex.to_styles(
+            type, template, horizontal, vertical, gap, width_full
+        )
+
+        if break_point is None:
+            self._props["normalStyles"] = styles
+        else:
+            self.__breakpointStyleMap[Breakpoint_map[break_point]] = styles
+            self._props["breakpointStyleMap"] = self.__breakpointStyleMap
+
+        self.update()
+        return self
+
+    def grid_box(
+        self,
+        area: Optional[str] = None,
+        *,
+        template_rows: Optional[str] = None,
+        template_columns: Optional[str] = None,
+        horizontal: THorizontal = "stretch",
+        vertical: TVertical = "stretch",
+        gap: Optional[Union[str, float, int]] = 1,
+        width_full=True,
+        break_point: Optional[TBreakpoint] = None,
+        **kws,
+    ):
+        if area is not None and area.strip() != "":
+            areas_list = utils.areas_str2array(area)
+            area = utils.areas_array2str(areas_list)
+            areas_cols_len = max(map(len, areas_list))
+            areas_rows_len = len(areas_list)
+
+            template_columns = template_columns or f"repeat({areas_cols_len}, 1fr)"
+            template_rows = template_rows or f"repeat({areas_rows_len}, 1fr)"
+
+        styles = {
+            "grid-template-areas": area,
+            "grid-template-rows": template_rows,
+            "grid-template-columns": template_columns,
+            "justify-items": Horizontal_map[horizontal],
+            "align-items": Vertical_map[vertical],
+            "gap": _gap_value(gap),
+        }
+        styles.update(kws)
+
+        if width_full:
+            styles.update({"width": "100%"})
+
+        styles = GridFlex._cleanStyle(styles)
+
+        if break_point is None:
+            self._props["normalStyles"] = styles
+        else:
+            self.__breakpointStyleMap[Breakpoint_map[break_point]] = styles
+            self._props["breakpointStyleMap"] = self.__breakpointStyleMap
+
+        self.update()
+        return self
+
+
+def grid_box(
+    area: Optional[str] = None,
+    *,
+    template_rows: Optional[str] = None,
+    template_columns: Optional[str] = None,
+    horizontal: THorizontal = "stretch",
+    vertical: TVertical = "stretch",
+    gap: Union[str, float, int] = 1,
+    width_full=True,
+    break_point: Optional[TBreakpoint] = None,
+    **kws,
+):
+    gf = GridFlex()
+
+    gf.grid_box(
+        area,
+        template_rows=template_rows,
+        template_columns=template_columns,
+        horizontal=horizontal,
+        vertical=vertical,
+        gap=gap,
+        width_full=width_full,
+        break_point=break_point,
+        **kws,
+    )
+
+    return gf
+
+
+def grid_flex(
+    type: _TGrid_Type,
+    template: str,
+    *,
+    horizontal: THorizontal = "stretch",
+    vertical: TVertical = "stretch",
+    gap: Union[str, float, int] = 1,
+    width_full=True,
+    break_point: Optional[TBreakpoint] = None,
+):
+    gf = GridFlex()
+
+    gf.grid_flex(
+        type,
+        template,
+        horizontal=horizontal,
+        vertical=vertical,
+        gap=gap,
+        width_full=width_full,
+        break_point=break_point,
+    )
+
+    return gf
+
+
+class MarkArea:
+    def __init__(self, mark: str) -> None:
+        self.mark = mark
+
+    def __radd__(self, other: ui.element):
+        other.style(f"grid-area:{self.mark}")
+        return other
+
+
+def mark_area(mark: str):
+    return MarkArea(mark)
+
+
+class ItemPosition:
+    def __init__(
+        self,
+        horizontal: Optional[THorizontal] = None,
+        vertical: Optional[TVertical] = None,
+    ) -> None:
+        self.horizontal = horizontal
+        self.vertical = vertical
+
+    def __radd__(self, other: ui.element):
+        res = []
+        if self.horizontal is not None:
+            res.append(f"justify-self-{Horizontal_map[self.horizontal]}")
+
+        if self.vertical is not None:
+            res.append(f"self-{Vertical_map[self.vertical]}")
+
+        other.classes(" ".join(res))
+
+        return other
+
+
+def item_position(
+    *, horizontal: Optional[THorizontal] = None, vertical: Optional[TVertical] = None
+):
+    return ItemPosition(horizontal, vertical)

ex4nicegui-0.2.18/ex4nicegui/layout/gridFlex/utils.py

@@ -0,0 +1,48 @@
+from typing import List
+
+
+def areas_str2array(areas: str) -> List[List[str]]:
+    """
+    >>> input='''
+        sc1 sc2
+        sc3
+        table table table table
+    '''
+    >>> areas_str2array(input)
+    >>> [
+        ["sc1", "sc2"],
+        ["sc3"],
+        ["table", "table", "table", "table"]
+    ]
+    """
+    pass
+
+    lines = (line.strip() for line in areas.splitlines())
+    remove_empty_rows = (line for line in lines if len(line) > 0)
+    splie_space = (line.split() for line in remove_empty_rows)
+    return list(splie_space)
+
+
+def areas_array2str(areas_array: List[List[str]]):
+    """
+    >>> input = [
+        ["sc1", "sc2"],
+        ["sc3"],
+        ["table"] * 4
+    ]
+    >>> areas_array2str(input)
+    >>> '"sc1 sc2 . ." "sc3 . . ." "table table table table"'
+    """
+    max_len = max(map(len, areas_array))
+
+    fix_empty = (
+        [*line, *(["."] * (max_len - len(line)))] if len(line) < max_len else line
+        for line in areas_array
+    )
+
+    line2str = (f'"{" ".join(line)}"' for line in fix_empty)
+    return " ".join(line2str)
+
+
+def best_grid_template_columns(min_column_size: str):
+    return f"repeat(auto-fit,minmax(min({min_column_size},100%),1fr))"

ex4nicegui-0.2.18/ex4nicegui/layout/rxFlex/__init__.py

@@ -0,0 +1 @@
+from .index import rx_column, rx_row