@universal-tennis/ui-shared 0.1.86 → 0.1.88

package/dist/stories/molecules/FooterSection/FooterSection.js

@@ -1,12 +1,12 @@
-import React from 'react';
-import Box from '@mui/material/Box';
-import Link from '@mui/material/Link';
-import Typography from '../../atoms/Typography/Typography';
-function FooterSection({ items, title }) {
-    return (React.createElement(Box, null,
-        React.createElement(Typography, { mb: 2, isCap: true, category: "secondary", size: "medium-medium", sx: { color: "var(--teal)" } }, title), items === null || items === void 0 ? void 0 :
-        items.map((item) => (React.createElement(Link, { key: item.label, sx: { "&:hover": { color: "var(--white)" } }, underline: "hover", color: "palette.common.white", href: item.href },
-            React.createElement(Typography, { mb: 1, category: "secondary", size: "small-book", sx: { color: "var(--white)", opacity: 0.75 } }, item.label))))));
-}
-export default FooterSection;
+import React from 'react';
+import Box from '@mui/material/Box';
+import Link from '@mui/material/Link';
+import Typography from '../../atoms/Typography/Typography';
+function FooterSection({ items, title }) {
+    return (React.createElement(Box, null,
+        React.createElement(Typography, { mb: 2, isCap: true, category: "secondary", size: "medium-medium", sx: { color: "var(--teal)" } }, title), items === null || items === void 0 ? void 0 :
+        items.map((item) => (React.createElement(Link, { key: item.label, sx: { "&:hover": { color: "var(--white)" } }, underline: "hover", color: "palette.common.white", href: item.href },
+            React.createElement(Typography, { mb: 1, category: "secondary", size: "small-book", sx: { color: "var(--white)", opacity: 0.75 } }, item.label))))));
+}
+export default FooterSection;
 //# sourceMappingURL=FooterSection.js.map

package/dist/stories/molecules/FooterSection/FooterSection.stories.d.ts

@@ -1,5 +1,5 @@
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const Section: any;
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const Section: any;

package/dist/stories/molecules/FooterSection/FooterSection.stories.js

@@ -1,21 +1,21 @@
-import React from 'react';
-import FooterSection from './FooterSection';
-// Default
-export default {
-    title: 'Molecules/FooterSection',
-};
-// Templates
-function FooterSectionTemplate(args) {
-    return React.createElement(FooterSection, Object.assign({}, args));
-}
-// Stories
-export const Section = FooterSectionTemplate.bind({});
-Section.args = {
-    items: [
-        { href: '#', label: 'Countries' },
-        { href: '#', label: 'States' },
-        { href: '#', label: 'Cities' },
-    ],
-    title: "Explore",
-};
+import React from 'react';
+import FooterSection from './FooterSection';
+// Default
+export default {
+    title: 'Molecules/FooterSection',
+};
+// Templates
+function FooterSectionTemplate(args) {
+    return React.createElement(FooterSection, Object.assign({}, args));
+}
+// Stories
+export const Section = FooterSectionTemplate.bind({});
+Section.args = {
+    items: [
+        { href: '#', label: 'Countries' },
+        { href: '#', label: 'States' },
+        { href: '#', label: 'Cities' },
+    ],
+    title: "Explore",
+};
 //# sourceMappingURL=FooterSection.stories.js.map

package/dist/stories/molecules/FooterSection/sharedTypes.d.ts

@@ -1,5 +1,5 @@
-import { LinkItem } from "stories/organisms/Footer/sharedTypes";
-export type FooterSectionProps = {
-    items: [LinkItem];
-    title: string;
-};
+import { LinkItem } from "stories/organisms/Footer/sharedTypes";
+export type FooterSectionProps = {
+    items: [LinkItem];
+    title: string;
+};

package/dist/stories/molecules/FooterSection/sharedTypes.js

@@ -1,2 +1,2 @@
-export {};
+export {};
 //# sourceMappingURL=sharedTypes.js.map

package/dist/stories/molecules/SquareAvatarWithName/SquareAvatarWithName.d.ts

