gd-design-library 0.7.0 → 0.7.2

package/tokens/snackbar.d.ts

@@ -1,157 +0,0 @@
-import { FlexDirection } from '../types';
-export declare const DEFAULT_SNACKBAR_WIDTH = "302px";
-export declare const snackbar: {
-    container: {
-        default: {
-            position: string;
-            display: string;
-            flexDirection: FlexDirection;
-            gap: string;
-            padding: string;
-            boxSizing: string;
-            maxHeight: string;
-            overflowY: string;
-            overflowX: string;
-            scrollbarWidth: string;
-            scrollbarColor: string;
-            zIndex: number;
-            '&::-webkit-scrollbar': {
-                width: string;
-                background: string;
-            };
-            '&::-webkit-scrollbar-thumb': {
-                background: string;
-                borderRadius: string;
-            };
-            '&::-webkit-scrollbar-track': {
-                background: string;
-            };
-            '&:hover::-webkit-scrollbar-thumb': {
-                background: string;
-            };
-            '&.scrolling::-webkit-scrollbar-thumb': {
-                background: string;
-            };
-        };
-    };
-    snackbar: {
-        default: {
-            position: string;
-            boxShadow: string;
-            width: string;
-            fontSize: string;
-            display: string;
-            flexDirection: FlexDirection;
-            gap: string;
-            color: string;
-            padding: string;
-        };
-        background: {
-            default: string;
-            variants: {
-                success: string;
-                error: string;
-                warning: string;
-                info: string;
-            };
-        };
-        animation: {
-            duration: string;
-            timing: string;
-        };
-    };
-    positions: {
-        "top-left": {
-            top: number;
-            left: number;
-            alignItems: string;
-        };
-        "top-center": {
-            top: number;
-            left: string;
-            transform: string;
-            alignItems: string;
-        };
-        "top-right": {
-            top: number;
-            right: number;
-            alignItems: string;
-        };
-        "bottom-left": {
-            bottom: number;
-            left: number;
-            alignItems: string;
-            flexDirection: FlexDirection;
-        };
-        "bottom-center": {
-            bottom: number;
-            left: string;
-            transform: string;
-            alignItems: string;
-            flexDirection: FlexDirection;
-        };
-        "bottom-right": {
-            bottom: number;
-            right: number;
-            alignItems: string;
-            flexDirection: FlexDirection;
-        };
-    };
-    closeButton: {
-        position: string;
-        top: string;
-        right: string;
-        background: string;
-        border: number;
-        cursor: string;
-        padding: number;
-        width: number;
-        height: number;
-    };
-    icons: {
-        close: {
-            name: string;
-            width: number;
-            height: number;
-        };
-        success: {
-            name: string;
-            fill: string;
-            width: number;
-            height: number;
-        };
-        error: {
-            name: string;
-            fill: string;
-            width: number;
-            height: number;
-        };
-        warning: {
-            name: string;
-            fill: string;
-            width: number;
-            height: number;
-        };
-        info: {
-            name: string;
-            fill: string;
-            width: number;
-            height: number;
-        };
-    };
-    snackbarBody: {
-        display: string;
-        alignItems: string;
-        gap: string;
-    };
-    snackbarContent: {
-        display: string;
-        flexDirection: FlexDirection;
-        alignItems: string;
-        gap: string | number;
-        flex: number;
-    };
-    actionsContainer: {
-        paddingTop: string | number;
-    };
-};

package/tokens/snackbar.js

