@lets-events/react 2.0.0

package/.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": "@lets-events/eslint-config"
+}

package/.turbo/turbo-build.log

@@ -0,0 +1,18 @@
+
+> @lets-events/react@2.0.0 build
+> tsup src/index.tsx  --format esm,cjs --dts --external react
+
+CLI Building entry: src/index.tsx
+CLI Using tsconfig: tsconfig.json
+CLI tsup v8.4.0
+CLI Target: es6
+ESM Build start
+CJS Build start
+CJS dist\index.js 6.18 KB
+CJS ⚡️ Build success in 43ms
+ESM dist\index.mjs 5.27 KB
+ESM ⚡️ Build success in 44ms
+DTS Build start
+DTS ⚡️ Build success in 1906ms
+DTS dist\index.d.mts 8.25 KB
+DTS dist\index.d.ts  8.25 KB

package/CHANGELOG.md

@@ -0,0 +1,7 @@
+# @lets-events/react
+
+## 2.0.0
+
+### Major Changes
+
+- adding packages ds

package/dist/index.d.mts

@@ -0,0 +1,325 @@
+import * as _stitches_react_types_styled_component from '@stitches/react/types/styled-component';
+import * as _stitches_react_types_css_util from '@stitches/react/types/css-util';
+import { ComponentProps, ElementType } from 'react';
+
+declare const Text: _stitches_react_types_styled_component.StyledComponent<"p", {
+    size?: "xs" | "sm" | "md" | "lg" | "2xl" | "4xl" | "full" | undefined;
+}, {}, _stitches_react_types_css_util.CSS<{}, {
+    colors: {
+        brand50: string;
+        brand100: string;
+        brand200: string;
+        brand300: string;
+        brand400: string;
+        brand500: string;
+        brand600: string;
+        brand700: string;
+        brand800: string;
+        brand900: string;
+        brand950: string;
+        blue50: string;
+        blue100: string;
+        blue200: string;
+        blue300: string;
+        blue400: string;
+        blue500: string;
+        blue600: string;
+        blue700: string;
+        blue800: string;
+        blue900: string;
+        blue950: string;
+        red50: string;
+        red100: string;
+        red200: string;
+        red300: string;
+        red400: string;
+        red500: string;
+        red600: string;
+        red700: string;
+        red800: string;
+        red900: string;
+        red950: string;
+        purple50: string;
+        purple100: string;
+        purple200: string;
+        purple300: string;
+        purple400: string;
+        purple500: string;
+        purple600: string;
+        purple700: string;
+        purple800: string;
+        purple900: string;
+        purple950: string;
+        yellow50: string;
+        yellow100: string;
+        yellow200: string;
+        yellow300: string;
+        yellow400: string;
+        yellow500: string;
+        yellow600: string;
+        yellow700: string;
+        yellow800: string;
+        yellow900: string;
+        yellow950: string;
+        dark50: string;
+        dark100: string;
+        dark200: string;
+        dark300: string;
+        dark400: string;
+        dark500: string;
+        dark600: string;
+        dark700: string;
+        dark800: string;
+        dark900: string;
+        dark950: string;
+        neutral50: string;
+        neutral100: string;
+        neutral200: string;
+        neutral300: string;
+        neutral400: string;
+        neutral500: string;
+        neutral600: string;
+        neutral700: string;
+        neutral800: string;
+        neutral900: string;
+        neutral950: string;
+        green50: string;
+        green100: string;
+        green200: string;
+        green300: string;
+        green400: string;
+        green500: string;
+        green600: string;
+        green700: string;
+        green800: string;
+        green900: string;
+        green950: string;
+        grey50: string;
+        grey100: string;
+        grey200: string;
+        grey300: string;
+        grey400: string;
+        grey500: string;
+        grey600: string;
+        grey700: string;
+        grey800: string;
+        grey900: string;
+        grey950: string;
+    };
+    fontSizes: {
+        2: string;
+        4: string;
+        6: string;
+        8: string;
+        10: string;
+        12: string;
+        13: string;
+        14: string;
+        16: string;
+        18: string;
+        20: string;
+        22: string;
+        24: string;
+        32: string;
+        36: string;
+        40: string;
+        48: string;
+        56: string;
+        64: string;
+        72: string;
+        80: string;
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        '2xl': string;
+        '3xl': string;
+        '4xl': string;
+        full: string;
+    };
+    fonts: {
+        default: string;
+    };
+    fontWeights: {
+        regular: string;
+        medium: string;
+        semibold: string;
+        bold: string;
+    };
+    lineHeights: {
+        smaller: string;
+        shorter: string;
+        short: string;
+        base: string;
+        tall: string;
+    };
+    radii: {
+        px: string;
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        '2xl': string;
+        '3xl': string;
+        '4xl': string;
+        full: string;
+    };
+    space: {
+        2: string;
+        4: string;
+        6: string;
+        8: string;
+        10: string;
+        12: string;
+        13: string;
+        14: string;
+        16: string;
+        18: string;
+        20: string;
+        22: string;
+        24: string;
+        32: string;
+        36: string;
+        40: string;
+        48: string;
+        56: string;
+        64: string;
+        72: string;
+        80: string;
+        full: string;
+    };
+}, {
+    height: "space";
+    width: "space";
+    gap: "space";
+    gridGap: "space";
+    columnGap: "space";
+    gridColumnGap: "space";
+    rowGap: "space";
+    gridRowGap: "space";
+    inset: "space";
+    insetBlock: "space";
+    insetBlockEnd: "space";
+    insetBlockStart: "space";
+    insetInline: "space";
+    insetInlineEnd: "space";
+    insetInlineStart: "space";
+    margin: "space";
+    marginTop: "space";
+    marginRight: "space";
+    marginBottom: "space";
+    marginLeft: "space";
+    marginBlock: "space";
+    marginBlockEnd: "space";
+    marginBlockStart: "space";
+    marginInline: "space";
+    marginInlineEnd: "space";
+    marginInlineStart: "space";
+    padding: "space";
+    paddingTop: "space";
+    paddingRight: "space";
+    paddingBottom: "space";
+    paddingLeft: "space";
+    paddingBlock: "space";
+    paddingBlockEnd: "space";
+    paddingBlockStart: "space";
+    paddingInline: "space";
+    paddingInlineEnd: "space";
+    paddingInlineStart: "space";
+    scrollMargin: "space";
+    scrollMarginTop: "space";
+    scrollMarginRight: "space";
+    scrollMarginBottom: "space";
+    scrollMarginLeft: "space";
+    scrollMarginBlock: "space";
+    scrollMarginBlockEnd: "space";
+    scrollMarginBlockStart: "space";
+    scrollMarginInline: "space";
+    scrollMarginInlineEnd: "space";
+    scrollMarginInlineStart: "space";
+    scrollPadding: "space";
+    scrollPaddingTop: "space";
+    scrollPaddingRight: "space";
+    scrollPaddingBottom: "space";
+    scrollPaddingLeft: "space";
+    scrollPaddingBlock: "space";
+    scrollPaddingBlockEnd: "space";
+    scrollPaddingBlockStart: "space";
+    scrollPaddingInline: "space";
+    scrollPaddingInlineEnd: "space";
+    scrollPaddingInlineStart: "space";
+    top: "space";
+    right: "space";
+    bottom: "space";
+    left: "space";
+    fontSize: "fontSizes";
+    background: "colors";
+    backgroundColor: "colors";
+    backgroundImage: "colors";
+    borderImage: "colors";
+    border: "colors";
+    borderBlock: "colors";
+    borderBlockEnd: "colors";
+    borderBlockStart: "colors";
+    borderBottom: "colors";
+    borderBottomColor: "colors";
+    borderColor: "colors";
+    borderInline: "colors";
+    borderInlineEnd: "colors";
+    borderInlineStart: "colors";
+    borderLeft: "colors";
+    borderLeftColor: "colors";
+    borderRight: "colors";
+    borderRightColor: "colors";
+    borderTop: "colors";
+    borderTopColor: "colors";
+    caretColor: "colors";
+    color: "colors";
+    columnRuleColor: "colors";
+    outline: "colors";
+    outlineColor: "colors";
+    fill: "colors";
+    stroke: "colors";
+    textDecorationColor: "colors";
+    fontFamily: "fonts";
+    fontWeight: "fontWeights";
+    lineHeight: "lineHeights";
+    letterSpacing: "letterSpacings";
+    blockSize: "sizes";
+    minBlockSize: "sizes";
+    maxBlockSize: "sizes";
+    inlineSize: "sizes";
+    minInlineSize: "sizes";
+    maxInlineSize: "sizes";
+    minWidth: "sizes";
+    maxWidth: "sizes";
+    minHeight: "sizes";
+    maxHeight: "sizes";
+    flexBasis: "sizes";
+    gridTemplateColumns: "sizes";
+    gridTemplateRows: "sizes";
+    borderWidth: "borderWidths";
+    borderTopWidth: "borderWidths";
+    borderLeftWidth: "borderWidths";
+    borderRightWidth: "borderWidths";
+    borderBottomWidth: "borderWidths";
+    borderStyle: "borderStyles";
+    borderTopStyle: "borderStyles";
+    borderLeftStyle: "borderStyles";
+    borderRightStyle: "borderStyles";
+    borderBottomStyle: "borderStyles";
+    borderRadius: "radii";
+    borderTopLeftRadius: "radii";
+    borderTopRightRadius: "radii";
+    borderBottomRightRadius: "radii";
+    borderBottomLeftRadius: "radii";
+    boxShadow: "shadows";
+    textShadow: "shadows";
+    transition: "transitions";
+    zIndex: "zIndices";
+}, {}>>;
+interface TextProps extends ComponentProps<typeof Text> {
+    as?: ElementType;
+}
+
+export { Text, type TextProps };

