@kuzenbo/core 0.0.1-alpha.4 → 0.0.1

package/dist/emoji-picker-size-context-gu6mLjuf.d.ts

@@ -0,0 +1,315 @@
+import { t as UISize } from "./size-system-CMU68sQY.js";
+import * as tailwind_variants0 from "tailwind-variants";
+import { VariantProps } from "tailwind-variants";
+import { ComponentProps } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { EmojiPicker } from "frimousse";
+
+//#region src/ui/emoji-picker/emoji-picker-active-emoji.d.ts
+type EmojiPickerActiveEmojiProps = ComponentProps<typeof EmojiPicker.ActiveEmoji>;
+declare const EmojiPickerActiveEmoji: (props: EmojiPickerActiveEmojiProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-active-emoji-preview.d.ts
+declare const emojiPickerActiveEmojiPreviewVariants: tailwind_variants0.TVReturnType<{
+  size: {
+    xs: {
+      emoji: string;
+      root: string;
+    };
+    sm: {
+      emoji: string;
+      root: string;
+    };
+    md: {
+      emoji: string;
+      root: string;
+    };
+    lg: {
+      emoji: string;
+      root: string;
+    };
+    xl: {
+      emoji: string;
+      root: string;
+    };
+  };
+}, {
+  emoji: string;
+  root: string;
+}, undefined, {
+  size: {
+    xs: {
+      emoji: string;
+      root: string;
+    };
+    sm: {
+      emoji: string;
+      root: string;
+    };
+    md: {
+      emoji: string;
+      root: string;
+    };
+    lg: {
+      emoji: string;
+      root: string;
+    };
+    xl: {
+      emoji: string;
+      root: string;
+    };
+  };
+}, {
+  emoji: string;
+  root: string;
+}, tailwind_variants0.TVReturnType<{
+  size: {
+    xs: {
+      emoji: string;
+      root: string;
+    };
+    sm: {
+      emoji: string;
+      root: string;
+    };
+    md: {
+      emoji: string;
+      root: string;
+    };
+    lg: {
+      emoji: string;
+      root: string;
+    };
+    xl: {
+      emoji: string;
+      root: string;
+    };
+  };
+}, {
+  emoji: string;
+  root: string;
+}, undefined, unknown, unknown, undefined>>;
+type EmojiPickerActiveEmojiPreviewVariantProps = Omit<VariantProps<typeof emojiPickerActiveEmojiPreviewVariants>, "size"> & {
+  size?: UISize;
+};
+type EmojiPickerActiveEmojiPreviewProps = Omit<ComponentProps<typeof EmojiPickerActiveEmoji>, "children"> & EmojiPickerActiveEmojiPreviewVariantProps & {
+  emptyText?: string;
+};
+declare const EmojiPickerActiveEmojiPreview: ({
+  emptyText,
+  size,
+  ...props
+}: EmojiPickerActiveEmojiPreviewProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-content.d.ts
+type EmojiPickerContentProps = Omit<ComponentProps<typeof EmojiPicker.Viewport>, "size"> & {
+  size?: UISize;
+};
+declare const EmojiPickerContent: ({
+  className,
+  size,
+  children,
+  ...props
+}: EmojiPickerContentProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-empty.d.ts
+declare const emojiPickerEmptyVariants: tailwind_variants0.TVReturnType<{
+  size: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+  };
+}, undefined, "absolute inset-0 flex items-center justify-center text-muted-foreground", {
+  size: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+  };
+}, undefined, tailwind_variants0.TVReturnType<{
+  size: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+  };
+}, undefined, "absolute inset-0 flex items-center justify-center text-muted-foreground", unknown, unknown, undefined>>;
+type EmojiPickerEmptyVariantProps = Omit<VariantProps<typeof emojiPickerEmptyVariants>, "size"> & {
+  size?: UISize;
+};
+type EmojiPickerEmptyProps = Omit<ComponentProps<typeof EmojiPicker.Empty>, "size"> & EmojiPickerEmptyVariantProps;
+declare const EmojiPickerEmpty: ({
+  className,
+  size,
+  ...props
+}: EmojiPickerEmptyProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-list.d.ts
+declare const emojiPickerListVariants: tailwind_variants0.TVReturnType<{
+  size: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+  };
+}, undefined, "select-none", {
+  size: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+  };
+}, undefined, tailwind_variants0.TVReturnType<{
+  size: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+  };
+}, undefined, "select-none", unknown, unknown, undefined>>;
+type EmojiPickerListVariantProps = Omit<VariantProps<typeof emojiPickerListVariants>, "size"> & {
+  size?: UISize;
+};
+type EmojiPickerListProps = Omit<ComponentProps<typeof EmojiPicker.List>, "size"> & EmojiPickerListVariantProps;
+declare const EmojiPickerList: ({
+  className,
+  size,
+  ...props
+}: EmojiPickerListProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-loading.d.ts
+declare const emojiPickerLoadingVariants: tailwind_variants0.TVReturnType<{
+  size: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+  };
+}, undefined, "absolute inset-0 flex items-center justify-center text-muted-foreground", {
+  size: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+  };
+}, undefined, tailwind_variants0.TVReturnType<{
+  size: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+  };
+}, undefined, "absolute inset-0 flex items-center justify-center text-muted-foreground", unknown, unknown, undefined>>;
+type EmojiPickerLoadingVariantProps = Omit<VariantProps<typeof emojiPickerLoadingVariants>, "size"> & {
+  size?: UISize;
+};
+type EmojiPickerLoadingProps = Omit<ComponentProps<typeof EmojiPicker.Loading>, "size"> & EmojiPickerLoadingVariantProps;
+declare const EmojiPickerLoading: ({
+  className,
+  size,
+  ...props
+}: EmojiPickerLoadingProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-search.d.ts
+declare const emojiPickerSearchVariants: tailwind_variants0.TVReturnType<{
+  size: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+  };
+}, undefined, "z-50 flex w-full min-w-0 border border-input bg-input shadow-xs transition-[color,box-shadow,border-color] outline-none selection:bg-primary selection:text-primary-foreground placeholder:text-muted-foreground hover:border-ring/70 disabled:pointer-events-none disabled:opacity-50 focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:border-danger aria-invalid:ring-danger/50", {
+  size: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+  };
+}, undefined, tailwind_variants0.TVReturnType<{
+  size: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+  };
+}, undefined, "z-50 flex w-full min-w-0 border border-input bg-input shadow-xs transition-[color,box-shadow,border-color] outline-none selection:bg-primary selection:text-primary-foreground placeholder:text-muted-foreground hover:border-ring/70 disabled:pointer-events-none disabled:opacity-50 focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:border-danger aria-invalid:ring-danger/50", unknown, unknown, undefined>>;
+type EmojiPickerSearchVariantProps = Omit<VariantProps<typeof emojiPickerSearchVariants>, "size"> & {
+  size?: UISize;
+};
+type NativeEmojiPickerSearchProps = ComponentProps<typeof EmojiPicker.Search>;
+type NativeEmojiPickerSearchSize = NativeEmojiPickerSearchProps["size"];
+type EmojiPickerSearchProps = Omit<NativeEmojiPickerSearchProps, "size"> & EmojiPickerSearchVariantProps & {
+  htmlSize?: NativeEmojiPickerSearchSize;
+  wrapperClassName?: string;
+};
+declare const EmojiPickerSearch: ({
+  className,
+  htmlSize,
+  size,
+  wrapperClassName,
+  ...props
+}: EmojiPickerSearchProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-skin-tone.d.ts
+type EmojiPickerSkinToneProps = Omit<ComponentProps<typeof EmojiPicker.SkinTone>, "size"> & {
+  size?: UISize;
+};
+declare const EmojiPickerSkinTone: ({
+  size,
+  ...props
+}: EmojiPickerSkinToneProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-skin-tone-selector.d.ts
+declare const emojiPickerSkinToneSelectorVariants: tailwind_variants0.TVReturnType<{
+  size: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+  };
+}, undefined, "mx-2 mb-1.5 rounded-md bg-popover hover:bg-accent", {
+  size: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+  };
+}, undefined, tailwind_variants0.TVReturnType<{
+  size: {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+  };
+}, undefined, "mx-2 mb-1.5 rounded-md bg-popover hover:bg-accent", unknown, unknown, undefined>>;
+type EmojiPickerSkinToneSelectorVariantProps = Omit<VariantProps<typeof emojiPickerSkinToneSelectorVariants>, "size"> & {
+  size?: UISize;
+};
+type EmojiPickerSkinToneSelectorProps = Omit<ComponentProps<typeof EmojiPicker.SkinToneSelector>, "size"> & EmojiPickerSkinToneSelectorVariantProps;
+declare const EmojiPickerSkinToneSelector: ({
+  className,
+  size,
+  ...props
+}: EmojiPickerSkinToneSelectorProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-size-context.d.ts
+type EmojiPickerSize = UISize;
+//#endregion
+export { EmojiPickerActiveEmojiPreviewProps as _, EmojiPickerSkinToneProps as a, EmojiPickerLoading as c, EmojiPickerListProps as d, EmojiPickerEmpty as f, EmojiPickerActiveEmojiPreview as g, EmojiPickerContentProps as h, EmojiPickerSkinTone as i, EmojiPickerLoadingProps as l, EmojiPickerContent as m, EmojiPickerSkinToneSelector as n, EmojiPickerSearch as o, EmojiPickerEmptyProps as p, EmojiPickerSkinToneSelectorProps as r, EmojiPickerSearchProps as s, EmojiPickerSize as t, EmojiPickerList as u, EmojiPickerActiveEmoji as v, EmojiPickerActiveEmojiProps as y };
+//# sourceMappingURL=emoji-picker-size-context-gu6mLjuf.d.ts.map

package/dist/emoji-picker-size-context-gu6mLjuf.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"emoji-picker-size-context-gu6mLjuf.d.ts","names":[],"sources":["../src/ui/emoji-picker/emoji-picker-active-emoji.tsx","../src/ui/emoji-picker/emoji-picker-active-emoji-preview.tsx","../src/ui/emoji-picker/emoji-picker-content.tsx","../src/ui/emoji-picker/emoji-picker-empty.tsx","../src/ui/emoji-picker/emoji-picker-list.tsx","../src/ui/emoji-picker/emoji-picker-loading.tsx","../src/ui/emoji-picker/emoji-picker-search.tsx","../src/ui/emoji-picker/emoji-picker-skin-tone.tsx","../src/ui/emoji-picker/emoji-picker-skin-tone-selector.tsx","../src/ui/emoji-picker/emoji-picker-size-context.ts"],"mappings":"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"}