@@ -1,177 +0,0 @@
-import { getSpacing as s } from "./utils.js";
-import { spacing as o } from "./spacing.js";
-import { font as R } from "./font.js";
-import { colors as t } from "./colors.js";
-import { borders as T } from "./borders.js";
-import { cursors as $ } from "./cursors.js";
-import { values as A } from "./values.js";
-import { radius as X } from "./radius.js";
-import { icon as l } from "./icon.js";
-import { shadows as L } from "./shadow.js";
-import { flexAlignItems as r, display as a } from "./display.js";
-import { SnackbarPosition as e } from "../types/snackbar.js";
-import { FlexDirection as i } from "../types/layout.js";
-import { SizeVariant as n } from "../types/common.js";
-import { TypographyVariant as F } from "../types/typography.js";
-const H = "302px";
-var m, c, g, d, f, p, b, h, u, w, x, k, S, C, I, v, y, D, z, B;
-const Q = {
-  container: {
-    default: {
-      position: "fixed",
-      display: a.flex,
-      flexDirection: i.Column,
-      gap: o[n.Sm],
-      padding: o[n.Sm],
-      boxSizing: "border-box",
-      maxHeight: `calc(100vh - ${o[n.Xs]})`,
-      overflowY: "auto",
-      overflowX: "hidden",
-      scrollbarWidth: "thin",
-      scrollbarColor: `${t.transparent} ${t.transparent}`,
-      zIndex: A.zIndex.snackbar,
-      // to be under modal, could be rewritten by theme
-      "&::-webkit-scrollbar": {
-        width: o[(m = n) == null ? void 0 : m.Sm],
-        background: t.transparent
-      },
-      "&::-webkit-scrollbar-thumb": {
-        background: t.transparent,
-        borderRadius: X[(c = n) == null ? void 0 : c.Sm]
-      },
-      "&::-webkit-scrollbar-track": {
-        background: t.transparent
-      },
-      "&:hover::-webkit-scrollbar-thumb": {
-        background: "rgba(0, 0, 0, 0.3)"
-      },
-      "&.scrolling::-webkit-scrollbar-thumb": {
-        background: "rgba(0, 0, 0, 0.3)"
-      }
-    }
-  },
-  snackbar: {
-    default: {
-      position: "relative",
-      boxShadow: (g = L.snackbar) == null ? void 0 : g.default,
-      width: H,
-      fontSize: R.size[(d = F) == null ? void 0 : d.Body1],
-      display: a.flex,
-      flexDirection: i.Column,
-      gap: o.sm,
-      color: (f = t.text) == null ? void 0 : f.default,
-      padding: `${(p = o) == null ? void 0 : p.sm} ${(b = o) == null ? void 0 : b.md}`
-    },
-    background: {
-      default: (h = t.bg) == null ? void 0 : h.surface,
-      variants: {
-        success: t.bg.toast.success,
-        error: t.bg.toast.error,
-        warning: t.bg.toast.warning,
-        info: t.bg.toast.info
-      }
-    },
-    animation: {
-      duration: "300ms",
-      timing: "ease-in-out"
-    }
-  },
-  positions: {
-    [(u = e) == null ? void 0 : u.TopLeft]: {
-      top: 0,
-      left: 0,
-      alignItems: r.start
-    },
-    [(w = e) == null ? void 0 : w.TopCenter]: {
-      top: o.none,
-      left: "50%",
-      transform: "translateX(-50%)",
-      alignItems: r.center
-    },
-    [(x = e) == null ? void 0 : x.TopRight]: {
-      top: o.none,
-      right: o.none,
-      alignItems: r.end
-    },
-    [(k = e) == null ? void 0 : k.BottomLeft]: {
-      bottom: o.none,
-      left: o.none,
-      alignItems: r.start,
-      flexDirection: i.ColumnReverse
-    },
-    [(S = e) == null ? void 0 : S.BottomCenter]: {
-      bottom: o.none,
-      left: "50%",
-      transform: "translateX(-50%)",
-      alignItems: r.center,
-      flexDirection: i.ColumnReverse
-    },
-    [(C = e) == null ? void 0 : C.BottomRight]: {
-      bottom: o.none,
-      right: o.none,
-      alignItems: r.end,
-      flexDirection: i.ColumnReverse
-    }
-  },
-  closeButton: {
-    position: "absolute",
-    top: o.sm,
-    right: o.md,
-    background: t.transparent,
-    border: T.none,
-    cursor: $.pointer,
-    padding: 3,
-    width: (y = (v = (I = l) == null ? void 0 : I.size) == null ? void 0 : v[n.Sm]) == null ? void 0 : y.width,
-    height: (B = (z = (D = l) == null ? void 0 : D.size) == null ? void 0 : z[n.Sm]) == null ? void 0 : B.height
-  },
-  icons: {
-    close: {
-      name: "cross",
-      width: 10,
-      height: 10
-    },
-    success: {
-      name: "success",
-      fill: t.icon.success,
-      width: 20,
-      height: 20
-    },
-    error: {
-      name: "error",
-      fill: t.icon.error,
-      width: 20,
-      height: 20
-    },
-    warning: {
-      name: "warning",
-      fill: t.icon.warning,
-      width: 20,
-      height: 20
-    },
-    info: {
-      name: "info",
-      fill: t.icon.info,
-      width: 20,
-      height: 20
-    }
-  },
-  snackbarBody: {
-    display: a.flex,
-    alignItems: r.start,
-    gap: o.sm
-  },
-  snackbarContent: {
-    display: a.flex,
-    flexDirection: i.Column,
-    alignItems: r.start,
-    gap: s(1),
-    flex: 1
-  },
-  actionsContainer: {
-    paddingTop: s(1)
-  }
-};
-export {
-  H as DEFAULT_SNACKBAR_WIDTH,
-  Q as snackbar
-};

