gd-design-library 0.7.0 → 0.7.2

package/tokens/rating.js

@@ -1,73 +0,0 @@
-import { cursors as i } from "./cursors.js";
-import { display as e } from "./display.js";
-import { values as r } from "./values.js";
-import { get as o } from "../utils/helpers.js";
-import { SizeVariant as t } from "../types/common.js";
-const f = {
-  default: {
-    display: e.inlineFlex,
-    gap: 0,
-    position: "relative",
-    overflow: "hidden"
-  },
-  progress: {
-    default: {
-      position: "absolute",
-      display: e.flex,
-      overflow: "hidden",
-      left: 0,
-      svg: {
-        flexShrink: 0,
-        flexGrow: 0
-      }
-    }
-  },
-  radioInput: {
-    default: {
-      display: e.none
-    }
-  },
-  label: {
-    default: {
-      cursor: i.pointer
-    },
-    active: {
-      "&:hover": {
-        transform: "scale(1.2)",
-        transition: o(r, "transitions.rating.label")
-      }
-    },
-    readOnly: {
-      cursor: i.default
-    }
-  },
-  size: {
-    [t.Sm]: {
-      width: 12,
-      height: 12
-    },
-    [t.Md]: {
-      width: 24,
-      height: 24
-    },
-    [t.Lg]: {
-      width: 48,
-      height: 48
-    },
-    [t.Xl]: {
-      width: 60,
-      height: 60
-    }
-  },
-  icons: {
-    rateActive: {
-      name: "star"
-    },
-    rateInactive: {
-      name: "starOutlined"
-    }
-  }
-};
-export {
-  f as rating
-};

package/tokens/reset.d.ts

@@ -1 +0,0 @@
-export declare const reset: {};

package/tokens/reset.js

@@ -1,4 +0,0 @@
-const e = {};
-export {
-  e as reset
-};

package/tokens/row.d.ts

@@ -1,5 +0,0 @@
-export declare const row: {
-    default: {
-        display: string;
-    };
-};

package/tokens/row.js

@@ -1,8 +0,0 @@
-const e = {
-  default: {
-    display: "flex"
-  }
-};
-export {
-  e as row
-};

package/tokens/scroll.d.ts

@@ -1,91 +0,0 @@
-export declare const scroll: {
-    container: {
-        default: {
-            position: string;
-            display: string;
-            overflow: string;
-            isolation: string;
-            maxBlockSize: string;
-            '&::-webkit-scrollbar, &::-webkit-scrollbar-thumb': {
-                background: string;
-                width: string;
-                height: string;
-            };
-        };
-    };
-    content: {
-        default: {
-            position: string;
-            zIndex: number;
-            flex: number;
-            flexBasis: string;
-            height: string;
-        };
-    };
-    scrollbars: {
-        default: {
-            position: string;
-            top: string;
-            left: string;
-            zIndex: number;
-            minWidth: string;
-            minHeight: string;
-            maxWidth: string;
-            maxHeight: string;
-            float: string;
-            marginRight: string;
-            marginInlineStart: string;
-            marginInlineEnd: string;
-            pointerEvents: string;
-        };
-    };
-    scrollbar: {
-        default: {
-            position: string;
-            pointerEvents: string;
-            opacity: number;
-            transition: string;
-            '&:hover': {
-                opacity: number;
-            };
-        };
-        vertical: {
-            right: number;
-            bottom: string;
-            top: number;
-            width: string;
-        };
-        horizontal: {
-            left: number;
-            bottom: number;
-            right: string;
-            height: string;
-        };
-    };
-    thumb: {
-        default: {
-            position: string;
-            cursor: string;
-            pointerEvents: string;
-            background: string;
-            backgroundClip: string;
-            boxSizing: string;
-        };
-        vertical: {
-            right: number;
-            bottom: number;
-            top: number;
-            width: string;
-            minHeight: string;
-            transition: string;
-        };
-        horizontal: {
-            left: number;
-            right: number;
-            bottom: number;
-            height: string;
-            minWidth: string;
-            transition: string;
-        };
-    };
-};

