@alto-avios/alto-ui 5.2.0 → 5.4.0

package/dist/utils/stories/DraggableContainer.js.map

@@ -1 +1 @@
-{"version":3,"file":"DraggableContainer.js","sources":["../../../src/utils/stories/DraggableContainer.tsx"],"sourcesContent":["import { useState, useRef, useEffect } from 'react';\nimport { Box, Paragraph, Heading } from '../../components';\n\nexport const DraggableContainer = ({\n  children,\n  initialWidth = 500,\n  minWidth = 300,\n  maxWidth = 800,\n  title = 'Draggable Container',\n  description = 'Drag the right edge to resize and see scroll behavior',\n}: {\n  children: React.ReactNode;\n  initialWidth?: number;\n  minWidth?: number;\n  maxWidth?: number;\n  title?: string;\n  description?: string;\n}) => {\n  const [width, setWidth] = useState(initialWidth);\n  const [isDragging, setIsDragging] = useState(false);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const dragStartX = useRef<number>(0);\n  const dragStartWidth = useRef<number>(initialWidth);\n\n  const handleMouseDown = (e: React.MouseEvent) => {\n    setIsDragging(true);\n    dragStartX.current = e.clientX;\n    dragStartWidth.current = width;\n    e.preventDefault();\n  };\n\n  const handleMouseMove = (e: MouseEvent) => {\n    if (!isDragging) return;\n\n    const deltaX = e.clientX - dragStartX.current;\n    const newWidth = Math.max(\n      minWidth,\n      Math.min(maxWidth, dragStartWidth.current + deltaX),\n    );\n    setWidth(newWidth);\n  };\n\n  const handleMouseUp = () => {\n    setIsDragging(false);\n  };\n\n  useEffect(() => {\n    if (isDragging) {\n      document.addEventListener('mousemove', handleMouseMove);\n      document.addEventListener('mouseup', handleMouseUp);\n      document.body.style.cursor = 'ew-resize';\n      document.body.style.userSelect = 'none';\n\n      return () => {\n        document.removeEventListener('mousemove', handleMouseMove);\n        document.removeEventListener('mouseup', handleMouseUp);\n        document.body.style.cursor = '';\n        document.body.style.userSelect = '';\n      };\n    }\n  }, [isDragging]);\n\n  return (\n    <div\n      style={{\n        display: 'flex',\n        flexDirection: 'column',\n        alignItems: 'center',\n        gap: '16px',\n      }}\n    >\n      <Box justifyContent=\"center\" maxWidth=\"600px\" flexDirection=\"column\">\n        <Heading as=\"h3\" size=\"sm\" foregroundColor=\"accentSecondary\">\n          {title}\n        </Heading>\n        <Box>\n          <Paragraph>{description}</Paragraph>\n        </Box>\n      </Box>\n\n      <div\n        ref={containerRef}\n        style={{\n          width: `${width}px`,\n          border:\n            'var(--alto-sem-border-width-sm) dashed var(--alto-sem-color-border-secondary)',\n          borderRadius: 'var(--alto-sem-radius-xs)',\n          padding: 'var(--alto-sem-space-lg)',\n          position: 'relative',\n          transition: isDragging ? 'none' : 'width 0.1s ease',\n        }}\n      >\n        {children}\n\n        {/* Drag Handle */}\n        <button\n          aria-label=\"Draggable handle\"\n          onMouseDown={handleMouseDown}\n          style={{\n            position: 'absolute',\n            top: 0,\n            right: '-3px',\n            bottom: 0,\n            width: '6px',\n            cursor: 'ew-resize',\n            background: isDragging ? '#3498db' : 'transparent',\n            borderRadius: '0 8px 8px 0',\n            zIndex: 10,\n            transition: 'background-color 0.2s ease',\n            border: 'none',\n            padding: 0,\n          }}\n          onMouseEnter={(e) => {\n            if (!isDragging) {\n              e.currentTarget.style.background = 'rgba(52, 152, 219, 0.3)';\n            }\n          }}\n          onMouseLeave={(e) => {\n            if (!isDragging) {\n              e.currentTarget.style.background = 'transparent';\n            }\n          }}\n        />\n\n        {/* Resize indicator */}\n        <div\n          style={{\n            position: 'absolute',\n            top: '50%',\n            right: '-1px',\n            transform: 'translateY(-50%)',\n            width: '2px',\n            height: '40px',\n            background: isDragging ? '#3498db' : '#bdc3c7',\n            borderRadius: '1px',\n            opacity: isDragging ? 1 : 0.6,\n            transition: 'all 0.2s ease',\n            pointerEvents: 'none',\n          }}\n        />\n      </div>\n    </div>\n  );\n};\n"],"names":["DraggableContainer","children","initialWidth","minWidth","maxWidth","title","description","width","setWidth","useState","isDragging","setIsDragging","containerRef","useRef","dragStartX","dragStartWidth","handleMouseMove","e","deltaX","clientX","current","newWidth","Math","max","min","handleMouseUp","useEffect","document","addEventListener","body","style","cursor","userSelect","removeEventListener","jsxs","display","flexDirection","alignItems","gap","Box","justifyContent","jsx","Heading","as","size","foregroundColor","Paragraph","ref","border","borderRadius","padding","position","transition","onMouseDown","preventDefault","top","right","bottom","background","zIndex","onMouseEnter","currentTarget","onMouseLeave","transform","height","opacity","pointerEvents"],"mappings":"u1EAGO,MAAMA,EAAqB,EAChCC,WACAC,eAAe,IACfC,WAAW,IACXC,WAAW,IACXC,QAAQ,sBACRC,cAAc,4DASd,MAAOC,EAAOC,GAAYC,EAASP,IAC5BQ,EAAYC,GAAiBF,GAAS,GACvCG,EAAeC,EAAuB,MACtCC,EAAaD,EAAe,GAC5BE,EAAiBF,EAAeX,GAShCc,EAAmBC,IACvB,IAAKP,EAAY,OAEjB,MAAMQ,EAASD,EAAEE,QAAUL,EAAWM,QAChCC,EAAWC,KAAKC,IACpBpB,EACAmB,KAAKE,IAAIpB,EAAUW,EAAeK,QAAUF,IAE9CV,EAASa,IAGLI,EAAgB,KACpBd,GAAc,IAmBhB,OAhBAe,EAAU,KACR,GAAIhB,EAMF,OALAiB,SAASC,iBAAiB,YAAaZ,GACvCW,SAASC,iBAAiB,UAAWH,GACrCE,SAASE,KAAKC,MAAMC,OAAS,YAC7BJ,SAASE,KAAKC,MAAME,WAAa,OAE1B,KACLL,SAASM,oBAAoB,YAAajB,GAC1CW,SAASM,oBAAoB,UAAWR,GACxCE,SAASE,KAAKC,MAAMC,OAAS,GAC7BJ,SAASE,KAAKC,MAAME,WAAa,KAGpC,CAACtB,mBAGFwB,EAAC,MAAA,CACCJ,MAAO,CACLK,QAAS,OACTC,cAAe,SACfC,WAAY,SACZC,IAAK,QAGPrC,SAAA;eAAAiC,EAACK,GAAIC,eAAe,SAASpC,SAAS,QAAQgC,cAAc,SAC1DnC,SAAA;eAAAwC,EAACC,GAAQC,GAAG,KAAKC,KAAK,KAAKC,gBAAgB,kBACxC5C,SAAAI;eAEHoC,EAACF,EAAA,CACCtC,wBAAAwC,EAACK,EAAA,CAAW7C;eAIhBiC,EAAC,MAAA,CACCa,IAAKnC,EACLkB,MAAO,CACLvB,MAAO,GAAGA,MACVyC,OACE,gFACFC,aAAc,4BACdC,QAAS,2BACTC,SAAU,WACVC,WAAY1C,EAAa,OAAS,mBAGnCT,SAAA,CAAAA;eAGDwC,EAAC,SAAA,CACC,aAAW,mBACXY,YAzEiBpC,IACvBN,GAAc,GACdG,EAAWM,QAAUH,EAAEE,QACvBJ,EAAeK,QAAUb,EACzBU,EAAEqC,kBAsEIxB,MAAO,CACLqB,SAAU,WACVI,IAAK,EACLC,MAAO,OACPC,OAAQ,EACRlD,MAAO,MACPwB,OAAQ,YACR2B,WAAYhD,EAAa,UAAY,cACrCuC,aAAc,cACdU,OAAQ,GACRP,WAAY,6BACZJ,OAAQ,OACRE,QAAS,GAEXU,aAAe3C,IACRP,IACHO,EAAE4C,cAAc/B,MAAM4B,WAAa,4BAGvCI,aAAe7C,IACRP,IACHO,EAAE4C,cAAc/B,MAAM4B,WAAa;eAMzCjB,EAAC,MAAA,CACCX,MAAO,CACLqB,SAAU,WACVI,IAAK,MACLC,MAAO,OACPO,UAAW,mBACXxD,MAAO,MACPyD,OAAQ,OACRN,WAAYhD,EAAa,UAAY,UACrCuC,aAAc,MACdgB,QAASvD,EAAa,EAAI,GAC1B0C,WAAY,gBACZc,cAAe"}
+{"version":3,"file":"DraggableContainer.js","sources":["../../../src/utils/stories/DraggableContainer.tsx"],"sourcesContent":["import { useState, useRef, useEffect } from 'react';\nimport { Box, Paragraph, Heading } from '../../components';\n\nexport const DraggableContainer = ({\n  children,\n  initialWidth = 500,\n  minWidth = 300,\n  maxWidth = 800,\n  title = 'Draggable Container',\n  description = 'Drag the right edge to resize and see scroll behavior',\n}: {\n  children: React.ReactNode;\n  initialWidth?: number;\n  minWidth?: number;\n  maxWidth?: number;\n  title?: string;\n  description?: string;\n}) => {\n  const [width, setWidth] = useState(initialWidth);\n  const [isDragging, setIsDragging] = useState(false);\n  const containerRef = useRef<HTMLDivElement>(null);\n  const dragStartX = useRef<number>(0);\n  const dragStartWidth = useRef<number>(initialWidth);\n\n  const handleMouseDown = (e: React.MouseEvent) => {\n    setIsDragging(true);\n    dragStartX.current = e.clientX;\n    dragStartWidth.current = width;\n    e.preventDefault();\n  };\n\n  const handleMouseMove = (e: MouseEvent) => {\n    if (!isDragging) return;\n\n    const deltaX = e.clientX - dragStartX.current;\n    const newWidth = Math.max(\n      minWidth,\n      Math.min(maxWidth, dragStartWidth.current + deltaX),\n    );\n    setWidth(newWidth);\n  };\n\n  const handleMouseUp = () => {\n    setIsDragging(false);\n  };\n\n  useEffect(() => {\n    if (isDragging) {\n      document.addEventListener('mousemove', handleMouseMove);\n      document.addEventListener('mouseup', handleMouseUp);\n      document.body.style.cursor = 'ew-resize';\n      document.body.style.userSelect = 'none';\n\n      return () => {\n        document.removeEventListener('mousemove', handleMouseMove);\n        document.removeEventListener('mouseup', handleMouseUp);\n        document.body.style.cursor = '';\n        document.body.style.userSelect = '';\n      };\n    }\n  }, [isDragging]);\n\n  return (\n    <div\n      style={{\n        display: 'flex',\n        flexDirection: 'column',\n        alignItems: 'center',\n        gap: '16px',\n      }}\n    >\n      <Box justifyContent=\"center\" maxWidth=\"600px\" flexDirection=\"column\">\n        <Heading as=\"h3\" size=\"sm\" foregroundColor=\"accentSecondary\">\n          {title}\n        </Heading>\n        <Box>\n          <Paragraph>{description}</Paragraph>\n        </Box>\n      </Box>\n\n      <div\n        ref={containerRef}\n        style={{\n          width: `${width}px`,\n          border:\n            'var(--alto-sem-border-width-sm) dashed var(--alto-sem-color-border-secondary)',\n          borderRadius: 'var(--alto-sem-radius-xs)',\n          padding: 'var(--alto-sem-space-lg)',\n          position: 'relative',\n          transition: isDragging ? 'none' : 'width 0.1s ease',\n        }}\n      >\n        {children}\n\n        {/* Drag Handle */}\n        <button\n          aria-label=\"Draggable handle\"\n          onMouseDown={handleMouseDown}\n          style={{\n            position: 'absolute',\n            top: 0,\n            right: '-3px',\n            bottom: 0,\n            width: '6px',\n            cursor: 'ew-resize',\n            background: isDragging ? '#3498db' : 'transparent',\n            borderRadius: '0 8px 8px 0',\n            zIndex: 10,\n            transition: 'background-color 0.2s ease',\n            border: 'none',\n            padding: 0,\n          }}\n          onMouseEnter={(e) => {\n            if (!isDragging) {\n              e.currentTarget.style.background = 'rgba(52, 152, 219, 0.3)';\n            }\n          }}\n          onMouseLeave={(e) => {\n            if (!isDragging) {\n              e.currentTarget.style.background = 'transparent';\n            }\n          }}\n        />\n\n        {/* Resize indicator */}\n        <div\n          style={{\n            position: 'absolute',\n            top: '50%',\n            right: '-1px',\n            transform: 'translateY(-50%)',\n            width: '2px',\n            height: '40px',\n            background: isDragging ? '#3498db' : '#bdc3c7',\n            borderRadius: '1px',\n            opacity: isDragging ? 1 : 0.6,\n            transition: 'all 0.2s ease',\n            pointerEvents: 'none',\n          }}\n        />\n      </div>\n    </div>\n  );\n};\n"],"names":["DraggableContainer","children","initialWidth","minWidth","maxWidth","title","description","width","setWidth","useState","isDragging","setIsDragging","containerRef","useRef","dragStartX","dragStartWidth","handleMouseMove","e","deltaX","clientX","current","newWidth","Math","max","min","handleMouseUp","useEffect","document","addEventListener","body","style","cursor","userSelect","removeEventListener","jsxs","display","flexDirection","alignItems","gap","Box","justifyContent","jsx","Heading","as","size","foregroundColor","Paragraph","ref","border","borderRadius","padding","position","transition","onMouseDown","preventDefault","top","right","bottom","background","zIndex","onMouseEnter","currentTarget","onMouseLeave","transform","height","opacity","pointerEvents"],"mappings":"8qGAGO,MAAMA,EAAqB,EAChCC,WACAC,eAAe,IACfC,WAAW,IACXC,WAAW,IACXC,QAAQ,sBACRC,cAAc,4DASd,MAAOC,EAAOC,GAAYC,EAASP,IAC5BQ,EAAYC,GAAiBF,GAAS,GACvCG,EAAeC,EAAuB,MACtCC,EAAaD,EAAe,GAC5BE,EAAiBF,EAAeX,GAShCc,EAAmBC,IACvB,IAAKP,EAAY,OAEjB,MAAMQ,EAASD,EAAEE,QAAUL,EAAWM,QAChCC,EAAWC,KAAKC,IACpBpB,EACAmB,KAAKE,IAAIpB,EAAUW,EAAeK,QAAUF,IAE9CV,EAASa,IAGLI,EAAgB,KACpBd,GAAc,IAmBhB,OAhBAe,EAAU,KACR,GAAIhB,EAMF,OALAiB,SAASC,iBAAiB,YAAaZ,GACvCW,SAASC,iBAAiB,UAAWH,GACrCE,SAASE,KAAKC,MAAMC,OAAS,YAC7BJ,SAASE,KAAKC,MAAME,WAAa,OAE1B,KACLL,SAASM,oBAAoB,YAAajB,GAC1CW,SAASM,oBAAoB,UAAWR,GACxCE,SAASE,KAAKC,MAAMC,OAAS,GAC7BJ,SAASE,KAAKC,MAAME,WAAa,KAGpC,CAACtB,mBAGFwB,EAAC,MAAA,CACCJ,MAAO,CACLK,QAAS,OACTC,cAAe,SACfC,WAAY,SACZC,IAAK,QAGPrC,SAAA;eAAAiC,EAACK,GAAIC,eAAe,SAASpC,SAAS,QAAQgC,cAAc,SAC1DnC,SAAA;eAAAwC,EAACC,GAAQC,GAAG,KAAKC,KAAK,KAAKC,gBAAgB,kBACxC5C,SAAAI;eAEHoC,EAACF,EAAA,CACCtC,wBAAAwC,EAACK,EAAA,CAAW7C;eAIhBiC,EAAC,MAAA,CACCa,IAAKnC,EACLkB,MAAO,CACLvB,MAAO,GAAGA,MACVyC,OACE,gFACFC,aAAc,4BACdC,QAAS,2BACTC,SAAU,WACVC,WAAY1C,EAAa,OAAS,mBAGnCT,SAAA,CAAAA;eAGDwC,EAAC,SAAA,CACC,aAAW,mBACXY,YAzEiBpC,IACvBN,GAAc,GACdG,EAAWM,QAAUH,EAAEE,QACvBJ,EAAeK,QAAUb,EACzBU,EAAEqC,kBAsEIxB,MAAO,CACLqB,SAAU,WACVI,IAAK,EACLC,MAAO,OACPC,OAAQ,EACRlD,MAAO,MACPwB,OAAQ,YACR2B,WAAYhD,EAAa,UAAY,cACrCuC,aAAc,cACdU,OAAQ,GACRP,WAAY,6BACZJ,OAAQ,OACRE,QAAS,GAEXU,aAAe3C,IACRP,IACHO,EAAE4C,cAAc/B,MAAM4B,WAAa,4BAGvCI,aAAe7C,IACRP,IACHO,EAAE4C,cAAc/B,MAAM4B,WAAa;eAMzCjB,EAAC,MAAA,CACCX,MAAO,CACLqB,SAAU,WACVI,IAAK,MACLC,MAAO,OACPO,UAAW,mBACXxD,MAAO,MACPyD,OAAQ,OACRN,WAAYhD,EAAa,UAAY,UACrCuC,aAAc,MACdgB,QAASvD,EAAa,EAAI,GAC1B0C,WAAY,gBACZc,cAAe"}