package/tokens/spacing.d.ts

@@ -1,9 +0,0 @@
-export declare const spacing: {
-    none: number;
-    xs: string;
-    sm: string;
-    md: string;
-    lg: string;
-    xl: string;
-    xxl: string;
-};

package/tokens/spacing.js

@@ -1,13 +0,0 @@
-import { SizeVariant as p } from "../types/common.js";
-const n = {
-  none: 0,
-  [p.Xs]: "4px",
-  [p.Sm]: "8px",
-  [p.Md]: "16px",
-  [p.Lg]: "24px",
-  [p.Xl]: "32px",
-  [p.Xxl]: "40px"
-};
-export {
-  n as spacing
-};

package/tokens/stepper.d.ts

@@ -1,132 +0,0 @@
-import { Cursors } from '../types';
-export declare const stepper: {
-    default: {
-        display: string;
-        flexDirection: string;
-        justifyContent: string;
-        width: string;
-    };
-    separator: {
-        default: {
-            width: string;
-            position: string;
-            zIndex: number;
-            top: string;
-            marginLeft: string;
-            marginRight: string;
-            transition: any;
-            borderTop: string;
-        };
-        active: {};
-        complete: {
-            borderTopColor: any;
-        };
-        inactive: {};
-    };
-    step: {
-        default: {
-            display: string;
-            flexDirection: string;
-            alignItems: string;
-            justifyContent: string;
-            minWidth: string;
-        };
-        active: {};
-        inactive: {};
-        complete: {
-            cursor: Cursors;
-        };
-    };
-    stepIcon: {
-        default: {
-            width: number;
-            height: number;
-            display: string;
-            alignItems: string;
-            justifyContent: string;
-            borderRadius: string;
-            border: string;
-            fontSize: {
-                fontSize: string;
-                fontWeight: number;
-                lineHeight: string;
-                marginTop: string;
-                marginBottom: string;
-            };
-            transition: any;
-            colors: any;
-        };
-        active: {
-            default: {
-                backgroundColor: any;
-                borderColor: any;
-            };
-            success: {};
-            error: {
-                backgroundColor: any;
-                borderColor: any;
-            };
-        };
-        inactive: {
-            default: {
-                backgroundColor: any;
-            };
-            success: {};
-            error: {};
-        };
-        complete: {
-            default: {
-                fontWeight: number;
-                backgroundColor: any;
-            };
-            success: {};
-            error: {
-                backgroundColor: any;
-                borderColor: any;
-            };
-        };
-        success: {
-            default: {};
-            success: {};
-            error: {};
-        };
-    };
-    stepLabel: {
-        default: {
-            marginTop: string;
-            fontSize: {
-                fontSize: string;
-                fontWeight: number;
-                lineHeight: string;
-            };
-            colors: any;
-        };
-        active: {};
-        inactive: {};
-        complete: {};
-        error: {};
-        success: {};
-    };
-    icons: {
-        active: {
-            name: string;
-            fill: any;
-        };
-        inactive: {
-            name: string;
-            fill: any;
-        };
-        complete: {
-            name: string;
-            fill: any;
-        };
-        error: {
-            name: string;
-            fill: any;
-        };
-        errorActive: {
-            name: string;
-            fill: any;
-        };
-    };
-};

package/tokens/stepper.js

