UNPKG

@yamada-ui/react

Version:

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

1 lines 5.69 kB
{"version":3,"file":"blockquote.cjs","names":["createSlotComponent","blockquoteStyle","useValidChildren","useFindChild","styled","QuoteIcon"],"sources":["../../../../src/components/blockquote/blockquote.tsx"],"sourcesContent":["\"use client\"\n\nimport type { ReactNode } from \"react\"\nimport type { HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { BlockquoteStyle } from \"./blockquote.style\"\nimport { useMemo } from \"react\"\nimport { createSlotComponent, styled } from \"../../core\"\nimport { useFindChild, useValidChildren } from \"../../utils\"\nimport { QuoteIcon } from \"../icon\"\nimport { blockquoteStyle } from \"./blockquote.style\"\n\ninterface ComponentContext\n extends Pick<BlockquoteContentProps, \"citeUrl\">,\n Pick<BlockquoteCaptionProps, \"withDash\"> {}\n\nexport interface BlockquoteRootProps\n extends Omit<HTMLStyledProps<\"figure\">, \"cite\">,\n ThemeProps<BlockquoteStyle>,\n Pick<BlockquoteContentProps, \"citeUrl\">,\n Pick<BlockquoteCaptionProps, \"withDash\"> {\n /**\n * The citation of the blockquote.\n */\n cite?: ReactNode\n /**\n * The icon of the blockquote.\n */\n icon?: ReactNode\n /**\n * The props for the `BlockquoteCaption` component.\n */\n captionProps?: HTMLStyledProps<\"figcaption\">\n /**\n * The props for the `BlockquoteCite` component.\n */\n citeProps?: HTMLStyledProps<\"cite\">\n /**\n * The props for the `BlockquoteContent` component.\n */\n contentProps?: HTMLStyledProps<\"blockquote\">\n}\n\nconst {\n ComponentContext,\n PropsContext: BlockquotePropsContext,\n useComponentContext,\n usePropsContext: useBlockquotePropsContext,\n withContext,\n withProvider,\n} = createSlotComponent<BlockquoteRootProps, BlockquoteStyle, ComponentContext>(\n \"blockquote\",\n blockquoteStyle,\n)\n\nexport { BlockquotePropsContext, useBlockquotePropsContext }\n\n/**\n * `Blockquote` is a component that represents a blockquote. By default, it renders a `blockquote` element.\n *\n * @see https://yamada-ui.com/docs/components/blockquote\n */\nexport const BlockquoteRoot = withProvider<\"figure\", BlockquoteRootProps>(\n ({\n children,\n cite,\n citeUrl,\n icon,\n withDash,\n captionProps,\n citeProps,\n contentProps,\n ...rest\n }) => {\n const validChildren = useValidChildren(children)\n const customBlockquoteContent = useFindChild(\n validChildren,\n BlockquoteContent,\n )\n const customBlockquoteCaption = useFindChild(\n validChildren,\n BlockquoteCaption,\n )\n\n const context = useMemo(() => ({ citeUrl, withDash }), [citeUrl, withDash])\n\n return (\n <ComponentContext value={context}>\n <styled.figure {...rest}>\n {icon}\n\n {customBlockquoteContent ?? (\n <BlockquoteContent {...contentProps}>{children}</BlockquoteContent>\n )}\n\n {customBlockquoteCaption ??\n (cite ? (\n <BlockquoteCaption {...captionProps}>\n <BlockquoteCite {...citeProps}>{cite}</BlockquoteCite>\n </BlockquoteCaption>\n ) : null)}\n </styled.figure>\n </ComponentContext>\n )\n },\n \"root\",\n)()\n\nexport interface BlockquoteContentProps extends HTMLStyledProps<\"blockquote\"> {\n /**\n * The URL of the citation of the blockquote.\n */\n citeUrl?: string\n}\n\nexport const BlockquoteContent = withContext<\n \"blockquote\",\n BlockquoteContentProps\n>(\"blockquote\", \"content\")(\n undefined,\n ({ cite, citeUrl: citeUrlProp, ...rest }) => {\n const { citeUrl } = useComponentContext()\n\n return { ...rest, citeurl: cite ?? citeUrlProp ?? citeUrl }\n },\n)\n\nexport interface BlockquoteCaptionProps extends HTMLStyledProps<\"figcaption\"> {\n /**\n * If `true`, the dash will be shown.\n *\n * @default false\n */\n withDash?: boolean\n}\n\nexport const BlockquoteCaption = withContext<\n \"figcaption\",\n BlockquoteCaptionProps\n>(\"figcaption\", \"caption\")(\n undefined,\n ({ children, withDash: withDashProp, ...rest }) => {\n const { withDash } = useComponentContext()\n\n withDashProp ??= withDash\n\n return {\n ...rest,\n children: (\n <>\n {withDashProp ? <>&mdash;</> : null} {children}\n </>\n ),\n }\n },\n)\n\nexport interface BlockquoteCiteProps extends HTMLStyledProps<\"cite\"> {}\n\nexport const BlockquoteCite = withContext<\"cite\", BlockquoteCiteProps>(\n \"cite\",\n \"cite\",\n)()\n\nexport interface BlockquoteIconProps extends HTMLStyledProps<\"svg\"> {}\n\nexport const BlockquoteIcon = withContext<\"svg\", BlockquoteIconProps>(\n QuoteIcon,\n \"icon\",\n)()\n"],"mappings":";;;;;;;;;;;;;;;AA0CA,MAAM,EACJ,kBACA,cAAc,wBACd,qBACA,iBAAiB,2BACjB,aACA,iBACEA,6CACF,cACAC,yCACD;;;;;;AASD,MAAa,iBAAiB,cAC3B,EACC,UACA,MACA,SACA,MACA,UACA,cACA,WACA,aACA,GAAG,WACC;CACJ,MAAM,gBAAgBC,kCAAiB,SAAS;CAChD,MAAM,0BAA0BC,8BAC9B,eACA,kBACD;CACD,MAAM,0BAA0BA,8BAC9B,eACA,kBACD;AAID,QACE,2CAAC;EAAiB,iCAHW;GAAE;GAAS;GAAU,GAAG,CAAC,SAAS,SAAS,CAAC;YAIvE,4CAACC,uBAAO;GAAO,GAAI;;IAChB;IAEA,2BACC,2CAAC;KAAkB,GAAI;KAAe;MAA6B;IAGpE,4BACE,OACC,2CAAC;KAAkB,GAAI;eACrB,2CAAC;MAAe,GAAI;gBAAY;OAAsB;MACpC,GAClB;;IACQ;GACC;GAGvB,OACD,EAAE;AASH,MAAa,oBAAoB,YAG/B,cAAc,UAAU,CACxB,SACC,EAAE,MAAM,SAAS,YAAa,GAAG,WAAW;CAC3C,MAAM,EAAE,YAAY,qBAAqB;AAEzC,QAAO;EAAE,GAAG;EAAM,SAAS,QAAQ,eAAe;EAAS;EAE9D;AAWD,MAAa,oBAAoB,YAG/B,cAAc,UAAU,CACxB,SACC,EAAE,UAAU,UAAU,aAAc,GAAG,WAAW;CACjD,MAAM,EAAE,aAAa,qBAAqB;AAE1C,kBAAiB;AAEjB,QAAO;EACL,GAAG;EACH,UACE;GACG,eAAe,mFAAE,MAAU,GAAG;GAAK;GAAE;MACrC;EAEN;EAEJ;AAID,MAAa,iBAAiB,YAC5B,QACA,OACD,EAAE;AAIH,MAAa,iBAAiB,YAC5BC,8BACA,OACD,EAAE"}