gd-design-library 0.7.0 → 0.7.2

package/tokens/inputfile.js

@@ -1,18 +0,0 @@
-import { Z_INDEX as i } from "../constants/positioning.js";
-const o = {
-  default: {
-    overflow: "hidden",
-    position: "relative"
-  },
-  input: {
-    opacity: 0,
-    inset: 0,
-    width: "100%",
-    height: "100%",
-    position: "absolute",
-    zIndex: i.NEGATIVE
-  }
-};
-export {
-  o as inputfile
-};

package/tokens/label.d.ts

@@ -1,6 +0,0 @@
-export declare const label: {
-    default: {
-        cursor: string;
-        display: string;
-    };
-};

package/tokens/label.js

@@ -1,10 +0,0 @@
-import { cursors as r } from "./cursors.js";
-const e = {
-  default: {
-    cursor: r.pointer,
-    display: "flex"
-  }
-};
-export {
-  e as label
-};

package/tokens/link.d.ts

@@ -1,80 +0,0 @@
-import { Cursors } from '../types';
-export declare const link: {
-    default: {
-        fontFamily: string;
-        fontSize: string;
-        fontWeight: string;
-        lineHeight: string;
-        color: string;
-        position: string;
-        '&:visited': {
-            color: string;
-            '&::after': {
-                borderBottom: string;
-            };
-        };
-        '&:focus, &:active, &:focus-visible': {
-            outline: string;
-        };
-        "&.Link--disabled": {
-            color: string;
-            cursor: Cursors;
-            textDecoration: string;
-            backgroundColor: string;
-            '&::after': {
-                borderBottomColor: string;
-            };
-        };
-    };
-    primary: {
-        '&::after': {
-            content: string;
-            position: string;
-            right: number;
-            bottom: number;
-            left: number;
-            borderBottom: string;
-        };
-        '&:hover': {
-            backgroundColor: string;
-            '&::after': {
-                borderBottomColor: string;
-            };
-        };
-    };
-    secondary: {
-        '&::after': {
-            content: string;
-            position: string;
-            right: number;
-            bottom: number;
-            left: number;
-            borderBottom: string;
-        };
-        '&:hover': {
-            backgroundColor: string;
-            '&::after': {
-                borderBottomColor: string;
-            };
-        };
-    };
-    inverted: {
-        '&::after': {
-            content: string;
-            position: string;
-            right: number;
-            bottom: number;
-            left: number;
-            borderBottom: string;
-        };
-        '&:hover': {
-            backgroundColor: string;
-            '&::after': {
-                borderBottomColor: string;
-            };
-        };
-    };
-    inherit: {
-        color: string;
-    };
-};

package/tokens/link.js

@@ -1,66 +0,0 @@
-import { spacing as e } from "./spacing.js";
-import { font as m } from "./font.js";
-import { colors as t } from "./colors.js";
-import { borders as n } from "./borders.js";
-import { values as a } from "./values.js";
-import { Cursors as s } from "../types/cursors.js";
-import { LinkVariant as r } from "../types/link.js";
-import { get as o } from "../utils/helpers.js";
-const i = (l = o(t, "text.default"), f = "transparent", d = o(t, "text.default")) => ({
-  "&::after": {
-    content: '""',
-    position: "absolute",
-    right: e.none,
-    bottom: e.none,
-    left: e.none,
-    borderBottom: `1px solid ${l}`
-  },
-  "&:hover": {
-    backgroundColor: f,
-    "&::after": {
-      borderBottomColor: d
-    }
-  }
-}), y = {
-  default: {
-    fontFamily: m.family,
-    fontSize: "inherit",
-    fontWeight: "inherit",
-    lineHeight: "inherit",
-    color: t.text.default,
-    position: "relative",
-    "&:visited": {
-      color: t.text.caption,
-      "&::after": {
-        borderBottom: n.generic({
-          width: a.borderThin,
-          color: o(t, "bg.fill.primary.default")
-        })
-      }
-    },
-    "&:focus, &:active, &:focus-visible": {
-      outline: n.generic({
-        width: a.borderThin,
-        color: o(t, "border.info")
-      })
-    },
-    "&.Link--disabled": {
-      color: t.text.disabled,
-      cursor: s.Default,
-      textDecoration: "none",
-      backgroundColor: "transparent",
-      "&::after": {
-        borderBottomColor: "transparent"
-      }
-    }
-  },
-  [r.Primary]: i(),
-  [r.Secondary]: i(o(t, "text.default"), o(t, "bg.fill.primary.default"), "transparent"),
-  [r.Inverted]: i("transparent", "transparent", o(t, "text.default")),
-  [r.Inherit]: {
-    color: "inherit"
-  }
-};
-export {
-  y as link
-};