package/dist/utils/stories/IntroSectionWithCategoryTileGroup.d.ts

@@ -0,0 +1,3 @@
+export declare const categoryTileTitles: string[];
+export declare function IntroSectionWithCategoryTileGroupStory(): import("react/jsx-runtime").JSX.Element;
+export declare const introSectionWithCategoryTileGroupCode = "function Example() {\n  return (\n    <IntroSection\n      alignContent={{ base: 'start', md: 'center' }}\n      paddingTop={{ base: 'sm', md: 'xl' }}\n      paddingBottom={{ base: 'sm', md: 'xl' }}\n    >\n      <IntroSection.Header\n        title=\"Plan your next trip with Avios\"\n        subtitle=\"Choose how you'd like to collect and spend your rewards\"\n      />\n      <IntroSection.Actions>\n        <CategoryTileGroup aria-label=\"Travel categories\">\n          {[\n            'Flights',\n            'Hotels',\n            'Car hire',\n            'Experiences',\n            'Airport transfers',\n            'Travel insurance',\n            'Airport lounges',\n            'Holiday packages',\n            'Cruises',\n            'Rail travel',\n            'Dining rewards',\n            'Shopping partners',\n          ].map((title) => (\n            <CategoryTileGroup.Tile\n              key={title}\n              href=\"#\"\n              media={<Image src={flightsPictogram} alt=\"\" />}\n              title={title}\n            />\n          ))}\n        </CategoryTileGroup>\n      </IntroSection.Actions>\n    </IntroSection>\n  );\n}\n";