package/tokens/scroll.js

@@ -1,99 +0,0 @@
-import { colors as n } from "./colors.js";
-import { display as a } from "./display.js";
-import { spacing as i } from "./spacing.js";
-import { values as o } from "./values.js";
-import { Z_INDEX as r } from "../constants/positioning.js";
-const t = 8, m = {
-  container: {
-    default: {
-      position: "relative",
-      display: a.flex,
-      overflow: "auto",
-      isolation: "isolate",
-      maxBlockSize: "100%",
-      "&::-webkit-scrollbar, &::-webkit-scrollbar-thumb": {
-        background: "transparent",
-        width: "0",
-        height: "0"
-      }
-    }
-  },
-  content: {
-    default: {
-      position: "relative",
-      zIndex: r.ZERO,
-      flex: 1,
-      flexBasis: "auto",
-      height: "max-content"
-    }
-  },
-  scrollbars: {
-    default: {
-      position: "sticky",
-      top: "0",
-      left: "0",
-      zIndex: r.FIRST,
-      minWidth: "calc(100% - 1px)",
-      minHeight: "calc(100% - 1px)",
-      maxWidth: "calc(100% - 1px)",
-      maxHeight: "calc(100% - 1px)",
-      float: "left",
-      marginRight: "calc(-100% + 1px)",
-      marginInlineStart: "0",
-      marginInlineEnd: "calc(-100% + 1px)",
-      pointerEvents: "none"
-    }
-  },
-  scrollbar: {
-    default: {
-      position: "absolute",
-      pointerEvents: "auto",
-      opacity: 0.2,
-      transition: o.transitions.scroll.scrollbar,
-      "&:hover": {
-        opacity: 1
-      }
-    },
-    vertical: {
-      right: 0,
-      bottom: `${t}px`,
-      top: 0,
-      width: `${t}px`
-    },
-    horizontal: {
-      left: 0,
-      bottom: 0,
-      right: `${t}px`,
-      height: `${t}px`
-    }
-  },
-  thumb: {
-    default: {
-      position: "absolute",
-      cursor: "pointer",
-      pointerEvents: "auto",
-      background: n.neutral["grey.80"],
-      backgroundClip: "content-box",
-      boxSizing: "border-box"
-    },
-    vertical: {
-      right: 0,
-      bottom: 0,
-      top: 0,
-      width: `${t}px`,
-      minHeight: i.md,
-      transition: o.transitions.scroll.thumb
-    },
-    horizontal: {
-      left: 0,
-      right: 0,
-      bottom: 0,
-      height: `${t}px`,
-      minWidth: i.md,
-      transition: o.transitions.scroll.thumb
-    }
-  }
-};
-export {
-  m as scroll
-};

package/tokens/search.d.ts

@@ -1,39 +0,0 @@
-export declare const search: {
-    default: {};
-    input: {
-        default: {
-            width: string;
-            boxSizing: string;
-        };
-    };
-    dropdownHeader: {
-        row: {};
-        link: {
-            default: {};
-            typography: {};
-        };
-        icon: {};
-    };
-    renderer: {
-        row: {
-            width: string;
-            padding: string;
-        };
-        link: {
-            display: string;
-            alignItems: string;
-            '&:after': {
-                borderBottom: string;
-            };
-            '& svg': {
-                marginLeft: string;
-            };
-        };
-        linkIcon: {
-            fill: string;
-            name: string;
-            width: number;
-            height: number;
-        };
-    };
-};

package/tokens/search.js