package/tokens/list.d.ts

@@ -1,89 +0,0 @@
-export declare const list: {
-    wrapper: {
-        default: {
-            listStyle: string;
-            padding: number;
-            margin: number;
-        };
-        "ordered-circle": {
-            counterReset: string;
-            paddingLeft: number;
-        };
-        "ordered-square": {
-            counterReset: string;
-            paddingLeft: number;
-        };
-    };
-    item: {
-        default: {
-            display: string;
-            alignItems: string;
-            flexDirection: string;
-            margin: string;
-            '&:first-child': {
-                margin: string;
-            };
-        };
-        "ordered-circle": {
-            '&::before': {
-                content: string;
-                counterIncrement: string;
-                background: string;
-                fontFamily: string;
-                fontSize: string;
-                fontWeight: number;
-                width: string;
-                height: string;
-                color: string;
-                display: string;
-                alignItems: string;
-                justifyContent: string;
-                marginRight: string;
-                borderRadius: string;
-            };
-        };
-        "ordered-square": {
-            '&::before': {
-                content: string;
-                counterIncrement: string;
-                background: string;
-                fontFamily: string;
-                fontSize: string;
-                fontWeight: number;
-                width: string;
-                height: string;
-                color: string;
-                display: string;
-                alignItems: string;
-                justifyContent: string;
-                marginRight: string;
-            };
-        };
-        "unordered-check": {
-            counterReset: string;
-            paddingLeft: number;
-            "& .List__bulletPoint": {
-                marginRight: string;
-                color: string;
-            };
-        };
-        "unordered-dot": {
-            counterReset: string;
-            paddingLeft: number;
-            "& .List__bulletPoint": {
-                marginRight: string;
-                color: string;
-            };
-        };
-    };
-    icons: {
-        bulletDot: {
-            name: string;
-            width: number;
-            height: number;
-        };
-        bulletCheck: {
-            name: string;
-        };
-    };
-};

package/tokens/list.js

@@ -1,87 +0,0 @@
-import { radius as d } from "./radius.js";
-import { spacing as e } from "./spacing.js";
-import { colors as o } from "./colors.js";
-import { font as n } from "./font.js";
-import { ListVariant as t } from "../types/list.js";
-import { SizeVariant as r } from "../types/common.js";
-import { TypographyVariant as m } from "../types/typography.js";
-const i = {
-  content: "counter(list-counter)",
-  counterIncrement: "list-counter",
-  background: o.primary.default,
-  fontFamily: n.family,
-  fontSize: n.size[m.Body2],
-  fontWeight: n.weight.medium,
-  width: e[r.Lg],
-  height: e[r.Lg],
-  color: o.text.default,
-  display: "flex",
-  alignItems: "center",
-  justifyContent: "center",
-  marginRight: e[r.Sm]
-}, a = {
-  counterReset: "list-counter",
-  paddingLeft: e.none,
-  "& .List__bulletPoint": {
-    marginRight: e[r.Sm],
-    color: o.primary.default
-  }
-}, h = {
-  wrapper: {
-    default: {
-      listStyle: "none",
-      padding: e.none,
-      margin: e.none
-    },
-    [t.OrderedCircle]: {
-      counterReset: "list-counter",
-      paddingLeft: e.none
-    },
-    [t.OrderedSquare]: {
-      counterReset: "list-counter",
-      paddingLeft: e.none
-    }
-  },
-  item: {
-    default: {
-      display: "flex",
-      alignItems: "center",
-      flexDirection: "row",
-      margin: `${e[r.Sm]} 0`,
-      "&:first-child": {
-        // reset first item top margin to align with other blocks by start
-        margin: `0 0 ${e[r.Sm]}`
-      }
-    },
-    [t.OrderedCircle]: {
-      "&::before": {
-        borderRadius: d.round,
-        ...i
-      }
-    },
-    [t.OrderedSquare]: {
-      "&::before": {
-        ...i
-      }
-    },
-    [t.UnorderedCheck]: {
-      ...a
-    },
-    [t.UnorderedDot]: {
-      ...a
-    }
-  },
-  icons: {
-    bulletDot: {
-      name: "dot",
-      width: 6,
-      height: 6
-    },
-    bulletCheck: {
-      name: "check"
-    }
-  }
-};
-export {
-  h as list
-};

