@lobehub/ui 3.4.2 → 3.4.3

package/es/Flex/type.d.mts

@@ -0,0 +1,108 @@
+import { CSSProperties, DOMAttributes, ElementType, HTMLAttributes, ReactNode, Ref } from "react";
+
+//#region src/Flex/type.d.ts
+type ContentPosition = 'center' | 'end' | 'flex-end' | 'flex-start' | 'start' | 'stretch' | 'baseline';
+type FlexDirection = 'vertical' | 'vertical-reverse' | 'horizontal' | 'horizontal-reverse';
+type DivProps = DOMAttributes<HTMLDivElement> & HTMLAttributes<HTMLDivElement>;
+type CommonSpaceNumber = 2 | 4 | 8 | 12 | 16 | 24;
+/**
+ * Flexbox 布局组件的接口
+ */
+interface IFlexbox {
+  /**
+   * 交叉轴对齐方式
+   * @default "stretch"
+   */
+  align?: ContentPosition;
+  /**
+   * 渲染的 HTML 元素类型
+   * @default "div"
+   */
+  as?: ElementType;
+  /**
+   * 子元素
+   */
+  children?: ReactNode;
+  /**
+   * 自定义类名
+   */
+  className?: string;
+  /**
+   * 主轴方向
+   * @default "horizontal"
+   */
+  direction?: FlexDirection;
+  /**
+   * 内容分布
+   */
+  distribution?: CSSProperties['justifyContent'];
+  /**
+   * flex 值
+   * @default "0 1 auto"
+   */
+  flex?: number | string;
+  /**
+   * 主轴方向上的间距
+   * @default 0
+   */
+  gap?: CommonSpaceNumber | number | string;
+  /**
+   * 高度
+   * @default "auto"
+   */
+  height?: number | string;
+  /**
+   * 是否横向
+   * @default false
+   */
+  horizontal?: boolean;
+  /**
+   * 主轴对齐方式
+   */
+  justify?: CSSProperties['justifyContent'];
+  /**
+   * 内边距
+   * @default 0
+   */
+  padding?: string | number | CommonSpaceNumber;
+  /**
+   * 块内边距
+   */
+  paddingBlock?: string | number;
+  /**
+   * 内联内边距
+   */
+  paddingInline?: string | number;
+  /**
+   * 类名前缀
+   */
+  prefixCls?: string;
+  /**
+   * ref 引用
+   */
+  ref?: Ref<HTMLElement>;
+  /**
+   * 自定义样式
+   */
+  style?: CSSProperties;
+  /**
+   * 是否显示
+   * @default true
+   */
+  visible?: boolean;
+  /**
+   * 宽度
+   * @default "auto"
+   */
+  width?: number | string;
+  /**
+   * 换行方式
+   */
+  wrap?: CSSProperties['flexWrap'];
+}
+interface FlexBasicProps extends IFlexbox, DivProps {}
+type FlexboxProps = FlexBasicProps;
+type CenterProps = Omit<FlexBasicProps, 'distribution' | 'direction' | 'align'>;
+//#endregion
+export { CenterProps, ContentPosition, FlexBasicProps, FlexDirection, FlexboxProps };
+//# sourceMappingURL=type.d.mts.map

package/es/Flex/utils.mjs

@@ -0,0 +1,25 @@
+//#region src/Flex/utils.ts
+const getFlexDirection = (direction, isHorizontal$1) => {
+	if (isHorizontal$1) return "row";
+	switch (direction) {
+		case "horizontal": return "row";
+		case "horizontal-reverse": return "row-reverse";
+		case "vertical":
+		default: return "column";
+		case "vertical-reverse": return "column-reverse";
+	}
+};
+const isSpaceDistribution = (distribution) => {
+	if (!distribution) return;
+	return [
+		"space-between",
+		"space-around",
+		"space-evenly"
+	].includes(distribution);
+};
+const isHorizontal = (direction, isHorizontal$1) => getFlexDirection(direction, isHorizontal$1) === "row";
+const getCssValue = (value) => typeof value === "number" ? `${value}px` : value;
+
+//#endregion
+export { getCssValue, getFlexDirection, isHorizontal, isSpaceDistribution };
+//# sourceMappingURL=utils.mjs.map