package/dist/index.d.ts

@@ -0,0 +1,325 @@
+import * as _stitches_react_types_styled_component from '@stitches/react/types/styled-component';
+import * as _stitches_react_types_css_util from '@stitches/react/types/css-util';
+import { ComponentProps, ElementType } from 'react';
+
+declare const Text: _stitches_react_types_styled_component.StyledComponent<"p", {
+    size?: "xs" | "sm" | "md" | "lg" | "2xl" | "4xl" | "full" | undefined;
+}, {}, _stitches_react_types_css_util.CSS<{}, {
+    colors: {
+        brand50: string;
+        brand100: string;
+        brand200: string;
+        brand300: string;
+        brand400: string;
+        brand500: string;
+        brand600: string;
+        brand700: string;
+        brand800: string;
+        brand900: string;
+        brand950: string;
+        blue50: string;
+        blue100: string;
+        blue200: string;
+        blue300: string;
+        blue400: string;
+        blue500: string;
+        blue600: string;
+        blue700: string;
+        blue800: string;
+        blue900: string;
+        blue950: string;
+        red50: string;
+        red100: string;
+        red200: string;
+        red300: string;
+        red400: string;
+        red500: string;
+        red600: string;
+        red700: string;
+        red800: string;
+        red900: string;
+        red950: string;
+        purple50: string;
+        purple100: string;
+        purple200: string;
+        purple300: string;
+        purple400: string;
+        purple500: string;
+        purple600: string;
+        purple700: string;
+        purple800: string;
+        purple900: string;
+        purple950: string;
+        yellow50: string;
+        yellow100: string;
+        yellow200: string;
+        yellow300: string;
+        yellow400: string;
+        yellow500: string;
+        yellow600: string;
+        yellow700: string;
+        yellow800: string;
+        yellow900: string;
+        yellow950: string;
+        dark50: string;
+        dark100: string;
+        dark200: string;
+        dark300: string;
+        dark400: string;
+        dark500: string;
+        dark600: string;
+        dark700: string;
+        dark800: string;
+        dark900: string;
+        dark950: string;
+        neutral50: string;
+        neutral100: string;
+        neutral200: string;
+        neutral300: string;
+        neutral400: string;
+        neutral500: string;
+        neutral600: string;
+        neutral700: string;
+        neutral800: string;
+        neutral900: string;
+        neutral950: string;
+        green50: string;
+        green100: string;
+        green200: string;
+        green300: string;
+        green400: string;
+        green500: string;
+        green600: string;
+        green700: string;
+        green800: string;
+        green900: string;
+        green950: string;
+        grey50: string;
+        grey100: string;
+        grey200: string;
+        grey300: string;
+        grey400: string;
+        grey500: string;
+        grey600: string;
+        grey700: string;
+        grey800: string;
+        grey900: string;
+        grey950: string;
+    };
+    fontSizes: {
+        2: string;
+        4: string;
+        6: string;
+        8: string;
+        10: string;
+        12: string;
+        13: string;
+        14: string;
+        16: string;
+        18: string;
+        20: string;
+        22: string;
+        24: string;
+        32: string;
+        36: string;
+        40: string;
+        48: string;
+        56: string;
+        64: string;
+        72: string;
+        80: string;
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        '2xl': string;
+        '3xl': string;
+        '4xl': string;
+        full: string;
+    };
+    fonts: {
+        default: string;
+    };
+    fontWeights: {
+        regular: string;
+        medium: string;
+        semibold: string;
+        bold: string;
+    };
+    lineHeights: {
+        smaller: string;
+        shorter: string;
+        short: string;
+        base: string;
+        tall: string;
+    };
+    radii: {
+        px: string;
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        '2xl': string;
+        '3xl': string;
+        '4xl': string;
+        full: string;
+    };
+    space: {
+        2: string;
+        4: string;
+        6: string;
+        8: string;
+        10: string;
+        12: string;
+        13: string;
+        14: string;
+        16: string;
+        18: string;
+        20: string;
+        22: string;
+        24: string;
+        32: string;
+        36: string;
+        40: string;
+        48: string;
+        56: string;
+        64: string;
+        72: string;
+        80: string;
+        full: string;
+    };
+}, {
+    height: "space";
+    width: "space";
+    gap: "space";
+    gridGap: "space";
+    columnGap: "space";
+    gridColumnGap: "space";
+    rowGap: "space";
+    gridRowGap: "space";
+    inset: "space";
+    insetBlock: "space";
+    insetBlockEnd: "space";
+    insetBlockStart: "space";
+    insetInline: "space";
+    insetInlineEnd: "space";
+    insetInlineStart: "space";
+    margin: "space";
+    marginTop: "space";
+    marginRight: "space";
+    marginBottom: "space";
+    marginLeft: "space";
+    marginBlock: "space";
+    marginBlockEnd: "space";
+    marginBlockStart: "space";
+    marginInline: "space";
+    marginInlineEnd: "space";
+    marginInlineStart: "space";
+    padding: "space";
+    paddingTop: "space";
+    paddingRight: "space";
+    paddingBottom: "space";
+    paddingLeft: "space";
+    paddingBlock: "space";
+    paddingBlockEnd: "space";
+    paddingBlockStart: "space";
+    paddingInline: "space";
+    paddingInlineEnd: "space";
+    paddingInlineStart: "space";
+    scrollMargin: "space";
+    scrollMarginTop: "space";
+    scrollMarginRight: "space";
+    scrollMarginBottom: "space";
+    scrollMarginLeft: "space";
+    scrollMarginBlock: "space";
+    scrollMarginBlockEnd: "space";
+    scrollMarginBlockStart: "space";
+    scrollMarginInline: "space";
+    scrollMarginInlineEnd: "space";
+    scrollMarginInlineStart: "space";
+    scrollPadding: "space";
+    scrollPaddingTop: "space";
+    scrollPaddingRight: "space";
+    scrollPaddingBottom: "space";
+    scrollPaddingLeft: "space";
+    scrollPaddingBlock: "space";
+    scrollPaddingBlockEnd: "space";
+    scrollPaddingBlockStart: "space";
+    scrollPaddingInline: "space";
+    scrollPaddingInlineEnd: "space";
+    scrollPaddingInlineStart: "space";
+    top: "space";
+    right: "space";
+    bottom: "space";
+    left: "space";
+    fontSize: "fontSizes";
+    background: "colors";
+    backgroundColor: "colors";
+    backgroundImage: "colors";
+    borderImage: "colors";
+    border: "colors";
+    borderBlock: "colors";
+    borderBlockEnd: "colors";
+    borderBlockStart: "colors";
+    borderBottom: "colors";
+    borderBottomColor: "colors";
+    borderColor: "colors";
+    borderInline: "colors";
+    borderInlineEnd: "colors";
+    borderInlineStart: "colors";
+    borderLeft: "colors";
+    borderLeftColor: "colors";
+    borderRight: "colors";
+    borderRightColor: "colors";
+    borderTop: "colors";
+    borderTopColor: "colors";
+    caretColor: "colors";
+    color: "colors";
+    columnRuleColor: "colors";
+    outline: "colors";
+    outlineColor: "colors";
+    fill: "colors";
+    stroke: "colors";
+    textDecorationColor: "colors";
+    fontFamily: "fonts";
+    fontWeight: "fontWeights";
+    lineHeight: "lineHeights";
+    letterSpacing: "letterSpacings";
+    blockSize: "sizes";
+    minBlockSize: "sizes";
+    maxBlockSize: "sizes";
+    inlineSize: "sizes";
+    minInlineSize: "sizes";
+    maxInlineSize: "sizes";
+    minWidth: "sizes";
+    maxWidth: "sizes";
+    minHeight: "sizes";
+    maxHeight: "sizes";
+    flexBasis: "sizes";
+    gridTemplateColumns: "sizes";
+    gridTemplateRows: "sizes";
+    borderWidth: "borderWidths";
+    borderTopWidth: "borderWidths";
+    borderLeftWidth: "borderWidths";
+    borderRightWidth: "borderWidths";
+    borderBottomWidth: "borderWidths";
+    borderStyle: "borderStyles";
+    borderTopStyle: "borderStyles";
+    borderLeftStyle: "borderStyles";
+    borderRightStyle: "borderStyles";
+    borderBottomStyle: "borderStyles";
+    borderRadius: "radii";
+    borderTopLeftRadius: "radii";
+    borderTopRightRadius: "radii";
+    borderBottomRightRadius: "radii";
+    borderBottomLeftRadius: "radii";
+    boxShadow: "shadows";
+    textShadow: "shadows";
+    transition: "transitions";
+    zIndex: "zIndices";
+}, {}>>;
+interface TextProps extends ComponentProps<typeof Text> {
+    as?: ElementType;
+}
+
+export { Text, type TextProps };