@@ -1,45 +0,0 @@
-import { spacing as r } from "./spacing.js";
-import { colors as i } from "./colors.js";
-import { flexAlignItems as o, display as e } from "./display.js";
-const a = {
-  default: {},
-  input: {
-    default: {
-      width: "100%",
-      boxSizing: "border-box"
-    }
-  },
-  dropdownHeader: {
-    row: {},
-    link: {
-      default: {},
-      typography: {}
-    },
-    icon: {}
-  },
-  renderer: {
-    row: {
-      width: "100%",
-      padding: `${r.md} ${r.md} 0`
-    },
-    link: {
-      display: e.flex,
-      alignItems: o.center,
-      "&:after": {
-        borderBottom: "none"
-      },
-      "& svg": {
-        marginLeft: r.md
-      }
-    },
-    linkIcon: {
-      fill: i.icon.primary.active,
-      name: "arrowRight",
-      width: 10,
-      height: 10
-    }
-  }
-};
-export {
-  a as search
-};

package/tokens/searchModal.d.ts

@@ -1,155 +0,0 @@
-import { ButtonVariant, FlexDirection } from '../types';
-export declare const searchModal: {
-    default: {};
-    wrapper: {
-        padding: string;
-        overflowY: string;
-    };
-    input: {
-        default: {
-            '& input[type="search"]': {
-                padding: string;
-                height: string;
-                fontSize: string;
-                '&::placeholder': {
-                    color: any;
-                };
-                '&::-webkit-search-cancel-button': {
-                    appearance: string;
-                };
-                '&::-ms-clear': {
-                    display: string;
-                };
-            };
-        };
-        endIcon: {
-            margin: string;
-            padding: string | number;
-            cursor: string;
-        };
-        icons: {
-            close: {
-                name: string;
-                width: number;
-                height: number;
-            };
-        };
-    };
-    loader: {
-        default: {
-            display: string;
-            flexDirection: FlexDirection;
-            gap: string | number;
-        };
-    };
-    items: {
-        default: {
-            display: string;
-            flexDirection: FlexDirection;
-        };
-        newSearchBtn: {
-            styles: {
-                '.gd-button__content': {
-                    justifyContent: string;
-                };
-                fontSize: string;
-                fontWeight: number;
-                lineHeight: string;
-                textAlign: string;
-                color: string;
-                padding: string;
-            };
-            attrs: {
-                variant: ButtonVariant;
-            };
-        };
-        noResult: {
-            fontSize: string;
-            fontWeight: number;
-            lineHeight: string;
-            display: string;
-            flexDirection: FlexDirection;
-            alignItems: string;
-            gap: string | number;
-            padding: string;
-            color: string;
-        };
-        groupTitle: {
-            fontSize: string;
-            fontWeight: number;
-            lineHeight: string;
-            textAlign: string;
-            padding: string;
-            color: string;
-        };
-        item: {
-            styles: {
-                fontSize: string;
-                fontWeight: number;
-                lineHeight: string;
-                textAlign: string;
-                gap: string | number;
-                padding: string;
-                color: string;
-                '.gd-button__content': {
-                    display: string;
-                };
-            };
-            attrs: {
-                variant: ButtonVariant;
-            };
-        };
-        itemRow: {
-            alignItems: string;
-            justifyContent: string;
-            gap: string | number;
-            flexWrap: string;
-        };
-        itemColumn: {
-            gap: string | number;
-            minWidth: number;
-            flexWrap: string;
-        };
-        itemContent: {
-            default: {};
-            title: {
-                flex: number;
-                minWidth: number;
-                whiteSpace: string;
-                textOverflow: string;
-                overflow: string;
-            };
-            description: {
-                flex: number;
-                minWidth: number;
-                whiteSpace: string;
-                textOverflow: string;
-                overflow: string;
-                color: string;
-            };
-            date: {
-                flex: string;
-                whiteSpace: string;
-                color: string;
-            };
-        };
-        icons: {
-            newChat: {
-                width: number;
-                height: number;
-                name: string;
-                fill: string;
-            };
-            noResults: {
-                width: number;
-                height: number;
-                name: string;
-            };
-            item: {
-                width: number;
-                height: number;
-                fill: string;
-            };
-        };
-    };
-};

package/tokens/searchModal.js

