import{j as e}from"./jsx-runtime-CnH95YSl.js";import{M as s,a as T,b as L}from"./Typography-r6MlG5YM.js";import{O as B}from"./OdysseyStorybookThemeDecorator-BuDiOG2V.js";import{W}from"./WorkflowsComponentsStorybookThemeDecorator-CxOFxh0W.js";import"./index-NdkWRN8K.js";import"./_commonjsHelpers-gnU0ypJ3.js";import"./emotion-react-jsx-runtime.browser.esm-DL0BDwaj.js";import"./OdysseyThemeProvider-Bh0Bu-2o.js";import"./Typography-ClQ35Rr-.js";import"./index-BJTM6NaI.js";import"./OdysseyProvider-qIn9QVYS.js";import"./i18next-7SyOfhCu.js";const o={maxWidth:"400px",border:"1px dashed #ccc",padding:"16px"},M={title:"Resource Access Policy Components/Typography",component:s,decorators:[B,W],tags:["autodocs"],argTypes:{children:{control:"text",description:"The text content of the component."},clampLines:{control:"number",description:"Limits the text to a specified number of lines, adding ellipsis when content overflows.",table:{type:{summary:"number"}}},wordBreak:{control:"select",options:["normal","break-all","keep-all","break-word"],description:"Controls how text should break within the element.",table:{type:{summary:"string"}}}},args:{children:"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."},parameters:{docs:{description:{component:"Demonstrates the `wordBreak` and `clampLines` props for controlling text overflow behavior in Typography components."}}}},r={render:()=>e.jsx("div",{style:o,children:e.jsx(s,{wordBreak:"break-all",children:"ThisIsAVeryLongWordWithoutSpacesThatNeedsToBeHandledProperly_AnExampleOfURLOrIdentifier"})}),parameters:{docs:{description:{story:"Use `wordBreak` to control how long words or URLs should break within the container. Useful for preventing overflow from long unbroken strings."}}}},n={render:()=>e.jsx("div",{style:o,children:e.jsx(s,{clampLines:3,children:"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur."})}),parameters:{docs:{description:{story:"Use `clampLines` to limit the number of visible lines and add ellipsis when content overflows. Great for truncating long text in cards or lists."}}}},t={render:()=>e.jsx("div",{style:o,children:e.jsx(s,{clampLines:2,wordBreak:"break-word",children:"ThisIsAVeryLongWordWithoutSpaces_FollowedByMoreText_AndEvenMoreText_ThatWillDemonstrateHowBothPropsWorkTogether. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."})}),parameters:{docs:{description:{story:"Combine `wordBreak` and `clampLines` to handle long words while limiting the number of visible lines. This ensures content fits within the container both horizontally and vertically."}}}},i={render:()=>e.jsx("div",{style:o,children:e.jsx(T,{clampLines:2,children:"This Is A Very Long Heading That Should Be Clamped To Two Lines And Show Ellipsis When It Overflows The Container"})}),parameters:{docs:{description:{story:"Example of using `clampLines` with a heading component to prevent long titles from taking up too much space."}}}},a={render:()=>e.jsx("div",{style:o,children:e.jsx(L,{wordBreak:"break-all",children:"https://example.com/very-long-url-path/that-would-normally-overflow/the-container/without-proper-word-breaking"})}),parameters:{docs:{description:{story:"Example of using `wordBreak` with a paragraph to handle long URLs that would otherwise overflow the container."}}}};var l,d,p;r.parameters={...r.parameters,docs:{...(l=r.parameters)==null?void 0:l.docs,source:{originalSource:`{
  render: () => <div style={containerStyle}>
      <Typography wordBreak="break-all">
        ThisIsAVeryLongWordWithoutSpacesThatNeedsToBeHandledProperly_AnExampleOfURLOrIdentifier
      </Typography>
    </div>,
  parameters: {
    docs: {
      description: {
        story: "Use \`wordBreak\` to control how long words or URLs should break within the container. Useful for preventing overflow from long unbroken strings."
      }
    }
  }
}`,...(p=(d=r.parameters)==null?void 0:d.docs)==null?void 0:p.source}}};var c,m,h;n.parameters={...n.parameters,docs:{...(c=n.parameters)==null?void 0:c.docs,source:{originalSource:`{
  render: () => <div style={containerStyle}>
      <Typography clampLines={3}>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod
        tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim
        veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea
        commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
        velit esse cillum dolore eu fugiat nulla pariatur.
      </Typography>
    </div>,
  parameters: {
    docs: {
      description: {
        story: "Use \`clampLines\` to limit the number of visible lines and add ellipsis when content overflows. Great for truncating long text in cards or lists."
      }
    }
  }
}`,...(h=(m=n.parameters)==null?void 0:m.docs)==null?void 0:h.source}}};var u,g,y;t.parameters={...t.parameters,docs:{...(u=t.parameters)==null?void 0:u.docs,source:{originalSource:`{
  render: () => <div style={containerStyle}>
      <Typography clampLines={2} wordBreak="break-word">
        ThisIsAVeryLongWordWithoutSpaces_FollowedByMoreText_AndEvenMoreText_ThatWillDemonstrateHowBothPropsWorkTogether.
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod
        tempor incididunt ut labore et dolore magna aliqua.
      </Typography>
    </div>,
  parameters: {
    docs: {
      description: {
        story: "Combine \`wordBreak\` and \`clampLines\` to handle long words while limiting the number of visible lines. This ensures content fits within the container both horizontally and vertically."
      }
    }
  }
}`,...(y=(g=t.parameters)==null?void 0:g.docs)==null?void 0:y.source}}};var w,f,v;i.parameters={...i.parameters,docs:{...(w=i.parameters)==null?void 0:w.docs,source:{originalSource:`{
  render: () => <div style={containerStyle}>
      <Heading2 clampLines={2}>
        This Is A Very Long Heading That Should Be Clamped To Two Lines And Show
        Ellipsis When It Overflows The Container
      </Heading2>
    </div>,
  parameters: {
    docs: {
      description: {
        story: "Example of using \`clampLines\` with a heading component to prevent long titles from taking up too much space."
      }
    }
  }
}`,...(v=(f=i.parameters)==null?void 0:f.docs)==null?void 0:v.source}}};var b,k,x;a.parameters={...a.parameters,docs:{...(b=a.parameters)==null?void 0:b.docs,source:{originalSource:`{
  render: () => <div style={containerStyle}>
      <Paragraph wordBreak="break-all">
        https://example.com/very-long-url-path/that-would-normally-overflow/the-container/without-proper-word-breaking
      </Paragraph>
    </div>,
  parameters: {
    docs: {
      description: {
        story: "Example of using \`wordBreak\` with a paragraph to handle long URLs that would otherwise overflow the container."
      }
    }
  }
}`,...(x=(k=a.parameters)==null?void 0:k.docs)==null?void 0:x.source}}};const R=["WordBreak","LineClamp","CombinedWordBreakAndClamp","HeadingWithClamp","ParagraphWithWordBreak"];export{t as CombinedWordBreakAndClamp,i as HeadingWithClamp,n as LineClamp,a as ParagraphWithWordBreak,r as WordBreak,R as __namedExportsOrder,M as default};