package/dist/emoji-picker-skin-tone-selector-DAJcO_Ue.js

@@ -0,0 +1,308 @@
+import { t as createSizeContext } from "./size-context-rJNE33WZ.js";
+import { cn, tv } from "tailwind-variants";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { EmojiPicker } from "frimousse";
+
+//#region src/ui/emoji-picker/emoji-picker-active-emoji.tsx
+const EmojiPickerActiveEmoji = (props) => /* @__PURE__ */ jsx(EmojiPicker.ActiveEmoji, {
+	"data-slot": "emoji-picker-active-emoji",
+	...props
+});
+
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-size-context.ts
+const { SizeContext: EmojiPickerSizeContext, useResolvedSize: useEmojiPickerResolvedSize } = createSizeContext();
+
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-active-emoji-preview.tsx
+const emojiPickerActiveEmojiPreviewVariants = tv({
+	slots: {
+		emoji: "",
+		root: "flex items-center rounded-md border-t bg-popover"
+	},
+	variants: { size: {
+		xs: {
+			emoji: "text-base",
+			root: "gap-1.5 px-2 py-1 text-xs"
+		},
+		sm: {
+			emoji: "text-base",
+			root: "gap-2 px-2.5 py-1.5 text-sm"
+		},
+		md: {
+			emoji: "text-lg",
+			root: "gap-2 px-3 py-2 text-sm"
+		},
+		lg: {
+			emoji: "text-xl",
+			root: "gap-2.5 px-3.5 py-2 text-sm"
+		},
+		xl: {
+			emoji: "text-2xl",
+			root: "gap-3 px-4 py-2.5 text-base"
+		}
+	} },
+	defaultVariants: { size: "md" }
+});
+const EmojiPickerActiveEmojiPreview = ({ emptyText = "Hover or navigate to see emoji details", size, ...props }) => {
+	const resolvedSize = useEmojiPickerResolvedSize(size);
+	const { emoji, root } = emojiPickerActiveEmojiPreviewVariants({ size: resolvedSize });
+	return /* @__PURE__ */ jsx(EmojiPickerActiveEmoji, {
+		...props,
+		children: ({ emoji: activeEmoji }) => /* @__PURE__ */ jsx("div", {
+			className: cn(root(), !activeEmoji && "text-muted-foreground"),
+			"data-size": resolvedSize,
+			"data-slot": "emoji-picker-active-emoji-preview",
+			children: activeEmoji ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("span", {
+				className: emoji(),
+				children: activeEmoji.emoji
+			}), /* @__PURE__ */ jsx("span", { children: activeEmoji.label })] }) : /* @__PURE__ */ jsx("span", { children: emptyText })
+		})
+	});
+};
+
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-content.tsx
+const EmojiPickerContent = ({ className, size, children, ...props }) => {
+	const resolvedSize = useEmojiPickerResolvedSize(size);
+	return /* @__PURE__ */ jsx(EmojiPickerSizeContext.Provider, {
+		value: { size: resolvedSize },
+		children: /* @__PURE__ */ jsx(EmojiPicker.Viewport, {
+			className: cn("relative flex-1 outline-hidden", className),
+			"data-size": resolvedSize,
+			"data-slot": "emoji-picker-content",
+			...props,
+			children
+		})
+	});
+};
+
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-empty.tsx
+const emojiPickerEmptyVariants = tv({
+	base: "absolute inset-0 flex items-center justify-center text-muted-foreground",
+	variants: { size: {
+		xs: "text-xs",
+		sm: "text-sm",
+		md: "text-sm",
+		lg: "text-sm",
+		xl: "text-base"
+	} },
+	defaultVariants: { size: "md" }
+});
+const EmojiPickerEmpty = ({ className, size, ...props }) => {
+	const resolvedSize = useEmojiPickerResolvedSize(size);
+	return /* @__PURE__ */ jsx(EmojiPicker.Empty, {
+		className: cn(emojiPickerEmptyVariants({ size: resolvedSize }), className),
+		"data-size": resolvedSize,
+		"data-slot": "emoji-picker-empty",
+		...props
+	});
+};
+
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-list-category-header.tsx
+const emojiPickerListCategoryHeaderVariants = tv({
+	base: "bg-popover font-medium text-muted-foreground",
+	variants: { size: {
+		xs: "px-2 pb-1 text-[10px]",
+		sm: "px-2.5 pb-1 text-xs",
+		md: "px-3 pb-1.5 text-xs",
+		lg: "px-3.5 pb-1.5 text-sm",
+		xl: "px-4 pb-2 text-sm"
+	} },
+	defaultVariants: { size: "md" }
+});
+const EmojiPickerListCategoryHeader = ({ category, className, size, ...restProps }) => {
+	const resolvedSize = useEmojiPickerResolvedSize(size);
+	return /* @__PURE__ */ jsx("div", {
+		className: cn(emojiPickerListCategoryHeaderVariants({ size: resolvedSize }), className),
+		"data-size": resolvedSize,
+		"data-slot": "emoji-picker-list-category-header",
+		...restProps,
+		children: category.label
+	});
+};
+
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-list-emoji.tsx
+const emojiPickerListEmojiVariants = tv({
+	base: "flex cursor-pointer items-center justify-center rounded-md data-active:bg-accent",
+	variants: { size: {
+		xs: "size-6 text-sm",
+		sm: "size-7 text-base",
+		md: "size-8 text-lg",
+		lg: "size-9 text-xl",
+		xl: "size-10 text-2xl"
+	} },
+	defaultVariants: { size: "md" }
+});
+const EmojiPickerListEmoji = ({ emoji, className, size, ...restProps }) => {
+	const resolvedSize = useEmojiPickerResolvedSize(size);
+	return /* @__PURE__ */ jsx("button", {
+		type: "button",
+		className: cn(emojiPickerListEmojiVariants({ size: resolvedSize }), className),
+		"data-size": resolvedSize,
+		"data-slot": "emoji-picker-list-emoji",
+		...restProps,
+		children: emoji.emoji
+	});
+};
+
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-list-row.tsx
+const emojiPickerListRowVariants = tv({
+	base: "",
+	variants: { size: {
+		xs: "scroll-my-1 px-1",
+		sm: "scroll-my-1.5 px-1.5",
+		md: "scroll-my-1.5 px-1.5",
+		lg: "scroll-my-2 px-2",
+		xl: "scroll-my-2 px-2.5"
+	} },
+	defaultVariants: { size: "md" }
+});
+const EmojiPickerListRow = ({ children, className, size, ...restProps }) => {
+	const resolvedSize = useEmojiPickerResolvedSize(size);
+	return /* @__PURE__ */ jsx(EmojiPickerSizeContext.Provider, {
+		value: { size: resolvedSize },
+		children: /* @__PURE__ */ jsx("div", {
+			className: cn(emojiPickerListRowVariants({ size: resolvedSize }), className),
+			"data-size": resolvedSize,
+			"data-slot": "emoji-picker-list-row",
+			...restProps,
+			children
+		})
+	});
+};
+
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-list.tsx
+const emojiPickerListVariants = tv({
+	base: "select-none",
+	variants: { size: {
+		xs: "pb-1.5",
+		sm: "pb-2",
+		md: "pb-2",
+		lg: "pb-2.5",
+		xl: "pb-3"
+	} },
+	defaultVariants: { size: "md" }
+});
+const EmojiPickerList = ({ className, size, ...props }) => {
+	const resolvedSize = useEmojiPickerResolvedSize(size);
+	return /* @__PURE__ */ jsx(EmojiPickerSizeContext.Provider, {
+		value: { size: resolvedSize },
+		children: /* @__PURE__ */ jsx(EmojiPicker.List, {
+			className: cn(emojiPickerListVariants({ size: resolvedSize }), className),
+			components: {
+				CategoryHeader: EmojiPickerListCategoryHeader,
+				Row: EmojiPickerListRow,
+				Emoji: EmojiPickerListEmoji
+			},
+			"data-size": resolvedSize,
+			"data-slot": "emoji-picker-list",
+			...props
+		})
+	});
+};
+
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-loading.tsx
+const emojiPickerLoadingVariants = tv({
+	base: "absolute inset-0 flex items-center justify-center text-muted-foreground",
+	variants: { size: {
+		xs: "text-xs",
+		sm: "text-sm",
+		md: "text-sm",
+		lg: "text-sm",
+		xl: "text-base"
+	} },
+	defaultVariants: { size: "md" }
+});
+const EmojiPickerLoading = ({ className, size, ...props }) => {
+	const resolvedSize = useEmojiPickerResolvedSize(size);
+	return /* @__PURE__ */ jsx(EmojiPicker.Loading, {
+		className: cn(emojiPickerLoadingVariants({ size: resolvedSize }), className),
+		"data-size": resolvedSize,
+		"data-slot": "emoji-picker-loading",
+		...props
+	});
+};
+
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-search.tsx
+const emojiPickerSearchWrapperVariants = tv({
+	variants: { size: {
+		xs: "p-1.5",
+		sm: "p-2",
+		md: "p-2",
+		lg: "p-2.5",
+		xl: "p-3"
+	} },
+	defaultVariants: { size: "md" }
+});
+const emojiPickerSearchVariants = tv({
+	base: "z-50 flex w-full min-w-0 border border-input bg-input shadow-xs transition-[color,box-shadow,border-color] outline-none selection:bg-primary selection:text-primary-foreground placeholder:text-muted-foreground hover:border-ring/70 disabled:pointer-events-none disabled:opacity-50 focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:border-danger aria-invalid:ring-danger/50",
+	variants: { size: {
+		xs: "h-6 rounded-[min(var(--radius-md),8px)] px-2 text-xs",
+		sm: "h-8 rounded-[min(var(--radius-md),10px)] px-2.5 text-sm",
+		md: "h-9 rounded-md px-3 text-base md:text-sm",
+		lg: "h-10 rounded-md px-3 text-base md:text-sm",
+		xl: "h-11 rounded-md px-4 text-base"
+	} },
+	defaultVariants: { size: "md" }
+});
+const EmojiPickerSearch = ({ className, htmlSize, size, wrapperClassName, ...props }) => {
+	const resolvedSize = useEmojiPickerResolvedSize(size);
+	return /* @__PURE__ */ jsx("div", {
+		className: cn(emojiPickerSearchWrapperVariants({ size: resolvedSize }), wrapperClassName),
+		"data-size": resolvedSize,
+		"data-slot": "emoji-picker-search-wrapper",
+		children: /* @__PURE__ */ jsx(EmojiPicker.Search, {
+			className: cn(emojiPickerSearchVariants({ size: resolvedSize }), className),
+			"data-size": resolvedSize,
+			"data-slot": "emoji-picker-search",
+			size: htmlSize,
+			...props
+		})
+	});
+};
+
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-skin-tone.tsx
+const EmojiPickerSkinTone = ({ size, ...props }) => {
+	const resolvedSize = useEmojiPickerResolvedSize(size);
+	return /* @__PURE__ */ jsx(EmojiPicker.SkinTone, {
+		"data-size": resolvedSize,
+		"data-slot": "emoji-picker-skin-tone",
+		...props
+	});
+};
+
+//#endregion
+//#region src/ui/emoji-picker/emoji-picker-skin-tone-selector.tsx
+const emojiPickerSkinToneSelectorVariants = tv({
+	base: "mx-2 mb-1.5 rounded-md bg-popover hover:bg-accent",
+	variants: { size: {
+		xs: "size-6 text-sm",
+		sm: "size-7 text-base",
+		md: "size-8 text-lg",
+		lg: "size-9 text-xl",
+		xl: "size-10 text-2xl"
+	} },
+	defaultVariants: { size: "md" }
+});
+const EmojiPickerSkinToneSelector = ({ className, size, ...props }) => {
+	const resolvedSize = useEmojiPickerResolvedSize(size);
+	return /* @__PURE__ */ jsx(EmojiPicker.SkinToneSelector, {
+		className: cn(emojiPickerSkinToneSelectorVariants({ size: resolvedSize }), className),
+		"data-size": resolvedSize,
+		"data-slot": "emoji-picker-skin-tone-selector",
+		...props
+	});
+};
+
+//#endregion
+export { EmojiPickerList as a, EmojiPickerActiveEmojiPreview as c, EmojiPickerLoading as i, EmojiPickerSizeContext as l, EmojiPickerSkinTone as n, EmojiPickerEmpty as o, EmojiPickerSearch as r, EmojiPickerContent as s, EmojiPickerSkinToneSelector as t, EmojiPickerActiveEmoji as u };
+//# sourceMappingURL=emoji-picker-skin-tone-selector-DAJcO_Ue.js.map