From d10fc5ed74a1d9e57b7e34370831db618538d14e Mon Sep 17 00:00:00 2001 From: Anton Gunnarsson Date: Wed, 13 Aug 2025 14:52:56 +0000 Subject: [PATCH] Merged in feat/sw-3247-move-table-to-design-system (pull request #2636) feat(SW-3247): Move Table component to design-system * Move Table component to design-system Approved-by: Bianca Widstam --- .../JourneyTable/ClientTable/Row/index.tsx | 2 +- .../JourneyTable/ClientTable/index.tsx | 3 +-- .../ExpiringPoints/ExpiringPointsTable/index.tsx | 2 +- .../components/Blocks/Table/index.tsx | 3 ++- .../HotelSubpage/HtmlContent/index.tsx | 3 +-- .../DeprecatedJsonToHtml/renderOptions.tsx | 2 +- .../components/JsonToHtml/renderOptions.tsx | 2 +- .../components/TempDesignSystem/Table/TH.tsx | 13 ------------- .../lib/components}/Table/TBody.tsx | 2 +- .../design-system/lib/components}/Table/TD.tsx | 2 +- .../design-system/lib/components/Table/TH.tsx | 13 +++++++++++++ .../lib/components}/Table/THead.tsx | 2 +- .../design-system/lib/components}/Table/TR.tsx | 2 +- .../lib/components}/Table/index.tsx | 16 ++++++++-------- .../lib/components}/Table/table.module.css | 0 .../design-system/lib/components}/Table/table.ts | 4 ++-- .../lib/components}/Table/variants.ts | 8 ++++---- packages/design-system/package.json | 1 + 18 files changed, 40 insertions(+), 40 deletions(-) delete mode 100644 apps/scandic-web/components/TempDesignSystem/Table/TH.tsx rename {apps/scandic-web/components/TempDesignSystem => packages/design-system/lib/components}/Table/TBody.tsx (77%) rename {apps/scandic-web/components/TempDesignSystem => packages/design-system/lib/components}/Table/TD.tsx (84%) create mode 100644 packages/design-system/lib/components/Table/TH.tsx rename {apps/scandic-web/components/TempDesignSystem => packages/design-system/lib/components}/Table/THead.tsx (77%) rename {apps/scandic-web/components/TempDesignSystem => packages/design-system/lib/components}/Table/TR.tsx (84%) rename {apps/scandic-web/components/TempDesignSystem => packages/design-system/lib/components}/Table/index.tsx (66%) rename {apps/scandic-web/components/TempDesignSystem => packages/design-system/lib/components}/Table/table.module.css (100%) rename {apps/scandic-web/components/TempDesignSystem => packages/design-system/lib/components}/Table/table.ts (72%) rename {apps/scandic-web/components/TempDesignSystem => packages/design-system/lib/components}/Table/variants.ts (75%) diff --git a/apps/scandic-web/components/Blocks/DynamicContent/Points/EarnAndBurn/JourneyTable/ClientTable/Row/index.tsx b/apps/scandic-web/components/Blocks/DynamicContent/Points/EarnAndBurn/JourneyTable/ClientTable/Row/index.tsx index f3a17204d..28b436ca3 100644 --- a/apps/scandic-web/components/Blocks/DynamicContent/Points/EarnAndBurn/JourneyTable/ClientTable/Row/index.tsx +++ b/apps/scandic-web/components/Blocks/DynamicContent/Points/EarnAndBurn/JourneyTable/ClientTable/Row/index.tsx @@ -5,12 +5,12 @@ import { useIntl } from "react-intl" import { dt } from "@scandic-hotels/common/dt" import Link from "@scandic-hotels/design-system/Link" +import Table from "@scandic-hotels/design-system/Table" import { Typography } from "@scandic-hotels/design-system/Typography" import { Transactions } from "@scandic-hotels/trpc/enums/transactions" import { webviews } from "@/constants/routes/webviews" -import Table from "@/components/TempDesignSystem/Table" import useLang from "@/hooks/useLang" import AwardPoints from "../../../AwardPoints" diff --git a/apps/scandic-web/components/Blocks/DynamicContent/Points/EarnAndBurn/JourneyTable/ClientTable/index.tsx b/apps/scandic-web/components/Blocks/DynamicContent/Points/EarnAndBurn/JourneyTable/ClientTable/index.tsx index 093541902..6eed23c73 100644 --- a/apps/scandic-web/components/Blocks/DynamicContent/Points/EarnAndBurn/JourneyTable/ClientTable/index.tsx +++ b/apps/scandic-web/components/Blocks/DynamicContent/Points/EarnAndBurn/JourneyTable/ClientTable/index.tsx @@ -2,10 +2,9 @@ import { useIntl } from "react-intl" +import Table from "@scandic-hotels/design-system/Table" import { Typography } from "@scandic-hotels/design-system/Typography" -import Table from "@/components/TempDesignSystem/Table" - import Row from "./Row" import styles from "./clientTable.module.css" diff --git a/apps/scandic-web/components/Blocks/DynamicContent/Points/ExpiringPoints/ExpiringPointsTable/index.tsx b/apps/scandic-web/components/Blocks/DynamicContent/Points/ExpiringPoints/ExpiringPointsTable/index.tsx index a30d2a5aa..6cdadd344 100644 --- a/apps/scandic-web/components/Blocks/DynamicContent/Points/ExpiringPoints/ExpiringPointsTable/index.tsx +++ b/apps/scandic-web/components/Blocks/DynamicContent/Points/ExpiringPoints/ExpiringPointsTable/index.tsx @@ -3,9 +3,9 @@ import { useIntl } from "react-intl" import { dt } from "@scandic-hotels/common/dt" +import Table from "@scandic-hotels/design-system/Table" import { Typography } from "@scandic-hotels/design-system/Typography" -import Table from "@/components/TempDesignSystem/Table" import useLang from "@/hooks/useLang" import AwardPoints from "../../EarnAndBurn/AwardPoints" diff --git a/apps/scandic-web/components/Blocks/Table/index.tsx b/apps/scandic-web/components/Blocks/Table/index.tsx index 378422fe7..e124b28c5 100644 --- a/apps/scandic-web/components/Blocks/Table/index.tsx +++ b/apps/scandic-web/components/Blocks/Table/index.tsx @@ -8,11 +8,12 @@ import { } from "@tanstack/react-table" import { useState } from "react" +import Table from "@scandic-hotels/design-system/Table" + import SectionContainer from "@/components/Section/Container" import SectionHeader from "@/components/Section/Header" import ScrollWrapper from "@/components/TempDesignSystem/ScrollWrapper" import ShowMoreButton from "@/components/TempDesignSystem/ShowMoreButton" -import Table from "@/components/TempDesignSystem/Table" import styles from "./table.module.css" diff --git a/apps/scandic-web/components/ContentType/HotelSubpage/HtmlContent/index.tsx b/apps/scandic-web/components/ContentType/HotelSubpage/HtmlContent/index.tsx index 9337d2c3c..19bdc50ab 100644 --- a/apps/scandic-web/components/ContentType/HotelSubpage/HtmlContent/index.tsx +++ b/apps/scandic-web/components/ContentType/HotelSubpage/HtmlContent/index.tsx @@ -2,10 +2,9 @@ import { ElementType } from "domelementtype" import parse, { type DOMNode, Element, type Text } from "html-react-parser" import Link from "@scandic-hotels/design-system/Link" +import Table from "@scandic-hotels/design-system/Table" import { Typography } from "@scandic-hotels/design-system/Typography" -import Table from "@/components/TempDesignSystem/Table" - import { NodeNames } from "./utils" import styles from "./htmlContent.module.css" diff --git a/apps/scandic-web/components/DeprecatedJsonToHtml/renderOptions.tsx b/apps/scandic-web/components/DeprecatedJsonToHtml/renderOptions.tsx index 6fda55627..58f70599b 100644 --- a/apps/scandic-web/components/DeprecatedJsonToHtml/renderOptions.tsx +++ b/apps/scandic-web/components/DeprecatedJsonToHtml/renderOptions.tsx @@ -7,6 +7,7 @@ import Image from "@scandic-hotels/design-system/Image" import ImageContainer from "@scandic-hotels/design-system/ImageContainer" import Link from "@scandic-hotels/design-system/Link" import Subtitle from "@scandic-hotels/design-system/Subtitle" +import Table from "@scandic-hotels/design-system/Table" import Title from "@scandic-hotels/design-system/Title" import { AvailableParagraphFormatEnum, @@ -15,7 +16,6 @@ import { } from "@scandic-hotels/trpc/types/RTEenums" import { insertResponseToImageVaultAsset } from "@scandic-hotels/trpc/utils/imageVault" -import Table from "../TempDesignSystem/Table" import BiroScript from "../TempDesignSystem/Text/BiroScript" import { hasAvailableParagraphFormat, hasAvailableULFormat } from "./utils" diff --git a/apps/scandic-web/components/JsonToHtml/renderOptions.tsx b/apps/scandic-web/components/JsonToHtml/renderOptions.tsx index 072506555..229fa4485 100644 --- a/apps/scandic-web/components/JsonToHtml/renderOptions.tsx +++ b/apps/scandic-web/components/JsonToHtml/renderOptions.tsx @@ -5,11 +5,11 @@ import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon" import Image from "@scandic-hotels/design-system/Image" import ImageContainer from "@scandic-hotels/design-system/ImageContainer" import Link from "@scandic-hotels/design-system/Link" +import Table from "@scandic-hotels/design-system/Table" import { Typography } from "@scandic-hotels/design-system/Typography" import { ContentEnum } from "@scandic-hotels/trpc/types/content" import { insertResponseToImageVaultAsset } from "@scandic-hotels/trpc/utils/imageVault" -import Table from "../TempDesignSystem/Table" import { hasAvailableParagraphFormat, hasAvailableULFormat, diff --git a/apps/scandic-web/components/TempDesignSystem/Table/TH.tsx b/apps/scandic-web/components/TempDesignSystem/Table/TH.tsx deleted file mode 100644 index 657dc2b1d..000000000 --- a/apps/scandic-web/components/TempDesignSystem/Table/TH.tsx +++ /dev/null @@ -1,13 +0,0 @@ -import styles from "./table.module.css" - -import type { THeadProps } from "./table" - -function TH({ children, width = "auto", ...props }: THeadProps) { - return ( - - {children} - - ) -} - -export default TH diff --git a/apps/scandic-web/components/TempDesignSystem/Table/TBody.tsx b/packages/design-system/lib/components/Table/TBody.tsx similarity index 77% rename from apps/scandic-web/components/TempDesignSystem/Table/TBody.tsx rename to packages/design-system/lib/components/Table/TBody.tsx index 3d6a45dcc..8ef45b527 100644 --- a/apps/scandic-web/components/TempDesignSystem/Table/TBody.tsx +++ b/packages/design-system/lib/components/Table/TBody.tsx @@ -1,4 +1,4 @@ -import styles from "./table.module.css" +import styles from './table.module.css' function TBody({ children }: React.PropsWithChildren) { return {children} diff --git a/apps/scandic-web/components/TempDesignSystem/Table/TD.tsx b/packages/design-system/lib/components/Table/TD.tsx similarity index 84% rename from apps/scandic-web/components/TempDesignSystem/Table/TD.tsx rename to packages/design-system/lib/components/Table/TD.tsx index 210437ecf..7ac669188 100644 --- a/apps/scandic-web/components/TempDesignSystem/Table/TD.tsx +++ b/packages/design-system/lib/components/Table/TD.tsx @@ -1,4 +1,4 @@ -import styles from "./table.module.css" +import styles from './table.module.css' function TD({ children, diff --git a/packages/design-system/lib/components/Table/TH.tsx b/packages/design-system/lib/components/Table/TH.tsx new file mode 100644 index 000000000..01c9835bb --- /dev/null +++ b/packages/design-system/lib/components/Table/TH.tsx @@ -0,0 +1,13 @@ +import styles from './table.module.css' + +import type { THeadProps } from './table' + +function TH({ children, width = 'auto', ...props }: THeadProps) { + return ( + + {children} + + ) +} + +export default TH diff --git a/apps/scandic-web/components/TempDesignSystem/Table/THead.tsx b/packages/design-system/lib/components/Table/THead.tsx similarity index 77% rename from apps/scandic-web/components/TempDesignSystem/Table/THead.tsx rename to packages/design-system/lib/components/Table/THead.tsx index f049c168e..b4d0e83e2 100644 --- a/apps/scandic-web/components/TempDesignSystem/Table/THead.tsx +++ b/packages/design-system/lib/components/Table/THead.tsx @@ -1,4 +1,4 @@ -import styles from "./table.module.css" +import styles from './table.module.css' function THead({ children }: React.PropsWithChildren) { return {children} diff --git a/apps/scandic-web/components/TempDesignSystem/Table/TR.tsx b/packages/design-system/lib/components/Table/TR.tsx similarity index 84% rename from apps/scandic-web/components/TempDesignSystem/Table/TR.tsx rename to packages/design-system/lib/components/Table/TR.tsx index d6b12ded8..0c3a251d9 100644 --- a/apps/scandic-web/components/TempDesignSystem/Table/TR.tsx +++ b/packages/design-system/lib/components/Table/TR.tsx @@ -1,4 +1,4 @@ -import styles from "./table.module.css" +import styles from './table.module.css' function TR({ children, diff --git a/apps/scandic-web/components/TempDesignSystem/Table/index.tsx b/packages/design-system/lib/components/Table/index.tsx similarity index 66% rename from apps/scandic-web/components/TempDesignSystem/Table/index.tsx rename to packages/design-system/lib/components/Table/index.tsx index 87f50326a..70ebff58f 100644 --- a/apps/scandic-web/components/TempDesignSystem/Table/index.tsx +++ b/packages/design-system/lib/components/Table/index.tsx @@ -1,11 +1,11 @@ -import TBody from "./TBody" -import TD from "./TD" -import TH from "./TH" -import THead from "./THead" -import TR from "./TR" -import { tableVariants } from "./variants" +import TBody from './TBody' +import TD from './TD' +import TH from './TH' +import THead from './THead' +import TR from './TR' +import { tableVariants } from './variants' -import type { TableProps } from "./table" +import type { TableProps } from './table' function Table({ className, @@ -13,7 +13,7 @@ function Table({ borderRadius, variant, layout, - width = "100%", + width = '100%', children, ...props }: TableProps) { diff --git a/apps/scandic-web/components/TempDesignSystem/Table/table.module.css b/packages/design-system/lib/components/Table/table.module.css similarity index 100% rename from apps/scandic-web/components/TempDesignSystem/Table/table.module.css rename to packages/design-system/lib/components/Table/table.module.css diff --git a/apps/scandic-web/components/TempDesignSystem/Table/table.ts b/packages/design-system/lib/components/Table/table.ts similarity index 72% rename from apps/scandic-web/components/TempDesignSystem/Table/table.ts rename to packages/design-system/lib/components/Table/table.ts index a25c6b1f1..daddbf10d 100644 --- a/apps/scandic-web/components/TempDesignSystem/Table/table.ts +++ b/packages/design-system/lib/components/Table/table.ts @@ -1,6 +1,6 @@ -import type { VariantProps } from "class-variance-authority" +import type { VariantProps } from 'class-variance-authority' -import type { tableVariants } from "./variants" +import type { tableVariants } from './variants' export interface TableProps extends React.PropsWithChildren>, diff --git a/apps/scandic-web/components/TempDesignSystem/Table/variants.ts b/packages/design-system/lib/components/Table/variants.ts similarity index 75% rename from apps/scandic-web/components/TempDesignSystem/Table/variants.ts rename to packages/design-system/lib/components/Table/variants.ts index c70202dcf..6f983141a 100644 --- a/apps/scandic-web/components/TempDesignSystem/Table/variants.ts +++ b/packages/design-system/lib/components/Table/variants.ts @@ -1,6 +1,6 @@ -import { cva } from "class-variance-authority" +import { cva } from 'class-variance-authority' -import styles from "./table.module.css" +import styles from './table.module.css' export const tableVariants = cva(styles.table, { variants: { @@ -12,7 +12,7 @@ export const tableVariants = cva(styles.table, { content: styles.content, }, borderRadius: { - none: "", + none: '', small: styles.smallRadius, medium: styles.mediumRadius, large: styles.largeRadius, @@ -22,6 +22,6 @@ export const tableVariants = cva(styles.table, { }, }, defaultVariants: { - borderRadius: "medium", + borderRadius: 'medium', }, }) diff --git a/packages/design-system/package.json b/packages/design-system/package.json index 4cb402a4c..e89b6e458 100644 --- a/packages/design-system/package.json +++ b/packages/design-system/package.json @@ -41,6 +41,7 @@ "./SidePeek/SidePeekProvider": "./lib/components/SidePeek/SidePeekContext/SidePeekProvider.tsx", "./Subtitle": "./lib/components/Subtitle/index.tsx", "./Switch": "./lib/components/Switch/index.tsx", + "./Table": "./lib/components/Table/index.tsx", "./Title": "./lib/components/Title/index.tsx", "./Tooltip": "./lib/components/Tooltip/index.tsx", "./Typography": "./lib/components/Typography/index.tsx",