package/tokens/loader.d.ts

@@ -1,135 +0,0 @@
-export declare const loader: {
-    default: {
-        display: string;
-    };
-    inline: {};
-    section: {};
-    fullPage: {};
-    circle: {
-        default: {
-            border: string;
-            borderTop: string;
-            borderRadius: string;
-        };
-        xs: {
-            borderWidth: string;
-            width: string;
-            height: string;
-            minWidth: string;
-            minHeight: string;
-        };
-        sm: {
-            borderWidth: string;
-            width: string;
-            height: string;
-            maxWidth: string;
-            maxHeight: string;
-        };
-        md: {
-            borderWidth: string;
-            width: string;
-            height: string;
-            maxWidth: string;
-            maxHeight: string;
-        };
-        lg: {
-            borderWidth: string;
-            width: string;
-            height: string;
-            maxWidth: string;
-            maxHeight: string;
-        };
-        xl: {
-            borderWidth: string;
-            width: string;
-            height: string;
-            maxWidth: string;
-            maxHeight: string;
-        };
-    };
-    dots: {
-        default: {
-            display: string;
-            justifyContent: string;
-            alignItems: string;
-        };
-        xs: {
-            gap: string | number;
-            '.dot': {
-                background: string;
-                width: string;
-                height: string;
-                '&:nth-of-type(1)': {
-                    animationDelay: string;
-                };
-                '&:nth-of-type(2)': {
-                    animationDelay: string;
-                };
-            };
-        };
-        sm: {
-            gap: string | number;
-            '.dot': {
-                background: string;
-                width: string;
-                height: string;
-                '&:nth-of-type(1)': {
-                    animationDelay: string;
-                };
-                '&:nth-of-type(2)': {
-                    animationDelay: string;
-                };
-            };
-        };
-        md: {
-            gap: string | number;
-            '.dot': {
-                background: string;
-                width: string;
-                height: string;
-                '&:nth-of-type(1)': {
-                    animationDelay: string;
-                };
-                '&:nth-of-type(2)': {
-                    animationDelay: string;
-                };
-            };
-        };
-        lg: {
-            gap: string | number;
-            '.dot': {
-                background: string;
-                width: string;
-                height: string;
-                '&:nth-of-type(1)': {
-                    animationDelay: string;
-                };
-                '&:nth-of-type(2)': {
-                    animationDelay: string;
-                };
-            };
-        };
-        xl: {
-            gap: string | number;
-            '.dot': {
-                background: string;
-                width: string;
-                height: string;
-                '&:nth-of-type(1)': {
-                    animationDelay: string;
-                };
-                '&:nth-of-type(2)': {
-                    animationDelay: string;
-                };
-            };
-        };
-    };
-    animation: {
-        circle: {
-            name: string;
-        };
-        dots: {
-            name: string;
-        };
-    };
-};

package/tokens/loader.js