package/dist/utils/stories/IntroSectionWithCategoryTileGroup.js

@@ -0,0 +1,5 @@
+import{jsxs as e,jsx as n}from"react/jsx-runtime";import{Image as t}from"../../components/Image/Image.js";import{CategoryTileGroup as i}from"../../components/CategoryTileGroup/CategoryTileGroup.js";import{IntroSection as r}from"../../components/IntroSection/IntroSection.js";const o=["Flights","Hotels","Car hire","Experiences","Airport transfers","Travel insurance","Airport lounges","Holiday packages","Cruises","Rail travel","Dining rewards","Shopping partners"];function a(){/* @__PURE__ */
+return e(r,{paddingTop:{base:"sm",md:"xl"},paddingBottom:{base:"sm",md:"xl"},children:[
+/* @__PURE__ */n(r.Header,{title:"Plan your next trip with Avios",subtitle:"Choose how you'd like to collect and spend your rewards"}),
+/* @__PURE__ */n(r.Actions,{children:/* @__PURE__ */n(i,{"aria-label":"Travel categories",children:o.map(e=>/* @__PURE__ */n(i.Tile,{href:"#",media:/* @__PURE__ */n(t,{src:"data:image/svg+xml,%3csvg%20width='76'%20height='76'%20viewBox='0%200%2076%2076'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M45.0702%2069.1138C61.7135%2069.1138%2075.2084%2055.5346%2075.2084%2038.7872C75.2084%2022.0398%2061.7135%208.46045%2045.0702%208.46045C28.4268%208.46045%2014.9319%2022.0398%2014.9319%2038.7872C14.9319%2055.5346%2028.4268%2069.1138%2045.0702%2069.1138Z'%20fill='%238EBEFF'/%3e%3cpath%20d='M52.9135%2044.0488C50.1656%2049.6238%2051.9456%2056.5534%2052.5241%2057.5385C53.1583%2058.6356%2054.1261%2058.8259%2054.7937%2058.8819C56.5626%2059.0162%2063.1042%2057.5385%2067.3986%2051.8292C67.4764%2051.7396%2067.532%2051.6389%2067.5877%2051.5493C68.0994%2050.6649%2068.0216%2049.6126%2067.3874%2048.8066C63.9386%2044.3958%2058.2759%2042.8173%2055.4834%2042.571C54.4265%2042.4815%2053.403%2043.0636%2052.9358%2044.0488'%20fill='%2300A173'/%3e%3cmask%20id='mask0_34428_1618'%20style='mask-type:luminance'%20maskUnits='userSpaceOnUse'%20x='37'%20y='7'%20width='34'%20height='34'%3e%3cpath%20d='M70.5579%207.68799H37.6829V40.2312H70.5579V7.68799Z'%20fill='white'/%3e%3c/mask%3e%3cg%20mask='url(%23mask0_34428_1618)'%3e%3cpath%20d='M45.0699%208.46045C44.191%208.46045%2043.3232%208.49404%2042.4555%208.5724C41.7101%209.07617%2041.0759%209.78144%2040.6532%2010.6322C35.1573%2021.7487%2038.7174%2035.563%2039.8744%2037.5333C41.1538%2039.7275%2043.0562%2040.1081%2044.3912%2040.2089C44.5025%2040.2089%2044.6249%2040.2201%2044.7584%2040.2201H44.9586C49.1529%2040.1641%2061.3795%2036.9848%2069.512%2026.1594C69.6455%2025.9803%2069.7679%2025.79%2069.8903%2025.5885C70.4465%2024.6257%2070.6468%2023.5734%2070.5244%2022.5435C65.1843%2014.0803%2055.7723%208.46045%2045.0699%208.46045Z'%20fill='%2300A173'/%3e%3c/g%3e%3cpath%20d='M42.3779%2063.539L35.5692%2039.9068L43.4236%2032.2944C45.2815%2030.4808%2045.3594%2027.4806%2043.5237%2025.6447C41.6658%2023.8087%2038.6732%2023.8311%2036.882%2025.723L29.3613%2033.6266L5.87599%2026.7753L1.06988%2031.6115L21.429%2042.0003L12.0393%2051.9524L4.71892%2050.1389L0.791748%2054.0906L11.027%2058.3111L15.1878%2068.5767L19.1484%2064.6249L17.3238%2057.2588L27.2475%2047.8104L37.5829%2068.3416L42.3556%2063.5055V63.5278L42.3779%2063.539Z'%20fill='%23011DAC'/%3e%3c/svg%3e",alt:""}),title:e},e))})})]})}const s="function Example() {\n  return (\n    <IntroSection\n      alignContent={{ base: 'start', md: 'center' }}\n      paddingTop={{ base: 'sm', md: 'xl' }}\n      paddingBottom={{ base: 'sm', md: 'xl' }}\n    >\n      <IntroSection.Header\n        title=\"Plan your next trip with Avios\"\n        subtitle=\"Choose how you'd like to collect and spend your rewards\"\n      />\n      <IntroSection.Actions>\n        <CategoryTileGroup aria-label=\"Travel categories\">\n          {[\n            'Flights',\n            'Hotels',\n            'Car hire',\n            'Experiences',\n            'Airport transfers',\n            'Travel insurance',\n            'Airport lounges',\n            'Holiday packages',\n            'Cruises',\n            'Rail travel',\n            'Dining rewards',\n            'Shopping partners',\n          ].map((title) => (\n            <CategoryTileGroup.Tile\n              key={title}\n              href=\"#\"\n              media={<Image src={flightsPictogram} alt=\"\" />}\n              title={title}\n            />\n          ))}\n        </CategoryTileGroup>\n      </IntroSection.Actions>\n    </IntroSection>\n  );\n}\n";export{a as IntroSectionWithCategoryTileGroupStory,o as categoryTileTitles,s as introSectionWithCategoryTileGroupCode};
+//# sourceMappingURL=IntroSectionWithCategoryTileGroup.js.map