@@ -1,29 +1,29 @@
-/// <reference types="react" />
-export interface SquareAvatarWithNameProps {
-    avatarOnly?: boolean;
-    avatarFontCategory?: string;
-    avatarFontSize?: string;
-    avatarWidth?: string;
-    avatarHeight?: string;
-    href?: string;
-    maxLinkWidth?: string;
-    name: string;
-    fontCategory?: string;
-    fontSize?: string;
-    disabled?: boolean;
-    subtitle?: string;
-}
-export default function SquareAvatarWithName({ avatarOnly, name, avatarFontSize, href, avatarFontCategory, avatarWidth, avatarHeight, fontSize, fontCategory, disabled, maxLinkWidth, subtitle }: {
-    avatarOnly?: boolean | undefined;
-    name?: string | undefined;
-    avatarFontSize?: string | undefined;
-    href?: string | undefined;
-    avatarFontCategory?: string | undefined;
-    avatarWidth?: string | undefined;
-    avatarHeight?: string | undefined;
-    fontSize?: string | undefined;
-    fontCategory?: string | undefined;
-    disabled?: boolean | undefined;
-    maxLinkWidth?: string | undefined;
-    subtitle?: string | undefined;
-}): JSX.Element;
+/// <reference types="react" />
+export interface SquareAvatarWithNameProps {
+    avatarOnly?: boolean;
+    avatarFontCategory?: string;
+    avatarFontSize?: string;
+    avatarWidth?: string;
+    avatarHeight?: string;
+    href?: string;
+    maxLinkWidth?: string;
+    name: string;
+    fontCategory?: string;
+    fontSize?: string;
+    disabled?: boolean;
+    subtitle?: string;
+}
+export default function SquareAvatarWithName({ avatarOnly, name, avatarFontSize, href, avatarFontCategory, avatarWidth, avatarHeight, fontSize, fontCategory, disabled, maxLinkWidth, subtitle }: {
+    avatarOnly?: boolean | undefined;
+    name?: string | undefined;
+    avatarFontSize?: string | undefined;
+    href?: string | undefined;
+    avatarFontCategory?: string | undefined;
+    avatarWidth?: string | undefined;
+    avatarHeight?: string | undefined;
+    fontSize?: string | undefined;
+    fontCategory?: string | undefined;
+    disabled?: boolean | undefined;
+    maxLinkWidth?: string | undefined;
+    subtitle?: string | undefined;
+}): JSX.Element;

package/dist/stories/molecules/SquareAvatarWithName/SquareAvatarWithName.js