package/es/Flex/utils.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.mjs","names":["isHorizontal"],"sources":["../../src/Flex/utils.ts"],"sourcesContent":["import type { FlexDirection } from './type';\n\nexport const getPrefix = (prefixCls?: string) => {\n  if (prefixCls) return prefixCls;\n  return 'lobe';\n};\n\nexport const getFlexDirection = (direction?: FlexDirection, isHorizontal?: boolean) => {\n  if (isHorizontal) return 'row';\n\n  switch (direction) {\n    case 'horizontal': {\n      return 'row';\n    }\n    case 'horizontal-reverse': {\n      return 'row-reverse';\n    }\n    case 'vertical':\n    default: {\n      return 'column';\n    }\n    case 'vertical-reverse': {\n      return 'column-reverse';\n    }\n  }\n};\n\nexport const isSpaceDistribution = (distribution?: string) => {\n  if (!distribution) return;\n  return ['space-between', 'space-around', 'space-evenly'].includes(distribution);\n};\n\nexport const isHorizontal = (direction?: FlexDirection, isHorizontal?: boolean) =>\n  getFlexDirection(direction, isHorizontal) === 'row';\n\nexport const isVertical = (direction?: FlexDirection, isHorizontal?: boolean) =>\n  getFlexDirection(direction, isHorizontal) === 'column';\n\nexport const getCssValue = (value: string | number | undefined) =>\n  typeof value === 'number' ? `${value}px` : value;\n"],"mappings":";AAOA,MAAa,oBAAoB,WAA2B,mBAA2B;AACrF,KAAIA,eAAc,QAAO;AAEzB,SAAQ,WAAR;EACE,KAAK,aACH,QAAO;EAET,KAAK,qBACH,QAAO;EAET,KAAK;EACL,QACE,QAAO;EAET,KAAK,mBACH,QAAO;;;AAKb,MAAa,uBAAuB,iBAA0B;AAC5D,KAAI,CAAC,aAAc;AACnB,QAAO;EAAC;EAAiB;EAAgB;EAAe,CAAC,SAAS,aAAa;;AAGjF,MAAa,gBAAgB,WAA2B,mBACtD,iBAAiB,WAAWA,eAAa,KAAK;AAKhD,MAAa,eAAe,UAC1B,OAAO,UAAU,WAAW,GAAG,MAAM,MAAM"}

package/es/FluentEmoji/FluentEmoji.d.mts

@@ -0,0 +1,8 @@
+import { FluentEmojiProps } from "./type.mjs";
+import { FC } from "react";
+
+//#region src/FluentEmoji/FluentEmoji.d.ts
+declare const FluentEmoji: FC<FluentEmojiProps>;
+//#endregion
+export { FluentEmoji };
+//# sourceMappingURL=FluentEmoji.d.mts.map

package/es/FluentEmoji/FluentEmoji.mjs