@@ -1,147 +0,0 @@
-import { icon as a } from "./icon.js";
-import { colors as e } from "./colors.js";
-import { borders as c } from "./borders.js";
-import { radius as u } from "./radius.js";
-import { values as l } from "./values.js";
-import { typography as d } from "./typography.js";
-import { font as b } from "./font.js";
-import { spacing as g } from "./spacing.js";
-import { flexAlignItems as p, display as n } from "./display.js";
-import { StepValidationStatus as t, StepStatus as o } from "../types/stepper.js";
-import { get as r } from "../utils/helpers.js";
-import { Cursors as y } from "../types/cursors.js";
-import { SizeVariant as i } from "../types/common.js";
-import { TypographyVariant as f } from "../types/typography.js";
-const m = a.size[i.Xxl], s = 104, $ = {
-  default: {
-    display: n.flex,
-    flexDirection: "row",
-    justifyContent: "space-between",
-    width: "100%"
-  },
-  separator: {
-    default: {
-      width: "100%",
-      position: "relative",
-      zIndex: -100,
-      top: `${m.height / 2}px`,
-      marginLeft: `-${s / 2}px`,
-      marginRight: `-${s / 2}px`,
-      transition: r(l, "transitions.stepper.separator"),
-      borderTop: c.generic({
-        color: r(e, "border.default"),
-        width: l.borderMedium
-      })
-    },
-    [o.Active]: {},
-    [o.Complete]: {
-      borderTopColor: r(e, "border.primary.default")
-    },
-    [o.Inactive]: {}
-  },
-  step: {
-    default: {
-      display: n.flex,
-      flexDirection: "column",
-      alignItems: p.center,
-      justifyContent: "space-between",
-      minWidth: `${s}px`
-    },
-    [o.Active]: {},
-    [o.Inactive]: {},
-    [o.Complete]: {
-      cursor: y.Pointer
-    }
-  },
-  stepIcon: {
-    default: {
-      display: n.flex,
-      alignItems: p.center,
-      justifyContent: "center",
-      borderRadius: u.round,
-      border: c.generic({
-        width: l.borderMedium
-      }),
-      fontSize: d[f.H5],
-      transition: r(l, "transitions.stepper.stepIcon"),
-      colors: r(e, "text.default"),
-      ...m
-    },
-    [o.Active]: {
-      default: {
-        backgroundColor: r(e, "bg.default"),
-        borderColor: r(e, "border.primary.default")
-      },
-      [t.Success]: {},
-      [t.Error]: {
-        backgroundColor: r(e, "bg.fill.error.primary.default"),
-        borderColor: r(e, "bg.fill.error.primary.default")
-      }
-    },
-    [o.Inactive]: {
-      default: {
-        backgroundColor: r(e, "bg.default")
-      },
-      [t.Success]: {},
-      [t.Error]: {}
-    },
-    [o.Complete]: {
-      default: {
-        fontWeight: b.weight.medium,
-        backgroundColor: r(e, "bg.fill.primary.default")
-      },
-      [t.Success]: {},
-      [t.Error]: {
-        backgroundColor: r(e, "bg.fill.error.secondary.default"),
-        borderColor: r(e, "bg.fill.error.secondary.default")
-      }
-    },
-    [t.Success]: {
-      default: {},
-      [t.Success]: {},
-      [t.Error]: {}
-    }
-  },
-  stepLabel: {
-    default: {
-      marginTop: g[i.Sm],
-      fontSize: d[f.Body1],
-      colors: r(e, "text.default")
-    },
-    [o.Active]: {},
-    [o.Inactive]: {},
-    [o.Complete]: {},
-    [t.Error]: {},
-    [t.Success]: {}
-  },
-  icons: {
-    active: {
-      name: "check",
-      fill: r(e, "icon.primary.active"),
-      ...r(a, ["size", i.Md], {})
-    },
-    inactive: {
-      name: "check",
-      fill: r(e, "icon.primary.default"),
-      ...r(a, ["size", i.Md], {})
-    },
-    complete: {
-      name: "check",
-      fill: r(e, "bg.fill.secondary.default"),
-      ...r(a, ["size", i.Md], {})
-    },
-    error: {
-      name: "cross",
-      fill: r(e, "icon.error"),
-      ...r(a, ["size", i.Sm], {})
-    },
-    errorActive: {
-      name: "cross",
-      fill: r(e, "neutral.white"),
-      ...r(a, ["size", i.Sm], {})
-    }
-  }
-};
-export {
-  $ as stepper
-};

package/tokens/switch.d.ts

@@ -1,67 +0,0 @@
-export declare const switchToken: {
-    default: {
-        position: string;
-        display: string;
-        width: string;
-        height: string;
-        flexShrink: number;
-        borderRadius: string;
-    };
-    label: {
-        right: {
-            order: number;
-        };
-    };
-    wrapper: {
-        default: {
-            display: string;
-            gap: string | number;
-            justifyContent: string;
-            cursor: string;
-        };
-        disabled: {
-            cursor: string;
-            opacity: string;
-        };
-    };
-    slider: {
-        default: {
-            position: string;
-            left: number;
-            right: number;
-            top: number;
-            bottom: number;
-            transition: string;
-            backgroundColor: string;
-            borderRadius: string;
-            '&::before': {
-                position: string;
-                content: string;
-                borderRadius: string;
-                width: string;
-                height: string;
-                left: string;
-                bottom: string;
-                transition: string;
-                backgroundColor: string;
-            };
-        };
-        checked: {
-            backgroundColor: string;
-            '&::before': {
-                transform: string;
-            };
-        };
-    };
-    checkbox: {
-        border: number;
-        clip: string;
-        height: string;
-        margin: string;
-        overflow: string;
-        padding: number;
-        position: string;
-        whiteSpace: string;
-        width: string;
-    };
-};