@@ -1,30 +1,33 @@
-import React from 'react';
-import Avatar from '@mui/material/Avatar';
-import Box from '@mui/material/Box';
-import Link from '@mui/material/Link';
-import Typography from '../../atoms/Typography/Typography';
-export default function SquareAvatarWithName({ avatarOnly = false, name = '', avatarFontSize = 'small-medium', href = '', avatarFontCategory = 'primary', avatarWidth = '26px', avatarHeight = '26px', fontSize = 'medium-book', fontCategory = 'secondary', disabled = false, maxLinkWidth = "auto", subtitle = '' }) {
-    const getAcronym = (str) => {
-        const cleanStr = str === null || str === void 0 ? void 0 : str.replace(/[^a-zA-Z\s]/g, '').split(' '); // Remove non-letter and non-space characters
-        const acronym = cleanStr === null || cleanStr === void 0 ? void 0 : cleanStr.map((word) => word.charAt(0)).join('').substring(0, 3);
-        return acronym;
-    };
-    const SquareAvatarComponent = (React.createElement(Avatar, { sx: {
-            backgroundColor: disabled ? 'var(--grey)' : 'var(--black)',
-            marginRight: '8px',
-            width: `${avatarWidth}`,
-            height: `${avatarHeight}`
-        }, variant: "rounded" },
-        React.createElement(Typography, { sx: { textTransform: 'uppercase' }, size: avatarFontSize, category: avatarFontCategory }, disabled ? '—' : getAcronym(name))));
-    return (avatarOnly ? (SquareAvatarComponent) : (React.createElement(Box, { display: "flex", alignItems: "center" },
-        SquareAvatarComponent,
-        React.createElement(Box, null,
-            href ? (React.createElement(Link, { href: href, sx: { textDecoration: 'none' } },
-                React.createElement(Typography, { category: fontCategory, size: fontSize, maxWidth: maxLinkWidth, sx: { whiteSpace: 'noWrap', overflow: 'hidden', textOverflow: 'ellipsis' } }, name))) : (React.createElement(Typography, { category: fontCategory, size: fontSize, sx: {
-                    whiteSpace: 'noWrap', overflow: 'hidden', textOverflow: 'ellipsis', color: disabled ? 'grey' : 'black'
-                } }, name)),
-            subtitle && (React.createElement(Typography, { category: "secondary", size: "small-book", sx: {
-                    whiteSpace: 'noWrap', overflow: 'hidden', textOverflow: 'ellipsis', color: 'black'
-                } }, subtitle))))));
-}
+import React from 'react';
+import Avatar from '@mui/material/Avatar';
+import Box from '@mui/material/Box';
+import Link from '@mui/material/Link';
+import Typography from '../../atoms/Typography/Typography';
+export default function SquareAvatarWithName({ avatarOnly = false, name = '', avatarFontSize = 'small-medium', href = '', avatarFontCategory = 'primary', avatarWidth = '26px', avatarHeight = '26px', fontSize = 'medium-book', fontCategory = 'secondary', disabled = false, maxLinkWidth = "auto", subtitle = '' }) {
+    const getAcronym = (str) => {
+        const cleanStr = str === null || str === void 0 ? void 0 : str.replace(/[^a-zA-Z\s]/g, '').split(' '); // Remove non-letter and non-space characters
+        const acronym = cleanStr === null || cleanStr === void 0 ? void 0 : cleanStr.map((word) => word.charAt(0)).join('').substring(0, 3);
+        return acronym;
+    };
+    const textOverflowStyles = {
+        overflow: "hidden",
+        textOverflow: "ellipsis",
+        display: "-webkit-box",
+        WebkitBoxOrient: "vertical",
+        WebkitLineClamp: 1
+    };
+    const SquareAvatarComponent = (React.createElement(Avatar, { sx: {
+            backgroundColor: disabled ? 'var(--grey)' : 'var(--black)',
+            marginRight: '8px',
+            width: `${avatarWidth}`,
+            height: `${avatarHeight}`
+        }, variant: "rounded" },
+        React.createElement(Typography, { sx: { textTransform: 'uppercase' }, size: avatarFontSize, category: avatarFontCategory }, disabled ? '—' : getAcronym(name))));
+    return (avatarOnly ? (SquareAvatarComponent) : (React.createElement(Box, { display: "flex", alignItems: "center" },
+        SquareAvatarComponent,
+        React.createElement(Box, null,
+            href ? (React.createElement(Link, { href: href, sx: { textDecoration: 'none' } },
+                React.createElement(Typography, { category: fontCategory, size: fontSize, maxWidth: maxLinkWidth, sx: Object.assign({}, textOverflowStyles) }, name))) : (React.createElement(Typography, { category: fontCategory, size: fontSize, maxWidth: maxLinkWidth, sx: Object.assign(Object.assign({}, textOverflowStyles), { color: disabled ? 'grey' : 'black' }) }, name)),
+            subtitle && (React.createElement(Typography, { category: "secondary", size: "small-book", sx: Object.assign(Object.assign({}, textOverflowStyles), { color: 'black' }) }, subtitle))))));
+}
 //# sourceMappingURL=SquareAvatarWithName.js.map

package/dist/stories/molecules/SquareAvatarWithName/SquareAvatarWithName.js.map