package/dist/utils/stories/IntroSectionWithCategoryTileGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IntroSectionWithCategoryTileGroup.js","sources":["../../../.storybook/assets/images/categoryTileExampleImg.svg","../../../src/utils/stories/IntroSectionWithCategoryTileGroup.tsx"],"sourcesContent":["export default \"data:image/svg+xml,%3csvg%20width='76'%20height='76'%20viewBox='0%200%2076%2076'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M45.0702%2069.1138C61.7135%2069.1138%2075.2084%2055.5346%2075.2084%2038.7872C75.2084%2022.0398%2061.7135%208.46045%2045.0702%208.46045C28.4268%208.46045%2014.9319%2022.0398%2014.9319%2038.7872C14.9319%2055.5346%2028.4268%2069.1138%2045.0702%2069.1138Z'%20fill='%238EBEFF'/%3e%3cpath%20d='M52.9135%2044.0488C50.1656%2049.6238%2051.9456%2056.5534%2052.5241%2057.5385C53.1583%2058.6356%2054.1261%2058.8259%2054.7937%2058.8819C56.5626%2059.0162%2063.1042%2057.5385%2067.3986%2051.8292C67.4764%2051.7396%2067.532%2051.6389%2067.5877%2051.5493C68.0994%2050.6649%2068.0216%2049.6126%2067.3874%2048.8066C63.9386%2044.3958%2058.2759%2042.8173%2055.4834%2042.571C54.4265%2042.4815%2053.403%2043.0636%2052.9358%2044.0488'%20fill='%2300A173'/%3e%3cmask%20id='mask0_34428_1618'%20style='mask-type:luminance'%20maskUnits='userSpaceOnUse'%20x='37'%20y='7'%20width='34'%20height='34'%3e%3cpath%20d='M70.5579%207.68799H37.6829V40.2312H70.5579V7.68799Z'%20fill='white'/%3e%3c/mask%3e%3cg%20mask='url(%23mask0_34428_1618)'%3e%3cpath%20d='M45.0699%208.46045C44.191%208.46045%2043.3232%208.49404%2042.4555%208.5724C41.7101%209.07617%2041.0759%209.78144%2040.6532%2010.6322C35.1573%2021.7487%2038.7174%2035.563%2039.8744%2037.5333C41.1538%2039.7275%2043.0562%2040.1081%2044.3912%2040.2089C44.5025%2040.2089%2044.6249%2040.2201%2044.7584%2040.2201H44.9586C49.1529%2040.1641%2061.3795%2036.9848%2069.512%2026.1594C69.6455%2025.9803%2069.7679%2025.79%2069.8903%2025.5885C70.4465%2024.6257%2070.6468%2023.5734%2070.5244%2022.5435C65.1843%2014.0803%2055.7723%208.46045%2045.0699%208.46045Z'%20fill='%2300A173'/%3e%3c/g%3e%3cpath%20d='M42.3779%2063.539L35.5692%2039.9068L43.4236%2032.2944C45.2815%2030.4808%2045.3594%2027.4806%2043.5237%2025.6447C41.6658%2023.8087%2038.6732%2023.8311%2036.882%2025.723L29.3613%2033.6266L5.87599%2026.7753L1.06988%2031.6115L21.429%2042.0003L12.0393%2051.9524L4.71892%2050.1389L0.791748%2054.0906L11.027%2058.3111L15.1878%2068.5767L19.1484%2064.6249L17.3238%2057.2588L27.2475%2047.8104L37.5829%2068.3416L42.3556%2063.5055V63.5278L42.3779%2063.539Z'%20fill='%23011DAC'/%3e%3c/svg%3e\"","import Image from '../../components/Image';\nimport { CategoryTileGroup } from '../../components/CategoryTileGroup/CategoryTileGroup';\nimport { IntroSection } from '../../components/IntroSection/IntroSection';\nimport flightsPictogram from '../../../.storybook/assets/images/categoryTileExampleImg.svg';\n\nexport const categoryTileTitles = [\n  'Flights',\n  'Hotels',\n  'Car hire',\n  'Experiences',\n  'Airport transfers',\n  'Travel insurance',\n  'Airport lounges',\n  'Holiday packages',\n  'Cruises',\n  'Rail travel',\n  'Dining rewards',\n  'Shopping partners',\n];\n\nexport function IntroSectionWithCategoryTileGroupStory() {\n  return (\n    <IntroSection\n      paddingTop={{ base: 'sm', md: 'xl' }}\n      paddingBottom={{ base: 'sm', md: 'xl' }}\n    >\n      <IntroSection.Header\n        title=\"Plan your next trip with Avios\"\n        subtitle=\"Choose how you'd like to collect and spend your rewards\"\n      />\n      <IntroSection.Actions>\n        <CategoryTileGroup aria-label=\"Travel categories\">\n          {categoryTileTitles.map((title) => (\n            <CategoryTileGroup.Tile\n              key={title}\n              href=\"#\"\n              media={<Image src={flightsPictogram} alt=\"\" />}\n              title={title}\n            />\n          ))}\n        </CategoryTileGroup>\n      </IntroSection.Actions>\n    </IntroSection>\n  );\n}\n\nexport const introSectionWithCategoryTileGroupCode = `function Example() {\n  return (\n    <IntroSection\n      alignContent={{ base: 'start', md: 'center' }}\n      paddingTop={{ base: 'sm', md: 'xl' }}\n      paddingBottom={{ base: 'sm', md: 'xl' }}\n    >\n      <IntroSection.Header\n        title=\"Plan your next trip with Avios\"\n        subtitle=\"Choose how you'd like to collect and spend your rewards\"\n      />\n      <IntroSection.Actions>\n        <CategoryTileGroup aria-label=\"Travel categories\">\n          {[\n            'Flights',\n            'Hotels',\n            'Car hire',\n            'Experiences',\n            'Airport transfers',\n            'Travel insurance',\n            'Airport lounges',\n            'Holiday packages',\n            'Cruises',\n            'Rail travel',\n            'Dining rewards',\n            'Shopping partners',\n          ].map((title) => (\n            <CategoryTileGroup.Tile\n              key={title}\n              href=\"#\"\n              media={<Image src={flightsPictogram} alt=\"\" />}\n              title={title}\n            />\n          ))}\n        </CategoryTileGroup>\n      </IntroSection.Actions>\n    </IntroSection>\n  );\n}\n`;\n"],"names":["categoryTileTitles","IntroSectionWithCategoryTileGroupStory","jsxs","IntroSection","paddingTop","base","md","paddingBottom","children","jsx","Header","title","subtitle","Actions","CategoryTileGroup","map","Tile","href","media","Image","src","alt","introSectionWithCategoryTileGroupCode"],"mappings":"mRAAA,MCKaA,EAAqB,CAChC,UACA,SACA,WACA,cACA,oBACA,mBACA,kBACA,mBACA,UACA,cACA,iBACA,qBAGK,SAASC;AACd,OACEC,EAACC,EAAA,CACCC,WAAY,CAAEC,KAAM,KAAMC,GAAI,MAC9BC,cAAe,CAAEF,KAAM,KAAMC,GAAI,MAEjCE,SAAA;eAAAC,EAACN,EAAaO,OAAb,CACCC,MAAM,iCACNC,SAAS;eAEXH,EAACN,EAAaU,QAAb,CACCL,wBAAAC,EAACK,EAAA,CAAkB,aAAW,oBAC3BN,SAAAR,EAAmBe,IAAKJ,kBACvBF,EAACK,EAAkBE,KAAlB,CAECC,KAAK,IACLC,uBAAQC,EAAA,CAAMC,IDpCb,2rECoCoCC,IAAI,KACzCV,SAHKA,UAUnB,CAEO,MAAMW,EAAwC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alto-avios/alto-ui",
-  "version": "5.2.0",
+  "version": "5.4.0",
   "description": "A react component library for Alto Design System",
   "author": {
     "name": "Ian Caldwell IAGL",
@@ -26,6 +26,7 @@
     "vite:analyze": "vite build --mode analyze",
     "storybook": "storybook dev -p 6006",
     "build:storybook": "storybook build",
+    "chromatic": "chromatic --project-token $CHROMATIC_PROJECT_TOKEN",
     "lint": "eslint",
     "lint:fix": "eslint --fix && npx prettier . --write --ignore-unknown",
     "commit": "cz",
@@ -46,6 +47,7 @@
     "@react-aria/focus": "^3.20.0",
     "@react-aria/i18n": "^3.12.6",
     "@react-aria/interactions": "^3.24.0",
+    "@react-aria/link": "^3.7.9",
     "@react-aria/overlays": "^3.26.0",
     "@react-aria/utils": "^3.28.0",
     "@react-stately/calendar": "^3.7.1",
@@ -62,7 +64,7 @@
     "diff": ">=5.2.2"
   },
   "devDependencies": {
-    "@chromatic-com/storybook": "^5.1.1",
+    "@chromatic-com/storybook": "^5.0.0",
     "@commitlint/cli": "^19.6.0",
     "@commitlint/config-conventional": "^19.6.0",
     "@commitlint/cz-commitlint": "^19.5.0",

package/dist/assets/truncate.css

@@ -1 +0,0 @@
-.u-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

package/dist/flex-BJOhaXnU.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"flex-BJOhaXnU.js","sources":["../src/utils/flex/flex.ts"],"sourcesContent":["import { cva, VariantProps } from 'class-variance-authority';\nimport styles from './flex.module.css';\n\nexport const flexVariants = cva('', {\n  variants: {\n    display: {\n      flex: styles['flex'],\n      'inline-flex': styles['flex--inline'],\n    },\n    alignItems: {\n      start: styles['flex-align-items--start'],\n      flexStart: styles['flex-align-items--flex-start'],\n      center: styles['flex-align-items--center'],\n      flexEnd: styles['flex-align-items--flex-end'],\n      end: styles['flex-align-items--end'],\n      stretch: styles['flex-align-items--stretch'],\n      selfStart: styles['flex-align-items--self-start'],\n      selfEnd: styles['flex-align-items--self-end'],\n      selfCenter: styles['flex-align-items--self-center'],\n    },\n    justifyContent: {\n      flexStart: styles['flex-justify-content--flex-start'],\n      start: styles['flex-justify-content--start'],\n      center: styles['flex-justify-content--center'],\n      flexEnd: styles['flex-justify-content--flex-end'],\n      end: styles['flex-justify-content--end'],\n      spaceBetween: styles['flex-justify-content--space-between'],\n      spaceAround: styles['flex-justify-content--space-around'],\n      spaceEvenly: styles['flex-justify-content--space-evenly'],\n      left: styles['flex-justify-content--left'],\n      right: styles['flex-justify-content--right'],\n      normal: styles['flex-justify-content--normal'],\n      stretch: styles['flex-justify-content--stretch'],\n      inherit: styles['flex-justify-content--inherit'],\n      initial: styles['flex-justify-content--initial'],\n      revert: styles['flex-justify-content--revert'],\n      revertLayer: styles['flex-justify-content--revert-layer'],\n      unset: styles['flex-justify-content--unset'],\n    },\n    flexWrap: {\n      wrap: styles['flex-wrap--wrap'],\n      nowrap: styles['flex-wrap--nowrap'],\n      wrapReverse: styles['flex-wrap--wrap-reverse'],\n    },\n    flexGrow: {\n      0: styles['flex-grow--0'],\n      1: styles['flex-grow--1'],\n      inherit: styles['flex-grow--inherit'],\n      initial: styles['flex-grow--initial'],\n      revert: styles['flex-grow--revert'],\n      revertLayer: styles['flex-grow--revert-layer'],\n      unset: styles['flex-grow--unset'],\n    },\n    flexShrink: {\n      0: styles['flex-shrink--0'],\n      1: styles['flex-shrink--1'],\n      inherit: styles['flex-shrink--inherit'],\n      initial: styles['flex-shrink--initial'],\n      revert: styles['flex-shrink--revert'],\n      revertLayer: styles['flex-shrink--revert-layer'],\n      unset: styles['flex-shrink--unset'],\n    },\n    flexDirection: {\n      row: styles['flex-direction--row'],\n      rowReverse: styles['flex-direction--row-reverse'],\n      column: styles['flex-direction--column'],\n      columnReverse: styles['flex-direction--column-reverse'],\n    },\n    alignSelf: {\n      auto: styles['flex-align-self--auto'],\n      normal: styles['flex-align-self--normal'],\n      start: styles['flex-align-self--start'],\n      end: styles['flex-align-self--end'],\n      center: styles['flex-align-self--center'],\n      flexStart: styles['flex-align-self--flex-start'],\n      flexEnd: styles['flex-align-self--flex-end'],\n      selfStart: styles['flex-align-self--self-start'],\n      selfEnd: styles['flex-align-self--self-end'],\n      baseline: styles['flex-align-self--baseline'],\n      stretch: styles['flex-align-self--stretch'],\n      inherit: styles['flex-align-self--inherit'],\n      initial: styles['flex-align-self--initial'],\n      revert: styles['flex-align-self--revert'],\n      revertLayer: styles['flex-align-self--revert-layer'],\n      unset: styles['flex-align-self--unset'],\n    },\n    alignContent: {\n      normal: styles['flex-align-content--normal'],\n      start: styles['flex-align-content--start'],\n      center: styles['flex-align-content--center'],\n      end: styles['flex-align-content--end'],\n      flexStart: styles['flex-align-content--flex-start'],\n      flexEnd: styles['flex-align-content--flex-end'],\n      baseline: styles['flex-align-content--baseline'],\n      firstBaseline: styles['flex-align-content--first-baseline'],\n      lastBaseline: styles['flex-align-content--last-baseline'],\n      spaceBetween: styles['flex-align-content--space-between'],\n      spaceAround: styles['flex-align-content--space-around'],\n      spaceEvenly: styles['flex-align-content--space-evenly'],\n      stretch: styles['flex-align-content--stretch'],\n      safeCenter: styles['flex-align-content--safe-center'],\n      unsafeCenter: styles['flex-align-content--unsafe-center'],\n      inherit: styles['flex-align-content--inherit'],\n      initial: styles['flex-align-content--initial'],\n      revert: styles['flex-align-content--revert'],\n      revertLayer: styles['flex-align-content--revert-layer'],\n      unset: styles['flex-align-content--unset'],\n    },\n    flexBasis: {\n      maxContent: styles['flex-basis--max-content'],\n      minContent: styles['flex-basis--min-content'],\n      fitContent: styles['flex-basis--fit-content'],\n      content: styles['flex-basis--content'],\n      inherit: styles['flex-basis--inherit'],\n      initial: styles['flex-basis--initial'],\n      revert: styles['flex-basis--revert'],\n      revertLayer: styles['flex-basis--revert-layer'],\n      unset: styles['flex-basis--unset'],\n    },\n    gap: {\n      '5xs': styles['flex-gap--5xs'],\n      '4xs': styles['flex-gap--4xs'],\n      '3xs': styles['flex-gap--3xs'],\n      '2xs': styles['flex-gap--2xs'],\n      xs: styles['flex-gap--xs'],\n      sm: styles['flex-gap--sm'],\n      md: styles['flex-gap--md'],\n      lg: styles['flex-gap--lg'],\n      xl: styles['flex-gap--xl'],\n      '2xl': styles['flex-gap--2xl'],\n      '3xl': styles['flex-gap--3xl'],\n      '4xl': styles['flex-gap--4xl'],\n      '5xl': styles['flex-gap--5xl'],\n      '6xl': styles['flex-gap--6xl'],\n    },\n    rowGap: {\n      '5xs': styles['flex-row-gap--5xs'],\n      '4xs': styles['flex-row-gap--4xs'],\n      '3xs': styles['flex-row-gap--3xs'],\n      '2xs': styles['flex-row-gap--2xs'],\n      xs: styles['flex-row-gap--xs'],\n      sm: styles['flex-row-gap--sm'],\n      md: styles['flex-row-gap--md'],\n      lg: styles['flex-row-gap--lg'],\n      xl: styles['flex-row-gap--xl'],\n      '2xl': styles['flex-row-gap--2xl'],\n      '3xl': styles['flex-row-gap--3xl'],\n      '4xl': styles['flex-row-gap--4xl'],\n      '5xl': styles['flex-row-gap--5xl'],\n      '6xl': styles['flex-row-gap--6xl'],\n    },\n    columnGap: {\n      '5xs': styles['flex-column-gap--5xs'],\n      '4xs': styles['flex-column-gap--4xs'],\n      '3xs': styles['flex-column-gap--3xs'],\n      '2xs': styles['flex-column-gap--2xs'],\n      xs: styles['flex-column-gap--xs'],\n      sm: styles['flex-column-gap--sm'],\n      md: styles['flex-column-gap--md'],\n      lg: styles['flex-column-gap--lg'],\n      xl: styles['flex-column-gap--xl'],\n      '2xl': styles['flex-column-gap--2xl'],\n      '3xl': styles['flex-column-gap--3xl'],\n      '4xl': styles['flex-column-gap--4xl'],\n      '5xl': styles['flex-column-gap--5xl'],\n      '6xl': styles['flex-column-gap--6xl'],\n    },\n  },\n  defaultVariants: {\n    display: 'flex',\n    alignItems: 'stretch',\n    justifyContent: 'flexStart',\n  },\n});\n\nexport type FlexVariants = VariantProps<typeof flexVariants>;\n\nexport const flexArgTypes = {\n  display: {\n    control: 'select',\n    options: ['flex', 'inline-flex'],\n    description: 'CSS display property for flex container',\n    table: {\n      type: { summary: 'flex | inline-flex' },\n      category: 'Layout',\n    },\n  },\n  flexDirection: {\n    control: 'select',\n    options: ['row', 'row-reverse', 'column', 'column-reverse'],\n    description: '**[Responsive]** Defines the direction of flex items',\n    table: {\n      type: { summary: 'row | row-reverse | column | column-reverse' },\n      category: 'Layout',\n    },\n  },\n  flexWrap: {\n    control: 'select',\n    options: ['wrap', 'nowrap', 'wrapReverse'],\n    description: 'Controls whether flex items wrap onto multiple lines',\n    table: {\n      type: { summary: 'wrap | nowrap | wrapReverse' },\n      category: 'Layout',\n    },\n  },\n  justifyContent: {\n    control: 'select',\n    options: [\n      'flexStart',\n      'start',\n      'center',\n      'flexEnd',\n      'end',\n      'spaceBetween',\n      'spaceAround',\n      'spaceEvenly',\n      'left',\n      'right',\n      'normal',\n      'stretch',\n      'inherit',\n      'initial',\n      'revert',\n      'revertLayer',\n      'unset',\n    ],\n    description: '**[Responsive]** Aligns flex items along the main axis',\n    table: {\n      type: { summary: 'JustifyContent' },\n      category: 'Layout',\n    },\n  },\n  alignItems: {\n    control: 'select',\n    options: [\n      'start',\n      'flexStart',\n      'center',\n      'flexEnd',\n      'end',\n      'stretch',\n      'selfStart',\n      'selfEnd',\n      'selfCenter',\n    ],\n    description: '**[Responsive]** Aligns flex items along the cross axis',\n    table: {\n      type: { summary: 'AlignItems' },\n      category: 'Layout',\n    },\n  },\n  alignContent: {\n    control: 'select',\n    options: [\n      'normal',\n      'start',\n      'center',\n      'end',\n      'flexStart',\n      'flexEnd',\n      'baseline',\n      'firstBaseline',\n      'lastBaseline',\n      'spaceBetween',\n      'spaceAround',\n      'spaceEvenly',\n      'stretch',\n      'safeCenter',\n      'unsafeCenter',\n      'inherit',\n      'initial',\n      'revert',\n      'revertLayer',\n      'unset',\n    ],\n    description:\n      'Aligns flex lines when there is extra space in the cross axis',\n    table: {\n      type: { summary: 'AlignContent' },\n      category: 'Layout',\n    },\n  },\n  alignSelf: {\n    control: 'select',\n    options: [\n      'auto',\n      'normal',\n      'start',\n      'end',\n      'center',\n      'flexStart',\n      'flexEnd',\n      'selfStart',\n      'selfEnd',\n      'baseline',\n      'stretch',\n      'inherit',\n      'initial',\n      'revert',\n      'revertLayer',\n      'unset',\n    ],\n    description: 'Overrides align-items for individual flex items',\n    table: {\n      type: { summary: 'AlignSelf' },\n      category: 'Layout',\n    },\n  },\n  gap: {\n    control: 'select',\n    options: [\n      '5xs',\n      '4xs',\n      '3xs',\n      '2xs',\n      'xs',\n      'sm',\n      'md',\n      'lg',\n      'xl',\n      '2xl',\n      '3xl',\n      '4xl',\n      '5xl',\n      '6xl',\n    ],\n    description:\n      '**[Responsive]** Gap between flex items (both row and column)',\n    table: {\n      type: { summary: 'GapSize' },\n      category: 'Layout',\n    },\n  },\n  rowGap: {\n    control: 'select',\n    options: [\n      '5xs',\n      '4xs',\n      '3xs',\n      '2xs',\n      'xs',\n      'sm',\n      'md',\n      'lg',\n      'xl',\n      '2xl',\n      '3xl',\n      '4xl',\n      '5xl',\n      '6xl',\n    ],\n    description: '**[Responsive]** Gap between flex rows',\n    table: {\n      type: { summary: 'GapSize' },\n      category: 'Layout',\n    },\n  },\n  columnGap: {\n    control: 'select',\n    options: [\n      '5xs',\n      '4xs',\n      '3xs',\n      '2xs',\n      'xs',\n      'sm',\n      'md',\n      'lg',\n      'xl',\n      '2xl',\n      '3xl',\n      '4xl',\n      '5xl',\n      '6xl',\n    ],\n    description: '**[Responsive]** Gap between flex columns',\n    table: {\n      type: { summary: 'GapSize' },\n      category: 'Layout',\n    },\n  },\n  flexGrow: {\n    control: 'select',\n    options: [0, 1, 'inherit', 'initial', 'revert', 'revertLayer', 'unset'],\n    description: 'Defines the ability for a flex item to grow',\n    table: {\n      type: {\n        summary: '0 | 1 | inherit | initial | revert | revertLayer | unset',\n      },\n      category: 'Layout',\n    },\n  },\n  flexShrink: {\n    control: 'select',\n    options: [0, 1, 'inherit', 'initial', 'revert', 'revertLayer', 'unset'],\n    description: 'Defines the ability for a flex item to shrink',\n    table: {\n      type: {\n        summary: '0 | 1 | inherit | initial | revert | revertLayer | unset',\n      },\n      category: 'Layout',\n    },\n  },\n  flexBasis: {\n    control: 'select',\n    options: [\n      'maxContent',\n      'minContent',\n      'fitContent',\n      'content',\n      'inherit',\n      'initial',\n      'revert',\n      'revertLayer',\n      'unset',\n    ],\n    description:\n      'Defines the default size of a flex item before remaining space is distributed',\n    table: {\n      type: { summary: 'FlexBasis' },\n      category: 'Layout',\n    },\n  },\n};\n"],"names":["flexVariants","cva","variants","display","flex","styles","alignItems","start","flexStart","center","flexEnd","end","stretch","selfStart","selfEnd","selfCenter","justifyContent","spaceBetween","spaceAround","spaceEvenly","left","right","normal","inherit","initial","revert","revertLayer","unset","flexWrap","wrap","nowrap","wrapReverse","flexGrow","flexShrink","flexDirection","row","rowReverse","column","columnReverse","alignSelf","auto","baseline","alignContent","firstBaseline","lastBaseline","safeCenter","unsafeCenter","flexBasis","maxContent","minContent","fitContent","content","gap","xs","sm","md","lg","xl","rowGap","columnGap","defaultVariants","flexArgTypes","control","options","description","table","type","summary","category"],"mappings":"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CA,cACA,cACA,UACA,aACA,eACA,UACA,UACA,SACA,cACA,SAEFC,YACE,gEACFC,MAAO,CACLC,KAAM,CAAEC,QAAS,gBACjBC,SAAU,WAGd7B,UAAW,CACTuB,QAAS,SACTC,QAAS,CACP,OACA,SACA,QACA,MACA,SACA,YACA,UACA,YACA,UACA,WACA,UACA,UACA,UACA,SACA,cACA,SAEFC,YAAa,kDACbC,MAAO,CACLC,KAAM,CAAEC,QAAS,aACjBC,SAAU,WAGdhB,IAAK,CACHU,QAAS,SACTC,QAAS,CACP,MACA,MACA,MACA,MACA,KACA,KACA,KACA,KACA,KACA,MACA,MACA,MACA,MACA,OAEFC,YACE,gEACFC,MAAO,CACLC,KAAM,CAAEC,QAAS,WACjBC,SAAU,WAGdV,OAAQ,CACNI,QAAS,SACTC,QAAS,CACP,MACA,MACA,MACA,MACA,KACA,KACA,KACA,KACA,KACA,MACA,MACA,MACA,MACA,OAEFC,YAAa,yCACbC,MAAO,CACLC,KAAM,CAAEC,QAAS,WACjBC,SAAU,WAGdT,UAAW,CACTG,QAAS,SACTC,QAAS,CACP,MACA,MACA,MACA,MACA,KACA,KACA,KACA,KACA,KACA,MACA,MACA,MACA,MACA,OAEFC,YAAa,4CACbC,MAAO,CACLC,KAAM,CAAEC,QAAS,WACjBC,SAAU,WAGdpC,SAAU,CACR8B,QAAS,SACTC,QAAS,CAAC,EAAG,EAAG,UAAW,UAAW,SAAU,cAAe,SAC/DC,YAAa,8CACbC,MAAO,CACLC,KAAM,CACJC,QAAS,4DAEXC,SAAU,WAGdnC,WAAY,CACV6B,QAAS,SACTC,QAAS,CAAC,EAAG,EAAG,UAAW,UAAW,SAAU,cAAe,SAC/DC,YAAa,gDACbC,MAAO,CACLC,KAAM,CACJC,QAAS,4DAEXC,SAAU,WAGdrB,UAAW,CACTe,QAAS,SACTC,QAAS,CACP,aACA,aACA,aACA,UACA,UACA,UACA,SACA,cACA,SAEFC,YACE,gFACFC,MAAO,CACLC,KAAM,CAAEC,QAAS,aACjBC,SAAU"}

