@yamada-ui/react
Version:
React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion
71 lines (67 loc) • 2.74 kB
JavaScript
"use client";
import { useFindChild, useValidChildren } from "../../utils/children.js";
import { styled } from "../../core/system/factory.js";
import { createSlotComponent } from "../../core/components/create-component.js";
import { QuoteIcon } from "../icon/icons/quote-icon.js";
import { blockquoteStyle } from "./blockquote.style.js";
import { useMemo } from "react";
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
//#region src/components/blockquote/blockquote.tsx
const { ComponentContext, PropsContext: BlockquotePropsContext, useComponentContext, usePropsContext: useBlockquotePropsContext, withContext, withProvider } = createSlotComponent("blockquote", blockquoteStyle);
/**
* `Blockquote` is a component that represents a blockquote. By default, it renders a `blockquote` element.
*
* @see https://yamada-ui.com/docs/components/blockquote
*/
const BlockquoteRoot = withProvider(({ children, cite, citeUrl, icon, withDash, captionProps, citeProps, contentProps,...rest }) => {
const validChildren = useValidChildren(children);
const customBlockquoteContent = useFindChild(validChildren, BlockquoteContent);
const customBlockquoteCaption = useFindChild(validChildren, BlockquoteCaption);
return /* @__PURE__ */ jsx(ComponentContext, {
value: useMemo(() => ({
citeUrl,
withDash
}), [citeUrl, withDash]),
children: /* @__PURE__ */ jsxs(styled.figure, {
...rest,
children: [
icon,
customBlockquoteContent ?? /* @__PURE__ */ jsx(BlockquoteContent, {
...contentProps,
children
}),
customBlockquoteCaption ?? (cite ? /* @__PURE__ */ jsx(BlockquoteCaption, {
...captionProps,
children: /* @__PURE__ */ jsx(BlockquoteCite, {
...citeProps,
children: cite
})
}) : null)
]
})
});
}, "root")();
const BlockquoteContent = withContext("blockquote", "content")(void 0, ({ cite, citeUrl: citeUrlProp,...rest }) => {
const { citeUrl } = useComponentContext();
return {
...rest,
citeurl: cite ?? citeUrlProp ?? citeUrl
};
});
const BlockquoteCaption = withContext("figcaption", "caption")(void 0, ({ children, withDash: withDashProp,...rest }) => {
const { withDash } = useComponentContext();
withDashProp ??= withDash;
return {
...rest,
children: /* @__PURE__ */ jsxs(Fragment$1, { children: [
withDashProp ? /* @__PURE__ */ jsx(Fragment$1, { children: "—" }) : null,
" ",
children
] })
};
});
const BlockquoteCite = withContext("cite", "cite")();
const BlockquoteIcon = withContext(QuoteIcon, "icon")();
//#endregion
export { BlockquoteCaption, BlockquoteCite, BlockquoteContent, BlockquoteIcon, BlockquotePropsContext, BlockquoteRoot, useBlockquotePropsContext };
//# sourceMappingURL=blockquote.js.map