-
Notifications
You must be signed in to change notification settings - Fork 8.4k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'main' into fix/booking-order
- Loading branch information
Showing
20 changed files
with
325 additions
and
167 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,25 @@ | ||
"use client"; | ||
|
||
import { Icon } from "@calcom/ui"; | ||
import type { IconName } from "@calcom/ui"; | ||
|
||
export const IconGrid = (props: { | ||
title: string; | ||
icons: IconName[]; | ||
rootClassName?: string; | ||
iconClassName?: string; | ||
}) => ( | ||
<div className={props.rootClassName}> | ||
<h2 className="font-cal mt-6 text-lg font-medium">{props.title}</h2> | ||
<div className="grid grid-cols-2 lg:grid-cols-6"> | ||
{props.icons.map((icon) => { | ||
return ( | ||
<div key={icon} className="flex items-center gap-1"> | ||
<Icon name={icon} className={props.iconClassName} /> | ||
<div>{icon}</div> | ||
</div> | ||
); | ||
})} | ||
</div> | ||
</div> | ||
); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,46 @@ | ||
import { _generateMetadata, getTranslate } from "app/_utils"; | ||
import { Inter } from "next/font/google"; | ||
import localFont from "next/font/local"; | ||
|
||
import { type IconName, IconSprites } from "@calcom/ui"; | ||
|
||
import { lucideIconList } from "../../../../packages/ui/components/icon/icon-list.mjs"; | ||
import { IconGrid } from "./IconGrid"; | ||
|
||
const interFont = Inter({ subsets: ["latin"], variable: "--font-inter", preload: true, display: "swap" }); | ||
const calFont = localFont({ | ||
src: "../../fonts/CalSans-SemiBold.woff2", | ||
variable: "--font-cal", | ||
preload: true, | ||
display: "swap", | ||
weight: "600", | ||
}); | ||
export const generateMetadata = async () => { | ||
return await _generateMetadata( | ||
(t) => t("icon_showcase"), | ||
() => "" | ||
); | ||
}; | ||
export default async function IconsPage() { | ||
const icons = Array.from(lucideIconList).sort() as IconName[]; | ||
const t = await getTranslate(); | ||
|
||
return ( | ||
<div className={`${interFont.variable} ${calFont.variable}`}> | ||
<div className="bg-subtle flex h-screen"> | ||
<IconSprites /> | ||
<div className="bg-default m-auto min-w-full rounded-md p-10 text-right ltr:text-left"> | ||
<h1 className="text-emphasis font-cal text-2xl font-medium">{t("icons_showcase")}</h1> | ||
<IconGrid title="Regular Icons" icons={icons} /> | ||
<IconGrid | ||
title="Filled Icons" | ||
icons={icons} | ||
rootClassName="bg-darkgray-100 text-gray-50" | ||
iconClassName="fill-blue-500" | ||
/> | ||
</div> | ||
</div> | ||
</div> | ||
); | ||
} | ||
export const dynamic = "force-static"; |
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
export * from "./useDebouncedWidth"; | ||
export * from "./useFetchMoreOnBottomReached"; | ||
export * from "./useColumnSizingVars"; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,26 @@ | ||
import type { Table } from "@tanstack/react-table"; | ||
// eslint-disable-next-line no-restricted-imports | ||
import kebabCase from "lodash/kebabCase"; | ||
import { useMemo } from "react"; | ||
|
||
export const useColumnSizingVars = <TData>({ table }: { table: Table<TData> }) => { | ||
const headers = table.getFlatHeaders(); | ||
const columnSizingInfo = table.getState().columnSizingInfo; | ||
const columnSizing = table.getState().columnSizing; | ||
|
||
return useMemo(() => { | ||
const headers = table.getFlatHeaders(); | ||
const colSizes: { [key: string]: string } = {}; | ||
headers.forEach((header) => { | ||
const isAutoWidth = header.column.columnDef.meta?.autoWidth; | ||
colSizes[`--header-${kebabCase(header.id)}-size`] = isAutoWidth ? "auto" : `${header.getSize()}px`; | ||
colSizes[`--col-${kebabCase(header.column.id)}-size`] = isAutoWidth | ||
? "auto" | ||
: `${header.column.getSize()}px`; | ||
}); | ||
return colSizes; | ||
// `columnSizing` and `columnSizingInfo` are not used in the memo, | ||
// but they're included in the deps to ensure the memo is re-evaluated when they change. | ||
// eslint-disable-next-line react-hooks/exhaustive-deps | ||
}, [headers, columnSizingInfo, columnSizing]); | ||
}; |
Oops, something went wrong.