@@ -1,159 +0,0 @@
-import { getSpacing as t } from "./utils.js";
-import { typography as r } from "./typography.js";
-import { icon as n } from "./icon.js";
-import { flexAlignItems as a, display as o } from "./display.js";
-import { cursors as m } from "./cursors.js";
-import { font as c } from "./font.js";
-import { colors as e } from "./colors.js";
-import { calculateJustify as f } from "../utils/layout.js";
-import { ButtonVariant as d } from "../types/button.js";
-import { FlexDirection as l } from "../types/layout.js";
-import { get as s } from "../utils/helpers.js";
-import { SizeVariant as p } from "../types/common.js";
-import { TypographyVariant as i } from "../types/typography.js";
-const z = {
-  default: {},
-  wrapper: {
-    padding: `${t(4)} ${t(3)}`,
-    overflowY: "auto"
-  },
-  input: {
-    default: {
-      '& input[type="search"]': {
-        padding: `${t(3)} 0 ${t(3)} ${t(7)}`,
-        height: "54px",
-        fontSize: c.size[i.Body2],
-        "&::placeholder": {
-          color: s(e, ["neutral", "grey.60"])
-        },
-        "&::-webkit-search-cancel-button": {
-          appearance: o.none
-        },
-        "&::-ms-clear": {
-          display: o.none
-        }
-      }
-    },
-    endIcon: {
-      margin: `0 ${t(3)} 0 0`,
-      padding: t(2),
-      cursor: m.pointer
-    },
-    icons: {
-      close: {
-        name: "cross",
-        width: 12,
-        height: 12
-      }
-    }
-  },
-  loader: {
-    default: {
-      display: o.flex,
-      flexDirection: l.Column,
-      gap: t(2)
-    }
-  },
-  items: {
-    default: {
-      display: o.flex,
-      flexDirection: l.Column
-    },
-    newSearchBtn: {
-      styles: {
-        textAlign: "left",
-        color: e.text.default,
-        padding: `${t(2)} ${t(4)}`,
-        ...r[i.Body2],
-        ".gd-button__content": {
-          justifyContent: a.start
-        }
-      },
-      attrs: {
-        variant: d.Text
-      }
-    },
-    noResult: {
-      display: o.flex,
-      flexDirection: l.Row,
-      alignItems: a.center,
-      gap: t(2),
-      padding: `${t(2)} ${t(4)}`,
-      color: e.text.caption,
-      ...r[i.Body2]
-    },
-    groupTitle: {
-      textAlign: "left",
-      padding: `${t(2)} ${t(4)}`,
-      color: e.text.caption,
-      ...r[i.Body2]
-    },
-    item: {
-      styles: {
-        textAlign: "left",
-        gap: t(2),
-        padding: `${t()} ${t(4)}`,
-        color: e.text.default,
-        ".gd-button__content": {
-          display: o.block
-        },
-        ...r[i.Body2]
-      },
-      attrs: {
-        variant: d.Text
-      }
-    },
-    itemRow: {
-      alignItems: a.center,
-      justifyContent: f("between"),
-      gap: t(2),
-      flexWrap: "noWrap"
-    },
-    itemColumn: {
-      gap: t(0.5),
-      minWidth: 0,
-      flexWrap: "noWrap"
-    },
-    itemContent: {
-      default: {},
-      title: {
-        flex: 1,
-        minWidth: 0,
-        whiteSpace: "nowrap",
-        textOverflow: "ellipsis",
-        overflow: "hidden"
-      },
-      description: {
-        flex: 1,
-        minWidth: 0,
-        whiteSpace: "nowrap",
-        textOverflow: "ellipsis",
-        overflow: "hidden",
-        color: e.text.caption
-      },
-      date: {
-        flex: "0 0",
-        whiteSpace: "nowrap",
-        color: e.text.caption
-      }
-    },
-    icons: {
-      newChat: {
-        name: "edit",
-        fill: e.icon.primary.default,
-        ...n.size[p.Sm]
-      },
-      noResults: {
-        name: "search",
-        ...n.size[p.Sm]
-      },
-      item: {
-        fill: e.icon.primary.default,
-        ...n.size[p.Sm]
-      }
-    }
-  }
-};
-export {
-  z as searchModal
-};