@lets-events/react 12.11.1 → 12.11.2

package/.turbo/turbo-build.log

@@ -1,6 +1,6 @@
 
 
-> @lets-events/react@12.11.1 build
+> @lets-events/react@12.11.2 build
 > tsup src/index.tsx  --format esm,cjs --dts --external react
 
 CLI Building entry: src/index.tsx
@@ -10,12 +10,12 @@
 CLI Target: es6
 ESM Build start
 CJS Build start
-CJS dist/index.js 437.94 KB
-CJS ⚡️ Build success in 305ms
-ESM dist/index.mjs 421.87 KB
-ESM ⚡️ Build success in 305ms
+CJS dist/index.js 438.04 KB
+CJS ⚡️ Build success in 304ms
+ESM dist/index.mjs 421.97 KB
+ESM ⚡️ Build success in 306ms
 DTS Build start
-DTS ⚡️ Build success in 6455ms
-DTS dist/index.d.mts 411.09 KB
-DTS dist/index.d.ts  411.09 KB
+DTS ⚡️ Build success in 6512ms
+DTS dist/index.d.mts 411.19 KB
+DTS dist/index.d.ts  411.19 KB
 ⠙

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @lets-events/react
 
+## 12.11.2
+
+### Patch Changes
+
+- modal title typograph
+
 ## 12.11.1
 
 ### Patch Changes

package/dist/index.d.mts

@@ -929,13 +929,13 @@ declare const TextStyle: _stitches_react_types_styled_component.StyledComponent<
     transition: "transitions";
     zIndex: "zIndices";
 }, {}>>;
-type Typography = keyof typeof typographyValues;
+type Typography$1 = keyof typeof typographyValues;
 type FontWeight = "regular" | "medium" | "semibold" | "bold";
 type TextProps = {
     as?: ElementType;
     asChild?: boolean;
     color?: keyof Colors;
-    typography?: Typography;
+    typography?: Typography$1;
     fontWeight?: FontWeight;
     children?: ReactNode;
     id?: string;
@@ -4495,6 +4495,7 @@ type BadgeProps = {
 };
 declare function Badge({ asChild, children, ...props }: BadgeProps): react_jsx_runtime.JSX.Element;
 
+type Typography = keyof typeof typographyValues;
 type ModalProps = ComponentProps<typeof Dialog.Root> & {
     trigger?: React.ReactNode;
     title?: string;
@@ -4505,8 +4506,9 @@ type ModalProps = ComponentProps<typeof Dialog.Root> & {
     height?: string;
     preventAutoFocus?: boolean;
     fitContent?: boolean;
+    titleTypography?: Typography;
 };
-declare function Modal({ children, title, trigger, zIndex, maxWidth, maxHeight, height, preventAutoFocus, fitContent, ...props }: ModalProps): react_jsx_runtime.JSX.Element;
+declare function Modal({ children, title, trigger, zIndex, maxWidth, maxHeight, height, preventAutoFocus, fitContent, titleTypography, ...props }: ModalProps): react_jsx_runtime.JSX.Element;
 
 type MenuDropdownProps = HTMLAttributes<HTMLDivElement> & {
     children: ReactNode;

package/dist/index.d.ts

@@ -929,13 +929,13 @@ declare const TextStyle: _stitches_react_types_styled_component.StyledComponent<
     transition: "transitions";
     zIndex: "zIndices";
 }, {}>>;
-type Typography = keyof typeof typographyValues;
+type Typography$1 = keyof typeof typographyValues;
 type FontWeight = "regular" | "medium" | "semibold" | "bold";
 type TextProps = {
     as?: ElementType;
     asChild?: boolean;
     color?: keyof Colors;
-    typography?: Typography;
+    typography?: Typography$1;
     fontWeight?: FontWeight;
     children?: ReactNode;
     id?: string;
@@ -4495,6 +4495,7 @@ type BadgeProps = {
 };
 declare function Badge({ asChild, children, ...props }: BadgeProps): react_jsx_runtime.JSX.Element;
 
+type Typography = keyof typeof typographyValues;
 type ModalProps = ComponentProps<typeof Dialog.Root> & {
     trigger?: React.ReactNode;
     title?: string;
@@ -4505,8 +4506,9 @@ type ModalProps = ComponentProps<typeof Dialog.Root> & {
     height?: string;
     preventAutoFocus?: boolean;
     fitContent?: boolean;
+    titleTypography?: Typography;
 };
-declare function Modal({ children, title, trigger, zIndex, maxWidth, maxHeight, height, preventAutoFocus, fitContent, ...props }: ModalProps): react_jsx_runtime.JSX.Element;
+declare function Modal({ children, title, trigger, zIndex, maxWidth, maxHeight, height, preventAutoFocus, fitContent, titleTypography, ...props }: ModalProps): react_jsx_runtime.JSX.Element;
 
 type MenuDropdownProps = HTMLAttributes<HTMLDivElement> & {
     children: ReactNode;

package/dist/index.js

@@ -3890,7 +3890,8 @@ function Modal(_a) {
     maxHeight,
     height,
     preventAutoFocus = false,
-    fitContent = false
+    fitContent = false,
+    titleTypography = "headline6"
   } = _b, props = __objRest(_b, [
     "children",
     "title",
@@ -3900,7 +3901,8 @@ function Modal(_a) {
     "maxHeight",
     "height",
     "preventAutoFocus",
-    "fitContent"
+    "fitContent",
+    "titleTypography"
   ]);
   const { onOpenChange } = props;
   return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_radix_ui.Dialog.Root, __spreadProps(__spreadValues({}, props), { children: [
@@ -3924,7 +3926,7 @@ function Modal(_a) {
             }, maxHeight !== void 0 && { maxHeight }), height !== void 0 && { height }), fitContent && height === void 0 && { height: "fit-content" }),
             children: [
               title && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(ModalHeaderStyled, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ModalTitleStyled, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Text, { typography: "headline6", fontWeight: "medium", children: title }) }),
+                /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ModalTitleStyled, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Text, { typography: titleTypography, fontWeight: "medium", children: title }) }),
                 (onOpenChange || trigger) && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_radix_ui.Dialog.Close, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(ModalIconClose, { name: "close", size: "xl" }) })
               ] }),
               children