@@ -1 +1 @@
-{"version":3,"file":"SquareAvatarWithName.js","sourceRoot":"","sources":["../../../../src/stories/molecules/SquareAvatarWithName/SquareAvatarWithName.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,MAAM,MAAM,sBAAsB,CAAC;AAC1C,OAAO,GAAG,MAAM,mBAAmB,CAAC;AACpC,OAAO,IAAI,MAAM,oBAAoB,CAAC;AAEtC,OAAO,UAAU,MAAM,mCAAmC,CAAC;AAiB3D,MAAM,CAAC,OAAO,UAAU,oBAAoB,CAAC,EAC3C,UAAU,GAAG,KAAK,EAAE,IAAI,GAAG,EAAE,EAAE,cAAc,GAAG,cAAc,EAAE,IAAI,GAAG,EAAE,EACzE,kBAAkB,GAAG,SAAS,EAAE,WAAW,GAAG,MAAM,EAAE,YAAY,GAAG,MAAM,EAC3E,QAAQ,GAAG,aAAa,EAAE,YAAY,GAAG,WAAW,EAAE,QAAQ,GAAG,KAAK,EAAE,YAAY,GAAG,MAAM,EAAE,QAAQ,GAAG,EAAE,EAC7G;IACC,MAAM,UAAU,GAAG,CAAC,GAAW,EAAE,EAAE;QACjC,MAAM,QAAQ,GAAG,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,OAAO,CAAC,cAAc,EAAE,EAAE,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,6CAA6C;QAC3G,MAAM,OAAO,GAAG,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,EAAE,EAAE,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QACjF,OAAO,OAAO,CAAC;IACjB,CAAC,CAAC;IAEF,MAAM,qBAAqB,GAAG,CAC1B,oBAAC,MAAM,IACH,EAAE,EAAE;YACF,eAAe,EAAE,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,cAAc;YAC1D,WAAW,EAAE,KAAK;YAClB,KAAK,EAAE,GAAG,WAAW,EAAE;YACvB,MAAM,EAAE,GAAG,YAAY,EAAE;SAC1B,EACD,OAAO,EAAC,SAAS;QAEjB,oBAAC,UAAU,IACP,EAAE,EAAE,EAAE,aAAa,EAAE,WAAW,EAAE,EAClC,IAAI,EAAE,cAAc,EACpB,QAAQ,EAAE,kBAAkB,IAE3B,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,CACzB,CACR,CACZ,CAAC;IAEF,OAAO,CACL,UAAU,CAAC,CAAC,CAAC,CACX,qBAAqB,CACtB,CAAC,CAAC,CAAC,CACA,oBAAC,GAAG,IAAC,OAAO,EAAC,MAAM,EAAC,UAAU,EAAC,QAAQ;QAClC,qBAAqB;QACtB,oBAAC,GAAG;YACC,IAAI,CAAC,CAAC,CAAC,CACJ,oBAAC,IAAI,IAAC,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,EAAE,cAAc,EAAE,MAAM,EAAE;gBAC5C,oBAAC,UAAU,IACP,QAAQ,EAAE,YAAY,EACtB,IAAI,EAAE,QAAQ,EACd,QAAQ,EAAE,YAAY,EACtB,EAAE,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,YAAY,EAAE,UAAU,EAAE,IAEzE,IAAI,CACI,CACV,CACV,CAAC,CAAC,CAAC,CACA,oBAAC,UAAU,IACP,QAAQ,EAAE,YAAY,EACtB,IAAI,EAAE,QAAQ,EACd,EAAE,EAAE;oBACF,UAAU,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,YAAY,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;iBACvG,IAEA,IAAI,CACI,CAChB;YACA,QAAQ,IAAI,CACb,oBAAC,UAAU,IACP,QAAQ,EAAC,WAAW,EACpB,IAAI,EAAC,YAAY,EACjB,EAAE,EAAE;oBACF,UAAU,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,YAAY,EAAE,UAAU,EAAE,KAAK,EAAE,OAAO;iBACnF,IAEA,QAAQ,CACA,CACZ,CACC,CACJ,CACT,CACF,CAAC;AACJ,CAAC"}
+{"version":3,"file":"SquareAvatarWithName.js","sourceRoot":"","sources":["../../../../src/stories/molecules/SquareAvatarWithName/SquareAvatarWithName.tsx"],"names":[],"mappings":"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"}

package/dist/stories/molecules/SquareAvatarWithName/SquareAvatarWithName.stories.d.ts

@@ -1,16 +1,16 @@
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const Default: any;
-export declare const WithCustomTypography: any;
-export declare const WithCustomAvatarSize: any;
-export declare const WithAvatarOnly: any;
-export declare const WithLink: any;
-export declare const WithSubtitle: any;
-export declare const WithLowercaseName: any;
-export declare const WithLongName: any;
-export declare const WithMultipleNames: any;
-export declare const WithMultipleNamesAndCharTypes: any;
-export declare const WithLongLinkName: any;
-export declare const Disabled: any;
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const Default: any;
+export declare const WithCustomTypography: any;
+export declare const WithCustomAvatarSize: any;
+export declare const WithAvatarOnly: any;
+export declare const WithLink: any;
+export declare const WithSubtitle: any;
+export declare const WithLowercaseName: any;
+export declare const WithLongName: any;
+export declare const WithMultipleNames: any;
+export declare const WithMultipleNamesAndCharTypes: any;
+export declare const WithLongLinkName: any;
+export declare const Disabled: any;

package/dist/stories/molecules/SquareAvatarWithName/SquareAvatarWithName.stories.js

@@ -1,82 +1,82 @@
-import React from 'react';
-import Box from '@mui/material/Box';
-import SquareAvatarWithName from './SquareAvatarWithName';
-// Default
-export default {
-    title: 'Molecules/SquareAvatarWithName',
-};
-// Templates
-function SquareAvatarWithNameTemplate(args) {
-    return React.createElement(SquareAvatarWithName, Object.assign({}, args));
-}
-function SquareAvatarWithLongNameTemplate(args) {
-    return React.createElement(Box, { width: "200px" },
-        React.createElement(SquareAvatarWithName, Object.assign({}, args)));
-}
-// Stories
-export const Default = SquareAvatarWithNameTemplate.bind({});
-Default.args = {
-    name: "Team Dream",
-};
-export const WithCustomTypography = SquareAvatarWithNameTemplate.bind({});
-WithCustomTypography.args = {
-    name: "Team Dream",
-    avatarFontCategory: "secondary",
-    avatarFontSize: "small-book",
-    fontCategory: "primary",
-    fontSize: "medium-book"
-};
-export const WithCustomAvatarSize = SquareAvatarWithNameTemplate.bind({});
-WithCustomAvatarSize.args = {
-    name: "Team Dream",
-    avatarWidth: '40px',
-    avatarHeight: '40px',
-    avatarFontCategory: "primary",
-    avatarFontSize: "small-book",
-};
-export const WithAvatarOnly = SquareAvatarWithNameTemplate.bind({});
-WithAvatarOnly.args = {
-    avatarOnly: true,
-    name: "Team Dream",
-};
-export const WithLink = SquareAvatarWithNameTemplate.bind({});
-WithLink.args = {
-    href: "https://www.reddit.com",
-    name: "Team Dream",
-};
-export const WithSubtitle = SquareAvatarWithNameTemplate.bind({});
-WithSubtitle.args = {
-    avatarWidth: '40px',
-    avatarHeight: '40px',
-    avatarFontSize: "medium-medium",
-    name: "Team Dream",
-    subtitle: '3 players'
-};
-export const WithLowercaseName = SquareAvatarWithNameTemplate.bind({});
-WithLowercaseName.args = {
-    name: "team dream",
-};
-export const WithLongName = SquareAvatarWithLongNameTemplate.bind({});
-WithLongName.args = {
-    name: "Team Dreamadeamadeamadeamadeam",
-};
-export const WithMultipleNames = SquareAvatarWithNameTemplate.bind({});
-WithMultipleNames.args = {
-    name: "Team Dream Nightmare And Everything In Between",
-};
-export const WithMultipleNamesAndCharTypes = SquareAvatarWithNameTemplate.bind({});
-WithMultipleNamesAndCharTypes.args = {
-    name: "Team - Dream * Nightmare And Everything In Between",
-};
-export const WithLongLinkName = SquareAvatarWithLongNameTemplate.bind({});
-WithLongLinkName.args = {
-    name: "Team Dreamadeamadeamadeamadeam",
-    href: "https://www.reddit.com",
-    maxLinkWidth: "200px"
-};
-export const Disabled = SquareAvatarWithNameTemplate.bind({});
-Disabled.args = {
-    name: "Bye",
-    disabled: true,
-};
+import React from 'react';
+import Box from '@mui/material/Box';
+import SquareAvatarWithName from './SquareAvatarWithName';
+// Default
+export default {
+    title: 'Molecules/SquareAvatarWithName',
+};
+// Templates
+function SquareAvatarWithNameTemplate(args) {
+    return React.createElement(SquareAvatarWithName, Object.assign({}, args));
+}
+function SquareAvatarWithLongNameTemplate(args) {
+    return React.createElement(Box, { width: "200px" },
+        React.createElement(SquareAvatarWithName, Object.assign({}, args)));
+}
+// Stories
+export const Default = SquareAvatarWithNameTemplate.bind({});
+Default.args = {
+    name: "Team Dream",
+};
+export const WithCustomTypography = SquareAvatarWithNameTemplate.bind({});
+WithCustomTypography.args = {
+    name: "Team Dream",
+    avatarFontCategory: "secondary",
+    avatarFontSize: "small-book",
+    fontCategory: "primary",
+    fontSize: "medium-book"
+};
+export const WithCustomAvatarSize = SquareAvatarWithNameTemplate.bind({});
+WithCustomAvatarSize.args = {
+    name: "Team Dream",
+    avatarWidth: '40px',
+    avatarHeight: '40px',
+    avatarFontCategory: "primary",
+    avatarFontSize: "small-book",
+};
+export const WithAvatarOnly = SquareAvatarWithNameTemplate.bind({});
+WithAvatarOnly.args = {
+    avatarOnly: true,
+    name: "Team Dream",
+};
+export const WithLink = SquareAvatarWithNameTemplate.bind({});
+WithLink.args = {
+    href: "https://www.reddit.com",
+    name: "Team Dream",
+};
+export const WithSubtitle = SquareAvatarWithNameTemplate.bind({});
+WithSubtitle.args = {
+    avatarWidth: '40px',
+    avatarHeight: '40px',
+    avatarFontSize: "medium-medium",
+    name: "Team Dream",
+    subtitle: '3 players'
+};
+export const WithLowercaseName = SquareAvatarWithNameTemplate.bind({});
+WithLowercaseName.args = {
+    name: "team dream",
+};
+export const WithLongName = SquareAvatarWithLongNameTemplate.bind({});
+WithLongName.args = {
+    name: "Team Dreamadeamadeamadeamadeam",
+};
+export const WithMultipleNames = SquareAvatarWithNameTemplate.bind({});
+WithMultipleNames.args = {
+    name: "Team Dream Nightmare And Everything In Between",
+};
+export const WithMultipleNamesAndCharTypes = SquareAvatarWithNameTemplate.bind({});
+WithMultipleNamesAndCharTypes.args = {
+    name: "Team - Dream * Nightmare And Everything In Between",
+};
+export const WithLongLinkName = SquareAvatarWithLongNameTemplate.bind({});
+WithLongLinkName.args = {
+    name: "Team Dreamadeamadeamadeamadeam",
+    href: "https://www.reddit.com",
+    maxLinkWidth: "200px"
+};
+export const Disabled = SquareAvatarWithNameTemplate.bind({});
+Disabled.args = {
+    name: "Bye",
+    disabled: true,
+};
 //# sourceMappingURL=SquareAvatarWithName.stories.js.map

package/dist/stories/organisms/Footer/Footer.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
-import { FooterProps } from './sharedTypes';
-declare function Footer({ exploreItems, eventItems, providerItems, moreItems, supportItems, onSocialMediaClick, }: FooterProps): JSX.Element;
-export default Footer;
+/// <reference types="react" />
+import { FooterProps } from './sharedTypes';
+declare function Footer({ exploreItems, eventItems, providerItems, moreItems, supportItems, onSocialMediaClick, }: FooterProps): JSX.Element;
+export default Footer;

package/dist/stories/organisms/Footer/Footer.js

@@ -1,62 +1,62 @@
-import React from 'react';
-import Box from '@mui/material/Box';
-import Grid from '@mui/material/Grid';
-import IconButton from '@mui/material/IconButton';
-import useMediaQuery from '@mui/material/useMediaQuery';
-import { SocialMediaIds } from '../../utils/constants';
-import FooterSection from '../../molecules/FooterSection/FooterSection';
-import SocialMediaInstagramIcon from '../../atoms/Icons/SocialMediaInstagramIcon';
-import SocialMediaTikTokIcon from '../../atoms/Icons/SocialMediaTikTokIcon';
-import SocialMediaXIcon from '../../atoms/Icons/SocialMediaXIcon';
-import SocialMediaYoutubeIcon from '../../atoms/Icons/SocialMediaYoutubeIcon';
-import SocialMediaFacebookIcon from '../../atoms/Icons/SocialMediaFacebookIcon';
-import Typography from '../../atoms/Typography/Typography';
-import utrLogo from '../../assets/utr-sports-logo.svg';
-function Footer({ exploreItems, eventItems, providerItems, moreItems, supportItems, onSocialMediaClick, }) {
-    const matches = useMediaQuery('(min-width:600px)');
-    const { X, FACEBOOK, INSTAGRAM, TIKTOK, YOUTUBE } = SocialMediaIds;
-    const handleOnSocialMediaClick = (id) => {
-        onSocialMediaClick(id);
-    };
-    return (React.createElement(Box, { sx: { backgroundColor: 'var(--black)' } },
-        React.createElement(Grid, { p: 1.5, container: true, justifyContent: "space-evenly", display: matches ? 'row' : 'column' },
-            React.createElement(Grid, { item: true, xs: 12, lg: 2 },
-                React.createElement(Box, { mb: 2, display: "flex", alignItems: "center", flexDirection: "column" },
-                    React.createElement("img", { alt: "UTR Sports logo", width: "205", height: "51", src: utrLogo }),
-                    React.createElement(Box, { display: "flex", mt: 1 },
-                        React.createElement(IconButton, { sx: { p: 0.5 }, onClick: () => handleOnSocialMediaClick(X) },
-                            React.createElement(SocialMediaXIcon, { size: 27, color: "var(--white)" })),
-                        React.createElement(IconButton, { sx: { p: 0.5 }, onClick: () => handleOnSocialMediaClick(FACEBOOK) },
-                            React.createElement(SocialMediaFacebookIcon, { size: 27, color: "var(--white)" })),
-                        React.createElement(IconButton, { sx: { p: 0.5 }, onClick: () => handleOnSocialMediaClick(INSTAGRAM) },
-                            React.createElement(SocialMediaInstagramIcon, { size: 27, color: "var(--white)" })),
-                        React.createElement(IconButton, { sx: { p: 0.5 }, onClick: () => handleOnSocialMediaClick(TIKTOK) },
-                            React.createElement(SocialMediaTikTokIcon, { size: 27, color: "var(--white)" })),
-                        React.createElement(IconButton, { sx: { p: 0.5 }, onClick: () => handleOnSocialMediaClick(YOUTUBE) },
-                            React.createElement(SocialMediaYoutubeIcon, { size: 27, color: "var(--white)" }))))),
-            matches ? (React.createElement(Grid, { container: true, item: true, lg: 10, justifyContent: "space-evenly" },
-                React.createElement(Grid, { item: true },
-                    React.createElement(FooterSection, { title: "Explore", items: exploreItems })),
-                React.createElement(Grid, { item: true },
-                    React.createElement(FooterSection, { title: "Events", items: eventItems })),
-                React.createElement(Grid, { item: true },
-                    React.createElement(FooterSection, { title: "Providers", items: providerItems })),
-                React.createElement(Grid, { item: true },
-                    React.createElement(FooterSection, { title: "More", items: moreItems })),
-                React.createElement(Grid, { item: true },
-                    React.createElement(FooterSection, { title: "Support", items: supportItems })))) : (React.createElement(Grid, { container: true, display: "column", justifyContent: "space-evenly" },
-                React.createElement(Grid, { item: true },
-                    React.createElement(Box, { mb: 2 },
-                        React.createElement(FooterSection, { title: "Explore", items: exploreItems })),
-                    React.createElement(Box, { mb: 3.3 },
-                        React.createElement(FooterSection, { title: "Providers", items: providerItems })),
-                    React.createElement(FooterSection, { title: "Support", items: supportItems })),
-                React.createElement(Grid, { item: true },
-                    React.createElement(Box, { mb: 2 },
-                        React.createElement(FooterSection, { title: "Events", items: eventItems })),
-                    React.createElement(FooterSection, { title: "More", items: moreItems }))))),
-        React.createElement(Box, { display: "absolute", sx: { bottom: 24, borderTop: 1, borderColor: "var(--white)" } },
-            React.createElement(Typography, { p: 0.5, category: "secondary", size: "x-small-book-cap", color: "var(--white)", align: "center" }, `\u00A9 2024, UTR SPORTS`))));
-}
-export default Footer;
+import React from 'react';
+import Box from '@mui/material/Box';
+import Grid from '@mui/material/Grid';
+import IconButton from '@mui/material/IconButton';
+import useMediaQuery from '@mui/material/useMediaQuery';
+import { SocialMediaIds } from '../../utils/constants';
+import FooterSection from '../../molecules/FooterSection/FooterSection';
+import SocialMediaInstagramIcon from '../../atoms/Icons/SocialMediaInstagramIcon';
+import SocialMediaTikTokIcon from '../../atoms/Icons/SocialMediaTikTokIcon';
+import SocialMediaXIcon from '../../atoms/Icons/SocialMediaXIcon';
+import SocialMediaYoutubeIcon from '../../atoms/Icons/SocialMediaYoutubeIcon';
+import SocialMediaFacebookIcon from '../../atoms/Icons/SocialMediaFacebookIcon';
+import Typography from '../../atoms/Typography/Typography';
+import utrLogo from '../../assets/utr-sports-logo.svg';
+function Footer({ exploreItems, eventItems, providerItems, moreItems, supportItems, onSocialMediaClick, }) {
+    const matches = useMediaQuery('(min-width:600px)');
+    const { X, FACEBOOK, INSTAGRAM, TIKTOK, YOUTUBE } = SocialMediaIds;
+    const handleOnSocialMediaClick = (id) => {
+        onSocialMediaClick(id);
+    };
+    return (React.createElement(Box, { sx: { backgroundColor: 'var(--black)' } },
+        React.createElement(Grid, { p: 1.5, container: true, justifyContent: "space-evenly", display: matches ? 'row' : 'column' },
+            React.createElement(Grid, { item: true, xs: 12, lg: 2 },
+                React.createElement(Box, { mb: 2, display: "flex", alignItems: "center", flexDirection: "column" },
+                    React.createElement("img", { alt: "UTR Sports logo", width: "205", height: "51", src: utrLogo }),
+                    React.createElement(Box, { display: "flex", mt: 1 },
+                        React.createElement(IconButton, { sx: { p: 0.5 }, onClick: () => handleOnSocialMediaClick(X) },
+                            React.createElement(SocialMediaXIcon, { size: 27, color: "var(--white)" })),
+                        React.createElement(IconButton, { sx: { p: 0.5 }, onClick: () => handleOnSocialMediaClick(FACEBOOK) },
+                            React.createElement(SocialMediaFacebookIcon, { size: 27, color: "var(--white)" })),
+                        React.createElement(IconButton, { sx: { p: 0.5 }, onClick: () => handleOnSocialMediaClick(INSTAGRAM) },
+                            React.createElement(SocialMediaInstagramIcon, { size: 27, color: "var(--white)" })),
+                        React.createElement(IconButton, { sx: { p: 0.5 }, onClick: () => handleOnSocialMediaClick(TIKTOK) },
+                            React.createElement(SocialMediaTikTokIcon, { size: 27, color: "var(--white)" })),
+                        React.createElement(IconButton, { sx: { p: 0.5 }, onClick: () => handleOnSocialMediaClick(YOUTUBE) },
+                            React.createElement(SocialMediaYoutubeIcon, { size: 27, color: "var(--white)" }))))),
+            matches ? (React.createElement(Grid, { container: true, item: true, lg: 10, justifyContent: "space-evenly" },
+                React.createElement(Grid, { item: true },
+                    React.createElement(FooterSection, { title: "Explore", items: exploreItems })),
+                React.createElement(Grid, { item: true },
+                    React.createElement(FooterSection, { title: "Events", items: eventItems })),
+                React.createElement(Grid, { item: true },
+                    React.createElement(FooterSection, { title: "Providers", items: providerItems })),
+                React.createElement(Grid, { item: true },
+                    React.createElement(FooterSection, { title: "More", items: moreItems })),
+                React.createElement(Grid, { item: true },
+                    React.createElement(FooterSection, { title: "Support", items: supportItems })))) : (React.createElement(Grid, { container: true, display: "column", justifyContent: "space-evenly" },
+                React.createElement(Grid, { item: true },
+                    React.createElement(Box, { mb: 2 },
+                        React.createElement(FooterSection, { title: "Explore", items: exploreItems })),
+                    React.createElement(Box, { mb: 3.3 },
+                        React.createElement(FooterSection, { title: "Providers", items: providerItems })),
+                    React.createElement(FooterSection, { title: "Support", items: supportItems })),
+                React.createElement(Grid, { item: true },
+                    React.createElement(Box, { mb: 2 },
+                        React.createElement(FooterSection, { title: "Events", items: eventItems })),
+                    React.createElement(FooterSection, { title: "More", items: moreItems }))))),
+        React.createElement(Box, { display: "absolute", sx: { bottom: 24, borderTop: 1, borderColor: "var(--white)" } },
+            React.createElement(Typography, { p: 0.5, category: "secondary", size: "x-small-book-cap", color: "var(--white)", align: "center" }, `\u00A9 2024, UTR SPORTS`))));
+}
+export default Footer;
 //# sourceMappingURL=Footer.js.map

package/dist/stories/organisms/Footer/Footer.stories.d.ts

@@ -1,5 +1,5 @@
-declare const _default: {
-    title: string;
-};
-export default _default;
-export declare const BottomFooter: any;
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const BottomFooter: any;