package/dist/index.js

@@ -0,0 +1,285 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.tsx
+var index_exports = {};
+__export(index_exports, {
+  Text: () => Text
+});
+module.exports = __toCommonJS(index_exports);
+
+// ../tokens/dist/index.mjs
+var colors = {
+  brand50: "#DBE8FF",
+  brand100: "#BDD5FF",
+  brand200: "#7AABFF",
+  brand300: "#3881FF",
+  brand400: "#005AF5",
+  brand500: "#004ED2",
+  brand600: "#0042B2",
+  brand700: "#00348F",
+  brand800: "#00276B",
+  brand900: "#001A47",
+  brand950: "#000D24",
+  blue50: "#E5F1FF",
+  blue100: "#CCE4FF",
+  blue200: "#9AC9FF",
+  blue300: "#66ADFF",
+  blue400: "#3392FF",
+  blue500: "#0278FE",
+  blue600: "#005FCD",
+  blue700: "#004799",
+  blue800: "#013066",
+  blue900: "#001834",
+  blue950: "#000C1A",
+  red50: "#FCEEEF",
+  red100: "#F9DCDF",
+  red200: "#F3BEC3",
+  red300: "#ED9CA2",
+  red400: "#E77982",
+  red500: "#E15662",
+  red600: "#DB3644",
+  red700: "#AD1F2B",
+  red800: "#75151D",
+  red900: "#380A0E",
+  red950: "#1E0507",
+  purple50: "#F3EFFB",
+  purple100: "#E6DEF7",
+  purple200: "#D1C2F0",
+  purple300: "#B9A1E8",
+  purple400: "#A080E0",
+  purple500: "#8961D8",
+  purple600: "#6431C8",
+  purple700: "#4B2597",
+  purple800: "#331966",
+  purple900: "#180C31",
+  purple950: "#0C0619",
+  yellow50: "#FFF9E6",
+  yellow100: "#FFF3CD",
+  yellow200: "#FFE69C",
+  yellow300: "#FFDA6A",
+  yellow400: "#FFCD39",
+  yellow500: "#FFC107",
+  yellow600: "#CC9A06",
+  yellow700: "#997404",
+  yellow800: "#664D03",
+  yellow900: "#332701",
+  yellow950: "#191300",
+  dark50: "#FFFFFF",
+  dark100: "#F4F4F4",
+  dark200: "#EAEBF0",
+  dark300: "#C2C3C7",
+  dark400: "#A9ABB1",
+  dark500: "#808289",
+  dark600: "#4C4F54",
+  dark700: "#34363B",
+  dark800: "#1E2023",
+  dark900: "#040507",
+  dark950: "#030303",
+  neutral50: "#FFFFFF",
+  neutral100: "#F4F4F4",
+  neutral200: "#EAEBF0",
+  neutral300: "#C2C3C7",
+  neutral400: "#A9ABB1",
+  neutral500: "#808289",
+  neutral600: "#4C4F54",
+  neutral700: "#34363B",
+  neutral800: "#1E2023",
+  neutral900: "#040507",
+  neutral950: "#030303",
+  green50: "#E6F9EA",
+  green100: "#CDF4D5",
+  green200: "#9BE8AC",
+  green300: "#6CD783",
+  green400: "#5BCA72",
+  green500: "#26A743",
+  green600: "#1E8535",
+  green700: "#176427",
+  green800: "#0F421A",
+  green900: "#08210D",
+  green950: "#041107",
+  grey50: "#F4F8FB",
+  grey100: "#E6EEF4",
+  grey200: "#DBE7F0",
+  grey300: "#BCCEDD",
+  grey400: "#9FB6C7",
+  grey500: "#849DAE",
+  grey600: "#698496",
+  grey700: "#516A7A",
+  grey800: "#394F61",
+  grey900: "#233543",
+  grey950: "#101B23"
+};
+var fonts = {
+  default: '"Work Sans", sans-serif'
+};
+var fontSizes = {
+  2: "0.125rem",
+  4: "0.25rem",
+  6: "0.375rem",
+  8: "0.5rem",
+  10: "0.625rem",
+  12: "0.75rem",
+  13: "0.8125rem",
+  14: "0.875rem",
+  16: "1rem",
+  18: "1.125rem",
+  20: "1.25rem",
+  22: "1.375rem",
+  24: "1.5rem",
+  32: "2rem",
+  36: "2.25rem",
+  40: "2.5rem",
+  48: "3rem",
+  56: "3.5rem",
+  64: "4rem",
+  72: "4.5rem",
+  80: "5rem",
+  xs: "0.375rem",
+  sm: "0.5rem",
+  md: "0.75rem",
+  lg: "1rem",
+  "2xl": "1.5rem",
+  "3xl": "2rem",
+  "4xl": "2.5rem",
+  full: "62.4375rem"
+};
+var fontWeights = {
+  regular: "400",
+  medium: "500",
+  semibold: "600",
+  bold: "700"
+};
+var lineHeights = {
+  smaller: "112.5%",
+  // 4px
+  shorter: "125%",
+  // 8px
+  short: "137.5%",
+  // 12px
+  base: "150%",
+  // 16px
+  tall: "175%"
+  // 24px
+};
+var radii = {
+  px: "1px",
+  xs: "6px",
+  sm: "8px",
+  md: "12px",
+  lg: "16px",
+  "2xl": "24px",
+  "3xl": "32px",
+  "4xl": "40px",
+  full: "99999px"
+};
+var space = {
+  2: "0.125rem",
+  4: "0.25rem",
+  6: "0.375rem",
+  8: "0.5rem",
+  10: "0.625rem",
+  12: "0.75rem",
+  13: "0.8125rem",
+  14: "0.875rem",
+  16: "1rem",
+  18: "1.125rem",
+  20: "1.25rem",
+  22: "1.375rem",
+  24: "1.5rem",
+  32: "2rem",
+  36: "2.25rem",
+  40: "2.5rem",
+  48: "3rem",
+  56: "3.5rem",
+  64: "4rem",
+  72: "4.5rem",
+  80: "5rem",
+  full: "62.4375rem"
+};
+
+// src/styles/index.ts
+var import_react = require("@stitches/react");
+var {
+  styled,
+  css,
+  globalCss,
+  keyframes,
+  getCssText,
+  theme,
+  createTheme,
+  config
+} = (0, import_react.createStitches)({
+  themeMap: __spreadProps(__spreadValues({}, import_react.defaultThemeMap), {
+    height: "space",
+    width: "space"
+  }),
+  theme: {
+    colors,
+    fontSizes,
+    fonts,
+    fontWeights,
+    lineHeights,
+    radii,
+    space
+  }
+});
+
+// src/components/Text.tsx
+var Text = styled("p", {
+  fontFamily: "$default",
+  lineHeight: "$base",
+  margin: 0,
+  color: "$gray100",
+  variants: {
+    size: {
+      xs: { fontSize: "$xs" },
+      sm: { fontSize: "$sm" },
+      md: { fontSize: "$md" },
+      lg: { fontSize: "$lg" },
+      "2xl": { fontSize: "$2xl" },
+      "4xl": { fontSize: "$4xl" },
+      full: { fontSize: "$full" }
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Text
+});

package/dist/index.mjs

@@ -0,0 +1,261 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+
+// ../tokens/dist/index.mjs
+var colors = {
+  brand50: "#DBE8FF",
+  brand100: "#BDD5FF",
+  brand200: "#7AABFF",
+  brand300: "#3881FF",
+  brand400: "#005AF5",
+  brand500: "#004ED2",
+  brand600: "#0042B2",
+  brand700: "#00348F",
+  brand800: "#00276B",
+  brand900: "#001A47",
+  brand950: "#000D24",
+  blue50: "#E5F1FF",
+  blue100: "#CCE4FF",
+  blue200: "#9AC9FF",
+  blue300: "#66ADFF",
+  blue400: "#3392FF",
+  blue500: "#0278FE",
+  blue600: "#005FCD",
+  blue700: "#004799",
+  blue800: "#013066",
+  blue900: "#001834",
+  blue950: "#000C1A",
+  red50: "#FCEEEF",
+  red100: "#F9DCDF",
+  red200: "#F3BEC3",
+  red300: "#ED9CA2",
+  red400: "#E77982",
+  red500: "#E15662",
+  red600: "#DB3644",
+  red700: "#AD1F2B",
+  red800: "#75151D",
+  red900: "#380A0E",
+  red950: "#1E0507",
+  purple50: "#F3EFFB",
+  purple100: "#E6DEF7",
+  purple200: "#D1C2F0",
+  purple300: "#B9A1E8",
+  purple400: "#A080E0",
+  purple500: "#8961D8",
+  purple600: "#6431C8",
+  purple700: "#4B2597",
+  purple800: "#331966",
+  purple900: "#180C31",
+  purple950: "#0C0619",
+  yellow50: "#FFF9E6",
+  yellow100: "#FFF3CD",
+  yellow200: "#FFE69C",
+  yellow300: "#FFDA6A",
+  yellow400: "#FFCD39",
+  yellow500: "#FFC107",
+  yellow600: "#CC9A06",
+  yellow700: "#997404",
+  yellow800: "#664D03",
+  yellow900: "#332701",
+  yellow950: "#191300",
+  dark50: "#FFFFFF",
+  dark100: "#F4F4F4",
+  dark200: "#EAEBF0",
+  dark300: "#C2C3C7",
+  dark400: "#A9ABB1",
+  dark500: "#808289",
+  dark600: "#4C4F54",
+  dark700: "#34363B",
+  dark800: "#1E2023",
+  dark900: "#040507",
+  dark950: "#030303",
+  neutral50: "#FFFFFF",
+  neutral100: "#F4F4F4",
+  neutral200: "#EAEBF0",
+  neutral300: "#C2C3C7",
+  neutral400: "#A9ABB1",
+  neutral500: "#808289",
+  neutral600: "#4C4F54",
+  neutral700: "#34363B",
+  neutral800: "#1E2023",
+  neutral900: "#040507",
+  neutral950: "#030303",
+  green50: "#E6F9EA",
+  green100: "#CDF4D5",
+  green200: "#9BE8AC",
+  green300: "#6CD783",
+  green400: "#5BCA72",
+  green500: "#26A743",
+  green600: "#1E8535",
+  green700: "#176427",
+  green800: "#0F421A",
+  green900: "#08210D",
+  green950: "#041107",
+  grey50: "#F4F8FB",
+  grey100: "#E6EEF4",
+  grey200: "#DBE7F0",
+  grey300: "#BCCEDD",
+  grey400: "#9FB6C7",
+  grey500: "#849DAE",
+  grey600: "#698496",
+  grey700: "#516A7A",
+  grey800: "#394F61",
+  grey900: "#233543",
+  grey950: "#101B23"
+};
+var fonts = {
+  default: '"Work Sans", sans-serif'
+};
+var fontSizes = {
+  2: "0.125rem",
+  4: "0.25rem",
+  6: "0.375rem",
+  8: "0.5rem",
+  10: "0.625rem",
+  12: "0.75rem",
+  13: "0.8125rem",
+  14: "0.875rem",
+  16: "1rem",
+  18: "1.125rem",
+  20: "1.25rem",
+  22: "1.375rem",
+  24: "1.5rem",
+  32: "2rem",
+  36: "2.25rem",
+  40: "2.5rem",
+  48: "3rem",
+  56: "3.5rem",
+  64: "4rem",
+  72: "4.5rem",
+  80: "5rem",
+  xs: "0.375rem",
+  sm: "0.5rem",
+  md: "0.75rem",
+  lg: "1rem",
+  "2xl": "1.5rem",
+  "3xl": "2rem",
+  "4xl": "2.5rem",
+  full: "62.4375rem"
+};
+var fontWeights = {
+  regular: "400",
+  medium: "500",
+  semibold: "600",
+  bold: "700"
+};
+var lineHeights = {
+  smaller: "112.5%",
+  // 4px
+  shorter: "125%",
+  // 8px
+  short: "137.5%",
+  // 12px
+  base: "150%",
+  // 16px
+  tall: "175%"
+  // 24px
+};
+var radii = {
+  px: "1px",
+  xs: "6px",
+  sm: "8px",
+  md: "12px",
+  lg: "16px",
+  "2xl": "24px",
+  "3xl": "32px",
+  "4xl": "40px",
+  full: "99999px"
+};
+var space = {
+  2: "0.125rem",
+  4: "0.25rem",
+  6: "0.375rem",
+  8: "0.5rem",
+  10: "0.625rem",
+  12: "0.75rem",
+  13: "0.8125rem",
+  14: "0.875rem",
+  16: "1rem",
+  18: "1.125rem",
+  20: "1.25rem",
+  22: "1.375rem",
+  24: "1.5rem",
+  32: "2rem",
+  36: "2.25rem",
+  40: "2.5rem",
+  48: "3rem",
+  56: "3.5rem",
+  64: "4rem",
+  72: "4.5rem",
+  80: "5rem",
+  full: "62.4375rem"
+};
+
+// src/styles/index.ts
+import { createStitches, defaultThemeMap } from "@stitches/react";
+var {
+  styled,
+  css,
+  globalCss,
+  keyframes,
+  getCssText,
+  theme,
+  createTheme,
+  config
+} = createStitches({
+  themeMap: __spreadProps(__spreadValues({}, defaultThemeMap), {
+    height: "space",
+    width: "space"
+  }),
+  theme: {
+    colors,
+    fontSizes,
+    fonts,
+    fontWeights,
+    lineHeights,
+    radii,
+    space
+  }
+});
+
+// src/components/Text.tsx
+var Text = styled("p", {
+  fontFamily: "$default",
+  lineHeight: "$base",
+  margin: 0,
+  color: "$gray100",
+  variants: {
+    size: {
+      xs: { fontSize: "$xs" },
+      sm: { fontSize: "$sm" },
+      md: { fontSize: "$md" },
+      lg: { fontSize: "$lg" },
+      "2xl": { fontSize: "$2xl" },
+      "4xl": { fontSize: "$4xl" },
+      full: { fontSize: "$full" }
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+export {
+  Text
+};

package/package.json

@@ -0,0 +1,30 @@
+{
+  "name": "@lets-events/react",
+  "version": "2.0.0",
+  "description": "",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "scripts": {
+    "build": "tsup src/index.tsx  --format esm,cjs --dts --external react",
+    "dev": "tsup src/index.tsx  --format esm,cjs --dts --external react --watch",
+    "lint": "eslint src/**/*.ts --fix"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "MIT",
+  "type": "commonjs",
+  "devDependencies": {
+    "@lets-events/eslint-config": "*",
+    "@lets-events/tokens": "*",
+    "@lets-events/ts-config": "*",
+    "@types/react": "^19.0.10",
+    "@types/react-dom": "^19.0.4",
+    "react": "^19.0.0",
+    "tsup": "^8.4.0",
+    "typescript": "^5.8.2"
+  },
+  "dependencies": {
+    "@stitches/react": "^1.2.8"
+  }
+}

package/src/components/Text.tsx

@@ -0,0 +1,29 @@
+import { ComponentProps, ElementType } from 'react'
+import { styled } from '../styles'
+
+export const Text = styled('p', {
+  fontFamily: '$default',
+  lineHeight: '$base',
+  margin: 0,
+  color: '$gray100',
+
+  variants: {
+    size: {
+      xs: { fontSize: '$xs' },
+      sm: { fontSize: '$sm' },
+      md: { fontSize: '$md' },
+      lg: { fontSize: '$lg' },
+      '2xl': { fontSize: '$2xl' },
+      '4xl': { fontSize: '$4xl' },
+      full: { fontSize: '$full' },
+    },
+  },
+
+  defaultVariants: {
+    size: 'md',
+  },
+})
+
+export interface TextProps extends ComponentProps<typeof Text> {
+  as?: ElementType
+}

package/src/index.tsx

@@ -0,0 +1 @@
+export * from './components/Text'

package/src/styles/index.ts

@@ -0,0 +1,36 @@
+import {
+  colors,
+  fontSizes,
+  fontWeights,
+  fonts,
+  lineHeights,
+  radii,
+  space,
+} from '@lets-events/tokens'
+import { createStitches, defaultThemeMap } from '@stitches/react'
+
+export const {
+  styled,
+  css,
+  globalCss,
+  keyframes,
+  getCssText,
+  theme,
+  createTheme,
+  config,
+} = createStitches({
+  themeMap: {
+    ...defaultThemeMap,
+    height: 'space',
+    width: 'space',
+  },
+  theme: {
+    colors,
+    fontSizes,
+    fonts,
+    fontWeights,
+    lineHeights,
+    radii,
+    space,
+  },
+})

package/tsconfig.json

@@ -0,0 +1,4 @@
+{
+  "extends": "@lets-events/ts-config/react.json",
+  "include": ["src"]
+}