@@ -0,0 +1,53 @@
+'use client';
+
+import Center_default from "../Flex/Center.mjs";
+import { useCdnFn } from "../ConfigProvider/index.mjs";
+import Img_default from "../Img/index.mjs";
+import { useStyles } from "./style.mjs";
+import { genEmojiUrl } from "./utils.mjs";
+import { useMemo, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/FluentEmoji/FluentEmoji.tsx
+const FluentEmoji = ({ emoji, className, style, type = "3d", size = 40, unoptimized, ref, ...rest }) => {
+	const [loadingFail, setLoadingFail] = useState(false);
+	const genCdnUrl = useCdnFn();
+	const { cx, styles } = useStyles();
+	const emojiUrl = useMemo(() => genEmojiUrl(emoji, type), [type, emoji]);
+	if (type === "raw" || !emojiUrl || loadingFail) return /* @__PURE__ */ jsx(Center_default, {
+		className: cx(styles.container, className),
+		flex: "none",
+		height: size,
+		ref,
+		role: "img",
+		style: {
+			fontSize: size * .9,
+			...style
+		},
+		width: size,
+		...rest,
+		children: emoji
+	});
+	return /* @__PURE__ */ jsx(Img_default, {
+		alt: emoji,
+		className,
+		height: size,
+		loading: "lazy",
+		onError: () => setLoadingFail(true),
+		ref,
+		src: genCdnUrl(emojiUrl),
+		style: {
+			flex: "none",
+			...style
+		},
+		unoptimized,
+		width: size,
+		...rest
+	});
+};
+FluentEmoji.displayName = "FluentEmoji";
+var FluentEmoji_default = FluentEmoji;
+
+//#endregion
+export { FluentEmoji_default as default };
+//# sourceMappingURL=FluentEmoji.mjs.map

package/es/FluentEmoji/FluentEmoji.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FluentEmoji.mjs","names":["FluentEmoji: FC<FluentEmojiProps>","Center","Img"],"sources":["../../src/FluentEmoji/FluentEmoji.tsx"],"sourcesContent":["'use client';\n\nimport { type FC, useMemo, useState } from 'react';\n\nimport { useCdnFn } from '@/ConfigProvider';\nimport { Center } from '@/Flex';\nimport Img from '@/Img';\n\nimport { useStyles } from './style';\nimport type { FluentEmojiProps } from './type';\nimport { genEmojiUrl } from './utils';\n\nconst FluentEmoji: FC<FluentEmojiProps> = ({\n  emoji,\n  className,\n  style,\n  type = '3d',\n  size = 40,\n  unoptimized,\n  ref,\n  ...rest\n}) => {\n  const [loadingFail, setLoadingFail] = useState(false);\n  const genCdnUrl = useCdnFn();\n  const { cx, styles } = useStyles();\n\n  const emojiUrl = useMemo(() => genEmojiUrl(emoji, type), [type, emoji]);\n\n  if (type === 'raw' || !emojiUrl || loadingFail)\n    return (\n      <Center\n        className={cx(styles.container, className)}\n        flex={'none'}\n        height={size}\n        ref={ref}\n        role={'img'}\n        style={{ fontSize: size * 0.9, ...style }}\n        width={size}\n        {...rest}\n      >\n        {emoji}\n      </Center>\n    );\n\n  return (\n    <Img\n      alt={emoji}\n      className={className}\n      height={size}\n      loading={'lazy'}\n      onError={() => setLoadingFail(true)}\n      ref={ref}\n      src={genCdnUrl(emojiUrl)}\n      style={{ flex: 'none', ...style }}\n      unoptimized={unoptimized}\n      width={size}\n      {...rest}\n    />\n  );\n};\n\nFluentEmoji.displayName = 'FluentEmoji';\n\nexport default FluentEmoji;\n"],"mappings":";;;;;;;;;;;AAYA,MAAMA,eAAqC,EACzC,OACA,WACA,OACA,OAAO,MACP,OAAO,IACP,aACA,KACA,GAAG,WACC;CACJ,MAAM,CAAC,aAAa,kBAAkB,SAAS,MAAM;CACrD,MAAM,YAAY,UAAU;CAC5B,MAAM,EAAE,IAAI,WAAW,WAAW;CAElC,MAAM,WAAW,cAAc,YAAY,OAAO,KAAK,EAAE,CAAC,MAAM,MAAM,CAAC;AAEvE,KAAI,SAAS,SAAS,CAAC,YAAY,YACjC,QACE,oBAACC;EACC,WAAW,GAAG,OAAO,WAAW,UAAU;EAC1C,MAAM;EACN,QAAQ;EACH;EACL,MAAM;EACN,OAAO;GAAE,UAAU,OAAO;GAAK,GAAG;GAAO;EACzC,OAAO;EACP,GAAI;YAEH;GACM;AAGb,QACE,oBAACC;EACC,KAAK;EACM;EACX,QAAQ;EACR,SAAS;EACT,eAAe,eAAe,KAAK;EAC9B;EACL,KAAK,UAAU,SAAS;EACxB,OAAO;GAAE,MAAM;GAAQ,GAAG;GAAO;EACpB;EACb,OAAO;EACP,GAAI;GACJ;;AAIN,YAAY,cAAc;AAE1B,0BAAe"}

package/es/FluentEmoji/index.d.mts

@@ -0,0 +1,3 @@
+import { FluentEmojiProps } from "./type.mjs";
+import { FluentEmoji } from "./FluentEmoji.mjs";
+export { FluentEmojiProps, FluentEmoji as default };

package/es/FluentEmoji/index.mjs

@@ -0,0 +1,3 @@
+import FluentEmoji_default from "./FluentEmoji.mjs";
+
+export { FluentEmoji_default as default };

package/es/FluentEmoji/style.mjs

@@ -0,0 +1,14 @@
+import { createStyles } from "antd-style";
+
+//#region src/FluentEmoji/style.ts
+const useStyles = createStyles(({ css: css$1 }) => {
+	return { container: css$1`
+      position: relative;
+      line-height: 1;
+      text-align: center;
+    ` };
+});
+
+//#endregion
+export { useStyles };
+//# sourceMappingURL=style.mjs.map

package/es/FluentEmoji/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../src/FluentEmoji/style.ts"],"sourcesContent":["import { createStyles } from 'antd-style';\n\nexport const useStyles = createStyles(({ css }) => {\n  return {\n    container: css`\n      position: relative;\n      line-height: 1;\n      text-align: center;\n    `,\n  };\n});\n"],"mappings":";;;AAEA,MAAa,YAAY,cAAc,EAAE,iBAAU;AACjD,QAAO,EACL,WAAW,KAAG;;;;OAKf;EACD"}

package/es/FluentEmoji/type.d.mts

@@ -0,0 +1,15 @@
+import { DivProps } from "../types/index.mjs";
+import { EmojiType } from "./utils.mjs";
+import { Ref } from "react";
+
+//#region src/FluentEmoji/type.d.ts
+interface FluentEmojiProps extends DivProps {
+  emoji: string;
+  ref?: Ref<HTMLImageElement>;
+  size?: number;
+  type?: EmojiType;
+  unoptimized?: boolean;
+}
+//#endregion
+export { FluentEmojiProps };
+//# sourceMappingURL=type.d.mts.map

package/es/FluentEmoji/utils.d.mts

@@ -0,0 +1,5 @@
+//#region src/FluentEmoji/utils.d.ts
+type EmojiType = 'anim' | 'flat' | 'modern' | 'mono' | 'raw' | '3d';
+//#endregion
+export { EmojiType };
+//# sourceMappingURL=utils.d.mts.map

package/es/FluentEmoji/utils.mjs

@@ -0,0 +1,46 @@
+//#region src/FluentEmoji/utils.ts
+function emojiToUnicode(emoji) {
+	return [...emoji].map((char) => char?.codePointAt(0)?.toString(16)).join("-");
+}
+function emojiAnimPkg(emoji) {
+	const mainPart = emojiToUnicode(emoji).split("-")[0];
+	if (mainPart < "1f469") return "@lobehub/fluent-emoji-anim-1";
+	else if (mainPart >= "1f469" && mainPart < "1f620") return "@lobehub/fluent-emoji-anim-2";
+	else if (mainPart >= "1f620" && mainPart < "1f9a0") return "@lobehub/fluent-emoji-anim-3";
+	else return "@lobehub/fluent-emoji-anim-4";
+}
+const genEmojiUrl = (emoji, type) => {
+	const ext = ["anim", "3d"].includes(type) ? "webp" : "svg";
+	switch (type) {
+		case "raw": return null;
+		case "anim": return {
+			path: `assets/${emojiToUnicode(emoji)}.${ext}`,
+			pkg: emojiAnimPkg(emoji),
+			version: "latest"
+		};
+		case "3d": return {
+			path: `assets/${emojiToUnicode(emoji)}.${ext}`,
+			pkg: "@lobehub/fluent-emoji-3d",
+			version: "latest"
+		};
+		case "flat": return {
+			path: `assets/${emojiToUnicode(emoji)}.${ext}`,
+			pkg: "@lobehub/fluent-emoji-flat",
+			version: "latest"
+		};
+		case "modern": return {
+			path: `assets/${emojiToUnicode(emoji)}.${ext}`,
+			pkg: "@lobehub/fluent-emoji-modern",
+			version: "latest"
+		};
+		case "mono": return {
+			path: `assets/${emojiToUnicode(emoji)}.${ext}`,
+			pkg: "@lobehub/fluent-emoji-mono",
+			version: "latest"
+		};
+	}
+};
+
+//#endregion
+export { genEmojiUrl };
+//# sourceMappingURL=utils.mjs.map

package/es/FluentEmoji/utils.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.mjs","names":[],"sources":["../../src/FluentEmoji/utils.ts"],"sourcesContent":["export type EmojiType = 'anim' | 'flat' | 'modern' | 'mono' | 'raw' | '3d';\n\nexport function isFlagEmoji(emoji: string) {\n  const flagRegex = /(?:\\uD83C[\\uDDE6-\\uDDFF]){2}/;\n  return flagRegex.test(emoji);\n}\n\nexport function emojiToUnicode(emoji: string) {\n  return [...emoji].map((char) => char?.codePointAt(0)?.toString(16)).join('-');\n}\n\nexport function emojiAnimPkg(emoji: string) {\n  const mainPart = emojiToUnicode(emoji).split('-')[0];\n  if (mainPart < '1f469') {\n    return '@lobehub/fluent-emoji-anim-1';\n  } else if (mainPart >= '1f469' && mainPart < '1f620') {\n    return '@lobehub/fluent-emoji-anim-2';\n  } else if (mainPart >= '1f620' && mainPart < '1f9a0') {\n    return '@lobehub/fluent-emoji-anim-3';\n  } else {\n    return '@lobehub/fluent-emoji-anim-4';\n  }\n}\n\nexport const genEmojiUrl = (emoji: string, type: EmojiType) => {\n  const ext = ['anim', '3d'].includes(type) ? 'webp' : 'svg';\n\n  switch (type) {\n    case 'raw': {\n      return null;\n    }\n    case 'anim': {\n      return {\n        path: `assets/${emojiToUnicode(emoji)}.${ext}`,\n        pkg: emojiAnimPkg(emoji),\n        version: 'latest',\n      };\n    }\n    case '3d': {\n      return {\n        path: `assets/${emojiToUnicode(emoji)}.${ext}`,\n        pkg: '@lobehub/fluent-emoji-3d',\n        version: 'latest',\n      };\n    }\n    case 'flat': {\n      return {\n        path: `assets/${emojiToUnicode(emoji)}.${ext}`,\n        pkg: '@lobehub/fluent-emoji-flat',\n        version: 'latest',\n      };\n    }\n    case 'modern': {\n      return {\n        path: `assets/${emojiToUnicode(emoji)}.${ext}`,\n        pkg: '@lobehub/fluent-emoji-modern',\n        version: 'latest',\n      };\n    }\n    case 'mono': {\n      return {\n        path: `assets/${emojiToUnicode(emoji)}.${ext}`,\n        pkg: '@lobehub/fluent-emoji-mono',\n        version: 'latest',\n      };\n    }\n  }\n};\n"],"mappings":";AAOA,SAAgB,eAAe,OAAe;AAC5C,QAAO,CAAC,GAAG,MAAM,CAAC,KAAK,SAAS,MAAM,YAAY,EAAE,EAAE,SAAS,GAAG,CAAC,CAAC,KAAK,IAAI;;AAG/E,SAAgB,aAAa,OAAe;CAC1C,MAAM,WAAW,eAAe,MAAM,CAAC,MAAM,IAAI,CAAC;AAClD,KAAI,WAAW,QACb,QAAO;UACE,YAAY,WAAW,WAAW,QAC3C,QAAO;UACE,YAAY,WAAW,WAAW,QAC3C,QAAO;KAEP,QAAO;;AAIX,MAAa,eAAe,OAAe,SAAoB;CAC7D,MAAM,MAAM,CAAC,QAAQ,KAAK,CAAC,SAAS,KAAK,GAAG,SAAS;AAErD,SAAQ,MAAR;EACE,KAAK,MACH,QAAO;EAET,KAAK,OACH,QAAO;GACL,MAAM,UAAU,eAAe,MAAM,CAAC,GAAG;GACzC,KAAK,aAAa,MAAM;GACxB,SAAS;GACV;EAEH,KAAK,KACH,QAAO;GACL,MAAM,UAAU,eAAe,MAAM,CAAC,GAAG;GACzC,KAAK;GACL,SAAS;GACV;EAEH,KAAK,OACH,QAAO;GACL,MAAM,UAAU,eAAe,MAAM,CAAC,GAAG;GACzC,KAAK;GACL,SAAS;GACV;EAEH,KAAK,SACH,QAAO;GACL,MAAM,UAAU,eAAe,MAAM,CAAC,GAAG;GACzC,KAAK;GACL,SAAS;GACV;EAEH,KAAK,OACH,QAAO;GACL,MAAM,UAAU,eAAe,MAAM,CAAC,GAAG;GACzC,KAAK;GACL,SAAS;GACV"}

package/es/FontLoader/index.d.mts

@@ -0,0 +1,10 @@
+import * as react63 from "react";
+
+//#region src/FontLoader/index.d.ts
+interface FontLoaderProps {
+  url: string;
+}
+declare const FontLoader: react63.NamedExoticComponent<FontLoaderProps>;
+//#endregion
+export { FontLoader, FontLoaderProps };
+//# sourceMappingURL=index.d.mts.map

package/es/FontLoader/index.mjs

@@ -0,0 +1,33 @@
+'use client';
+
+import { memo, useEffect, useRef } from "react";
+
+//#region src/FontLoader/index.tsx
+const createElement$1 = (url) => {
+	const element = document.createElement("link");
+	element.rel = "stylesheet";
+	element.href = url;
+	return element;
+};
+const FontLoader = memo(({ url }) => {
+	const elementRef = useRef(null);
+	useEffect(() => {
+		const element = createElement$1(url);
+		document.head.append(element);
+		elementRef.current = element;
+		const handleError = () => console.error(`Failed to load font from ${url}`);
+		element.addEventListener("error", handleError);
+		return () => {
+			element.removeEventListener("error", handleError);
+			element.remove();
+			elementRef.current = null;
+		};
+	}, [url]);
+	return null;
+});
+FontLoader.displayName = "FontLoader";
+var FontLoader_default = FontLoader;
+
+//#endregion
+export { FontLoader_default as default };
+//# sourceMappingURL=index.mjs.map

package/es/FontLoader/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":["createElement"],"sources":["../../src/FontLoader/index.tsx"],"sourcesContent":["'use client';\n\nimport { memo, useEffect, useRef } from 'react';\n\nconst createElement = (url: string) => {\n  const element = document.createElement('link');\n  element.rel = 'stylesheet';\n  element.href = url;\n  return element;\n};\n\nexport interface FontLoaderProps {\n  url: string;\n}\n\nconst FontLoader = memo<FontLoaderProps>(({ url }) => {\n  const elementRef = useRef<HTMLLinkElement | null>(null);\n\n  useEffect(() => {\n    // Create and append element\n    const element = createElement(url);\n    document.head.append(element);\n    elementRef.current = element;\n\n    // Optional: Add error handling\n    const handleError = () => console.error(`Failed to load font from ${url}`);\n    element.addEventListener('error', handleError);\n\n    // Cleanup function to remove element when component unmounts\n    // or when url changes\n    return () => {\n      element.removeEventListener('error', handleError);\n      element.remove();\n      elementRef.current = null;\n    };\n  }, [url]);\n\n  return null;\n});\n\nFontLoader.displayName = 'FontLoader';\n\nexport default FontLoader;\n"],"mappings":";;;;;AAIA,MAAMA,mBAAiB,QAAgB;CACrC,MAAM,UAAU,SAAS,cAAc,OAAO;AAC9C,SAAQ,MAAM;AACd,SAAQ,OAAO;AACf,QAAO;;AAOT,MAAM,aAAa,MAAuB,EAAE,UAAU;CACpD,MAAM,aAAa,OAA+B,KAAK;AAEvD,iBAAgB;EAEd,MAAM,UAAUA,gBAAc,IAAI;AAClC,WAAS,KAAK,OAAO,QAAQ;AAC7B,aAAW,UAAU;EAGrB,MAAM,oBAAoB,QAAQ,MAAM,4BAA4B,MAAM;AAC1E,UAAQ,iBAAiB,SAAS,YAAY;AAI9C,eAAa;AACX,WAAQ,oBAAoB,SAAS,YAAY;AACjD,WAAQ,QAAQ;AAChB,cAAW,UAAU;;IAEtB,CAAC,IAAI,CAAC;AAET,QAAO;EACP;AAEF,WAAW,cAAc;AAEzB,yBAAe"}

package/es/Footer/Footer.d.mts

@@ -0,0 +1,8 @@
+import { FooterProps } from "./type.mjs";
+import * as react17 from "react";
+
+//#region src/Footer/Footer.d.ts
+declare const Footer: react17.NamedExoticComponent<FooterProps>;
+//#endregion
+export { Footer };
+//# sourceMappingURL=Footer.d.mts.map

package/es/Footer/Footer.mjs

@@ -0,0 +1,33 @@
+'use client';
+
+import FlexBasic_default from "../Flex/FlexBasic.mjs";
+import { useStyles } from "./style.mjs";
+import { memo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import RcFooter from "rc-footer";
+
+//#region src/Footer/Footer.tsx
+const Footer = memo(({ columns, bottom, theme, contentMaxWidth = 960, children, ...rest }) => {
+	const { styles } = useStyles({
+		contentMaxWidth,
+		isEmpty: !columns || columns?.length === 0
+	});
+	return /* @__PURE__ */ jsxs(FlexBasic_default, {
+		as: "section",
+		className: styles.root,
+		width: "100%",
+		...rest,
+		children: [/* @__PURE__ */ jsx(RcFooter, {
+			bottom,
+			className: styles.footer,
+			columns,
+			theme
+		}), children]
+	});
+});
+Footer.displayName = "Footer";
+var Footer_default = Footer;
+
+//#endregion
+export { Footer_default as default };
+//# sourceMappingURL=Footer.mjs.map

package/es/Footer/Footer.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Footer.mjs","names":["Flexbox"],"sources":["../../src/Footer/Footer.tsx"],"sourcesContent":["'use client';\n\nimport RcFooter from 'rc-footer';\nimport { memo } from 'react';\n\nimport { Flexbox } from '@/Flex';\n\nimport { useStyles } from './style';\nimport type { FooterProps } from './type';\n\nconst Footer = memo<FooterProps>(\n  ({ columns, bottom, theme, contentMaxWidth = 960, children, ...rest }) => {\n    const isEmpty = !columns || columns?.length === 0;\n\n    const { styles } = useStyles({ contentMaxWidth, isEmpty });\n\n    return (\n      <Flexbox as={'section'} className={styles.root} width={'100%'} {...rest}>\n        <RcFooter bottom={bottom} className={styles.footer} columns={columns} theme={theme} />\n        {children}\n      </Flexbox>\n    );\n  },\n);\n\nFooter.displayName = 'Footer';\n\nexport default Footer;\n"],"mappings":";;;;;;;;;AAUA,MAAM,SAAS,MACZ,EAAE,SAAS,QAAQ,OAAO,kBAAkB,KAAK,UAAU,GAAG,WAAW;CAGxE,MAAM,EAAE,WAAW,UAAU;EAAE;EAAiB,SAFhC,CAAC,WAAW,SAAS,WAAW;EAES,CAAC;AAE1D,QACE,qBAACA;EAAQ,IAAI;EAAW,WAAW,OAAO;EAAM,OAAO;EAAQ,GAAI;aACjE,oBAAC;GAAiB;GAAQ,WAAW,OAAO;GAAiB;GAAgB;IAAS,EACrF;GACO;EAGf;AAED,OAAO,cAAc;AAErB,qBAAe"}

package/es/Footer/index.d.mts

@@ -0,0 +1,3 @@
+import { FooterProps } from "./type.mjs";
+import { Footer } from "./Footer.mjs";
+export { FooterProps, Footer as default };

package/es/Footer/index.mjs

@@ -0,0 +1,3 @@
+import Footer_default from "./Footer.mjs";
+
+export { Footer_default as default };

package/es/Footer/style.mjs

@@ -0,0 +1,178 @@
+import { createStyles } from "antd-style";
+
+//#region src/Footer/style.ts
+const useStyles = createStyles(({ css: css$1, responsive, token }, { isEmpty, contentMaxWidth }) => {
+	const prefix = `rc-footer`;
+	return {
+		footer: css$1`
+        font-size: 14px;
+        line-height: 1.5;
+        color: ${token.colorTextSecondary};
+        background-color: ${token.colorBgLayout};
+
+        &.${prefix} {
+          a {
+            color: ${token.colorTextTertiary};
+            text-decoration: none;
+            transition: all 0.3s;
+
+            &:hover {
+              color: ${token.colorLinkHover};
+            }
+          }
+        }
+
+        .${prefix} {
+          &-container {
+            width: 100%;
+            max-width: ${contentMaxWidth}px;
+            margin: auto;
+            padding: ${isEmpty ? "0" : "60px 0 20px"};
+          }
+
+          &-columns {
+            display: flex;
+            justify-content: space-around;
+          }
+
+          &-column {
+            text-align: start;
+
+            h2 {
+              position: relative;
+
+              margin-block: 0;
+              margin-inline: auto;
+
+              font-size: 16px;
+              font-weight: 500;
+              color: ${token.colorText};
+            }
+
+            &-icon {
+              position: relative;
+              inset-block-start: -1px;
+
+              display: inline-block;
+
+              width: 22px;
+              margin-inline-end: 0.5em;
+
+              text-align: center;
+              vertical-align: middle;
+
+              > span,
+              > svg,
+              img {
+                display: block;
+                width: 100%;
+              }
+            }
+          }
+
+          &-item {
+            margin-block: 12px;
+            margin-inline: 0;
+
+            &-icon {
+              position: relative;
+              inset-block-start: -1px;
+
+              display: inline-block;
+
+              width: 16px;
+              margin-inline-end: 0.4em;
+
+              text-align: center;
+              vertical-align: middle;
+
+              > span,
+              > svg,
+              img {
+                display: block;
+                width: 100%;
+              }
+            }
+
+            &-separator {
+              margin-block: 0;
+              margin-inline: 0.3em;
+            }
+          }
+
+          &-bottom {
+            color: ${token.colorTextDescription};
+
+            &-container {
+              width: 100%;
+              max-width: ${contentMaxWidth}px;
+              margin-block: 0;
+              margin-inline: auto;
+              padding-block: 16px;
+              padding-inline: 0;
+
+              line-height: 32px;
+              text-align: center;
+            }
+          }
+
+          &-light {
+            color: rgba(0, 0, 0, 85%);
+            background-color: transparent;
+
+            h2,
+            a {
+              color: rgba(0, 0, 0, 85%);
+            }
+          }
+
+          &-light &-bottom-container {
+            border-block-start-color: #e8e8e8;
+          }
+
+          &-light &-item-separator,
+          &-light &-item-description {
+            color: rgba(0, 0, 0, 45%);
+          }
+        }
+
+        ${responsive.mobile} {
+          .${prefix} {
+            &-container {
+              padding-block: 40px;
+              padding-inline: 0;
+            }
+
+            &-columns {
+              display: block;
+            }
+
+            &-column {
+              display: block;
+              margin-block-end: 40px;
+              text-align: center;
+
+              &:last-child {
+                margin-block-end: 0;
+              }
+            }
+          }
+        }
+      `,
+		root: css$1`
+        grid-area: footer;
+        align-self: stretch;
+        color: ${token.colorTextDescription};
+        border-block-start: 1px solid ${token.colorSplit};
+
+        ${responsive.mobile} {
+          flex-direction: column;
+          border: none;
+        }
+      `
+	};
+});
+
+//#endregion
+export { useStyles };
+//# sourceMappingURL=style.mjs.map

package/es/Footer/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../src/Footer/style.ts"],"sourcesContent":["import { createStyles } from 'antd-style';\n\nexport const useStyles = createStyles(\n  (\n    { css, responsive, token },\n    { isEmpty, contentMaxWidth }: { contentMaxWidth: number; isEmpty: boolean },\n  ) => {\n    const prefix = `rc-footer`;\n\n    return {\n      footer: css`\n        font-size: 14px;\n        line-height: 1.5;\n        color: ${token.colorTextSecondary};\n        background-color: ${token.colorBgLayout};\n\n        &.${prefix} {\n          a {\n            color: ${token.colorTextTertiary};\n            text-decoration: none;\n            transition: all 0.3s;\n\n            &:hover {\n              color: ${token.colorLinkHover};\n            }\n          }\n        }\n\n        .${prefix} {\n          &-container {\n            width: 100%;\n            max-width: ${contentMaxWidth}px;\n            margin: auto;\n            padding: ${isEmpty ? '0' : '60px 0 20px'};\n          }\n\n          &-columns {\n            display: flex;\n            justify-content: space-around;\n          }\n\n          &-column {\n            text-align: start;\n\n            h2 {\n              position: relative;\n\n              margin-block: 0;\n              margin-inline: auto;\n\n              font-size: 16px;\n              font-weight: 500;\n              color: ${token.colorText};\n            }\n\n            &-icon {\n              position: relative;\n              inset-block-start: -1px;\n\n              display: inline-block;\n\n              width: 22px;\n              margin-inline-end: 0.5em;\n\n              text-align: center;\n              vertical-align: middle;\n\n              > span,\n              > svg,\n              img {\n                display: block;\n                width: 100%;\n              }\n            }\n          }\n\n          &-item {\n            margin-block: 12px;\n            margin-inline: 0;\n\n            &-icon {\n              position: relative;\n              inset-block-start: -1px;\n\n              display: inline-block;\n\n              width: 16px;\n              margin-inline-end: 0.4em;\n\n              text-align: center;\n              vertical-align: middle;\n\n              > span,\n              > svg,\n              img {\n                display: block;\n                width: 100%;\n              }\n            }\n\n            &-separator {\n              margin-block: 0;\n              margin-inline: 0.3em;\n            }\n          }\n\n          &-bottom {\n            color: ${token.colorTextDescription};\n\n            &-container {\n              width: 100%;\n              max-width: ${contentMaxWidth}px;\n              margin-block: 0;\n              margin-inline: auto;\n              padding-block: 16px;\n              padding-inline: 0;\n\n              line-height: 32px;\n              text-align: center;\n            }\n          }\n\n          &-light {\n            color: rgba(0, 0, 0, 85%);\n            background-color: transparent;\n\n            h2,\n            a {\n              color: rgba(0, 0, 0, 85%);\n            }\n          }\n\n          &-light &-bottom-container {\n            border-block-start-color: #e8e8e8;\n          }\n\n          &-light &-item-separator,\n          &-light &-item-description {\n            color: rgba(0, 0, 0, 45%);\n          }\n        }\n\n        ${responsive.mobile} {\n          .${prefix} {\n            &-container {\n              padding-block: 40px;\n              padding-inline: 0;\n            }\n\n            &-columns {\n              display: block;\n            }\n\n            &-column {\n              display: block;\n              margin-block-end: 40px;\n              text-align: center;\n\n              &:last-child {\n                margin-block-end: 0;\n              }\n            }\n          }\n        }\n      `,\n      root: css`\n        grid-area: footer;\n        align-self: stretch;\n        color: ${token.colorTextDescription};\n        border-block-start: 1px solid ${token.colorSplit};\n\n        ${responsive.mobile} {\n          flex-direction: column;\n          border: none;\n        }\n      `,\n    };\n  },\n);\n"],"mappings":";;;AAEA,MAAa,YAAY,cAErB,EAAE,YAAK,YAAY,SACnB,EAAE,SAAS,sBACR;CACH,MAAM,SAAS;AAEf,QAAO;EACL,QAAQ,KAAG;;;iBAGA,MAAM,mBAAmB;4BACd,MAAM,cAAc;;YAEpC,OAAO;;qBAEE,MAAM,kBAAkB;;;;;uBAKtB,MAAM,eAAe;;;;;WAKjC,OAAO;;;yBAGO,gBAAgB;;uBAElB,UAAU,MAAM,cAAc;;;;;;;;;;;;;;;;;;;uBAmB9B,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;qBAuDlB,MAAM,qBAAqB;;;;2BAIrB,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UA+BjC,WAAW,OAAO;aACf,OAAO;;;;;;;;;;;;;;;;;;;;;;EAsBd,MAAM,KAAG;;;iBAGE,MAAM,qBAAqB;wCACJ,MAAM,WAAW;;UAE/C,WAAW,OAAO;;;;;EAKvB;EAEJ"}

package/es/Footer/type.d.mts

@@ -0,0 +1,15 @@
+import { FlexboxProps } from "../Flex/type.mjs";
+import "../Flex/index.mjs";
+import { ReactNode } from "react";
+import { FooterProps } from "rc-footer";
+
+//#region src/Footer/type.d.ts
+interface FooterProps$1 extends FlexboxProps {
+  bottom?: ReactNode;
+  columns: FooterProps['columns'];
+  contentMaxWidth?: number;
+  theme?: 'light' | 'dark';
+}
+//#endregion
+export { FooterProps$1 as FooterProps };
+//# sourceMappingURL=type.d.mts.map