@@ -10570,6 +10572,7 @@ var MultiSelect = import_react20.default.forwardRef(
           maxHeight: MOBILE_MODAL_MAX_HEIGHT,
           zIndex: modalZIndex,
           preventAutoFocus: true,
+          titleTypography: "headline8",
           fitContent: true,
           children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
             StyledModalOptionsWrapper,

package/dist/index.mjs

@@ -3773,7 +3773,8 @@ function Modal(_a) {
     maxHeight,
     height,
     preventAutoFocus = false,
-    fitContent = false
+    fitContent = false,
+    titleTypography = "headline6"
   } = _b, props = __objRest(_b, [
     "children",
     "title",
@@ -3783,7 +3784,8 @@ function Modal(_a) {
     "maxHeight",
     "height",
     "preventAutoFocus",
-    "fitContent"
+    "fitContent",
+    "titleTypography"
   ]);
   const { onOpenChange } = props;
   return /* @__PURE__ */ jsxs5(ModalRadix.Root, __spreadProps(__spreadValues({}, props), { children: [
@@ -3807,7 +3809,7 @@ function Modal(_a) {
             }, maxHeight !== void 0 && { maxHeight }), height !== void 0 && { height }), fitContent && height === void 0 && { height: "fit-content" }),
             children: [
               title && /* @__PURE__ */ jsxs5(ModalHeaderStyled, { children: [
-                /* @__PURE__ */ jsx13(ModalTitleStyled, { asChild: true, children: /* @__PURE__ */ jsx13(Text, { typography: "headline6", fontWeight: "medium", children: title }) }),
+                /* @__PURE__ */ jsx13(ModalTitleStyled, { asChild: true, children: /* @__PURE__ */ jsx13(Text, { typography: titleTypography, fontWeight: "medium", children: title }) }),
                 (onOpenChange || trigger) && /* @__PURE__ */ jsx13(ModalRadix.Close, { asChild: true, children: /* @__PURE__ */ jsx13(ModalIconClose, { name: "close", size: "xl" }) })
               ] }),
               children
@@ -10457,6 +10459,7 @@ var MultiSelect = React11.forwardRef(
           maxHeight: MOBILE_MODAL_MAX_HEIGHT,
           zIndex: modalZIndex,
           preventAutoFocus: true,
+          titleTypography: "headline8",
           fitContent: true,
           children: /* @__PURE__ */ jsx27(
             StyledModalOptionsWrapper,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lets-events/react",
-  "version": "12.11.1",
+  "version": "12.11.2",
   "description": "",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",

package/src/components/Modal.tsx

@@ -2,8 +2,8 @@ import { ComponentProps } from "react";
 import { styled } from "../styles";
 import { Dialog as ModalRadix } from "radix-ui";
 import Icon from "./Icon";
-import { Box } from "./Box";
 import { Text } from "./Text";
+import { typographyValues } from "../types/typographyValues";
 
 const ModalContentStyled = styled(ModalRadix.Content, {
   fontFamily: "$default",
@@ -61,6 +61,8 @@ const ModalTitleStyled = styled(ModalRadix.Title, {
   width: "calc(100% - 48px)",
 });
 
+type Typography = keyof typeof typographyValues;
+
 export type ModalProps = ComponentProps<typeof ModalRadix.Root> & {
   trigger?: React.ReactNode;
   title?: string;
@@ -71,6 +73,7 @@ export type ModalProps = ComponentProps<typeof ModalRadix.Root> & {
   height?: string;
   preventAutoFocus?: boolean;
   fitContent?: boolean;
+  titleTypography?: Typography;
 };
 
 export function Modal({
@@ -83,6 +86,7 @@ export function Modal({
   height,
   preventAutoFocus = false,
   fitContent = false,
+  titleTypography = "headline6",
   ...props
 }: ModalProps) {
   const { onOpenChange } = props;
@@ -111,7 +115,7 @@ export function Modal({
             {title && (
               <ModalHeaderStyled>
                 <ModalTitleStyled asChild>
-                  <Text typography={"headline6"} fontWeight={"medium"}>
+                  <Text typography={titleTypography} fontWeight={"medium"}>
                     {title}
                   </Text>
                 </ModalTitleStyled>

package/src/components/MultiSelect/index.tsx

@@ -321,6 +321,7 @@ export const MultiSelect = React.forwardRef<HTMLDivElement, MultiSelectProps>(
             maxHeight={MOBILE_MODAL_MAX_HEIGHT}
             zIndex={modalZIndex}
             preventAutoFocus
+            titleTypography="headline8"
             fitContent
           >
             <StyledModalOptionsWrapper