@@ -1,143 +0,0 @@
-import { getSpacing as a } from "./utils.js";
-import { flexAlignItems as e, display as p } from "./display.js";
-import { radius as o } from "./radius.js";
-import { colors as i } from "./colors.js";
-import { SizeVariant as t } from "../types/common.js";
-const x = {
-  default: {
-    display: "block"
-  },
-  inline: {},
-  section: {},
-  fullPage: {},
-  circle: {
-    default: {
-      border: `3px solid ${i.transparent}`,
-      borderTop: `3px solid ${i.bg.fill.primary.default}`,
-      borderRadius: o.round
-    },
-    [t.Xs]: {
-      borderWidth: "1px",
-      width: "16px",
-      height: "16px",
-      minWidth: "16px",
-      minHeight: "16px"
-    },
-    [t.Sm]: {
-      borderWidth: "2px",
-      width: "24px",
-      height: "24px",
-      maxWidth: "24px",
-      maxHeight: "24px"
-    },
-    [t.Md]: {
-      borderWidth: "3px",
-      width: "32px",
-      height: "32px",
-      maxWidth: "32px",
-      maxHeight: "32px"
-    },
-    [t.Lg]: {
-      borderWidth: "4px",
-      width: "48px",
-      height: "48px",
-      maxWidth: "48px",
-      maxHeight: "48px"
-    },
-    [t.Xl]: {
-      borderWidth: "5px",
-      width: "54px",
-      height: "54px",
-      maxWidth: "54px",
-      maxHeight: "54px"
-    }
-  },
-  dots: {
-    default: {
-      display: p.flex,
-      justifyContent: e.center,
-      alignItems: e.center
-    },
-    [t.Xs]: {
-      gap: a(1),
-      ".dot": {
-        background: i.bg.fill.primary.default,
-        width: "8px",
-        height: "8px",
-        "&:nth-of-type(1)": {
-          animationDelay: "-0.32s"
-        },
-        "&:nth-of-type(2)": {
-          animationDelay: "-0.16s"
-        }
-      }
-    },
-    [t.Sm]: {
-      gap: a(2),
-      ".dot": {
-        background: i.bg.fill.primary.default,
-        width: "12px",
-        height: "12px",
-        "&:nth-of-type(1)": {
-          animationDelay: "-0.32s"
-        },
-        "&:nth-of-type(2)": {
-          animationDelay: "-0.16s"
-        }
-      }
-    },
-    [t.Md]: {
-      gap: a(2),
-      ".dot": {
-        background: i.bg.fill.primary.default,
-        width: "16px",
-        height: "16px",
-        "&:nth-of-type(1)": {
-          animationDelay: "-0.32s"
-        },
-        "&:nth-of-type(2)": {
-          animationDelay: "-0.16s"
-        }
-      }
-    },
-    [t.Lg]: {
-      gap: a(2),
-      ".dot": {
-        background: i.bg.fill.primary.default,
-        width: "24px",
-        height: "24px",
-        "&:nth-of-type(1)": {
-          animationDelay: "-0.32s"
-        },
-        "&:nth-of-type(2)": {
-          animationDelay: "-0.16s"
-        }
-      }
-    },
-    [t.Xl]: {
-      gap: a(2),
-      ".dot": {
-        background: i.bg.fill.primary.default,
-        width: "32px",
-        height: "32px",
-        "&:nth-of-type(1)": {
-          animationDelay: "-0.32s"
-        },
-        "&:nth-of-type(2)": {
-          animationDelay: "-0.16s"
-        }
-      }
-    }
-  },
-  animation: {
-    circle: {
-      name: "spinKeyframes"
-    },
-    dots: {
-      name: "bounceKeyframes"
-    }
-  }
-};
-export {
-  x as loader
-};

package/tokens/menu.d.ts

@@ -1,15 +0,0 @@
-export declare const menu: {
-    wrapper: {
-        default: {
-            padding: string;
-            height: string;
-        };
-    };
-    content: {
-        default: {
-            backgroundColor: string;
-            position: string;
-            boxShadow: string;
-        };
-    };
-};

package/tokens/menu.js

@@ -1,19 +0,0 @@
-import { colors as o } from "./colors.js";
-const e = {
-  wrapper: {
-    default: {
-      padding: "0",
-      height: "24px"
-    }
-  },
-  content: {
-    default: {
-      backgroundColor: o.neutral.white,
-      position: "absolute",
-      boxShadow: "0 2px 3px -1px #00000033"
-    }
-  }
-};
-export {
-  e as menu
-};