package/dist/utils/truncate/truncate.d.ts

@@ -1,6 +0,0 @@
-import { ResponsiveProp } from '../breakpoint/responsive';
-/**
- * Returns the BEM truncate class if truncate is true for the current breakpoint.
- * @param truncate Responsive boolean truncate prop
- */
-export declare function useTruncate(truncate?: ResponsiveProp<boolean>): "" | "u-truncate";

package/dist/utils/truncate/truncate.js

@@ -1,2 +0,0 @@
-import{resolveResponsiveProp as o}from"../breakpoint/responsive.js";import{useBreakpoint as r}from"../breakpoint/hooks/useBreakpoint.js";function t(t=!1){const e=r();return o(t,e)?"u-truncate":""}export{t as useTruncate};
-//# sourceMappingURL=truncate.js.map

package/dist/utils/truncate/truncate.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"truncate.js","sources":["../../../src/utils/truncate/truncate.ts"],"sourcesContent":["import {\n  resolveResponsiveProp,\n  type ResponsiveProp,\n} from '../breakpoint/responsive';\nimport { useBreakpoint } from '../breakpoint/hooks/useBreakpoint';\n\n/**\n * Returns the BEM truncate class if truncate is true for the current breakpoint.\n * @param truncate Responsive boolean truncate prop\n */\nexport function useTruncate(truncate: ResponsiveProp<boolean> = false) {\n  const breakpoint = useBreakpoint();\n  const resolvedTruncate = resolveResponsiveProp(truncate, breakpoint);\n  return resolvedTruncate ? 'u-truncate' : '';\n}\n"],"names":["useTruncate","truncate","breakpoint","useBreakpoint","resolveResponsiveProp"],"mappings":"yIAUO,SAASA,EAAYC,GAAoC,GAC9D,MAAMC,EAAaC,IAEnB,OADyBC,EAAsBH,EAAUC,GAC/B,aAAe,EAC3C"}