@snokam/ui 1.0.0

package/dist/components/table/index.js

@@ -0,0 +1,95 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styled from "@emotion/styled";
+import { DUR, EASE_SNAP, tokens, SPACE } from "@snokam/ui/tokens";
+export const TableWrap = styled.div `
+  overflow-x: auto;
+`;
+export const Table = styled.table `
+  width: 100%;
+  border-collapse: collapse;
+  font: 400 0.9rem/1.4 ${tokens.font};
+  color: var(--o-text);
+`;
+export const THead = styled.thead `
+  background: var(--o-table-head-bg);
+`;
+export const Th = styled.th `
+  text-align: left;
+  padding: ${SPACE.md} ${SPACE.lg};
+  font: 700 0.85rem/1.2 ${tokens.font};
+  color: var(--o-text);
+  white-space: nowrap;
+`;
+export const Tr = styled.tr `
+  transition: background ${DUR.micro} ${EASE_SNAP};
+
+  tbody &:not(:last-of-type) {
+    border-bottom: 1px solid var(--o-border);
+  }
+  tbody &:hover {
+    background: var(--o-table-hover);
+  }
+`;
+export const Td = styled.td `
+  padding: ${SPACE.md} ${SPACE.lg};
+  vertical-align: middle;
+  color: var(--o-text);
+`;
+export const TBody = styled.tbody ``;
+export function DataTable({ columns, rows, rowKey, onRowClick, }) {
+    const template = columns
+        .map((c) => c.width ?? "minmax(140px, 1fr)")
+        .join(" ");
+    return (_jsx(TableCard, { children: _jsxs(Scroll, { children: [_jsx(HeadRow, { "$template": template, children: columns.map((c) => (_jsx(HeadCell, { "$align": c.align ?? "start", children: c.header }, c.key))) }), rows.map((row) => (_jsx(BodyRow, { "$template": template, "$clickable": Boolean(onRowClick), onClick: onRowClick ? () => onRowClick(row) : undefined, children: columns.map((c) => (_jsx(BodyCell, { "$align": c.align ?? "start", children: c.render(row) }, c.key))) }, rowKey(row))))] }) }));
+}
+const TableCard = styled.div `
+  border: 1px solid var(--o-border);
+  border-radius: 12px;
+  background: var(--o-card-bg);
+  overflow: hidden;
+`;
+const Scroll = styled.div `
+  overflow-x: auto;
+`;
+const HeadRow = styled.div `
+  display: grid;
+  grid-template-columns: ${({ $template }) => $template};
+  gap: ${SPACE.lg};
+  padding: ${SPACE.md} ${SPACE.lg};
+  border-bottom: 1px solid var(--o-border);
+  min-width: min-content;
+`;
+const HeadCell = styled.span `
+  font: 600 0.72rem/1 ${tokens.font};
+  letter-spacing: 0.1em;
+  text-transform: uppercase;
+  color: var(--o-text-muted);
+  text-align: ${({ $align }) => ($align === "end" ? "right" : "left")};
+`;
+const BodyRow = styled.div `
+  display: grid;
+  grid-template-columns: ${({ $template }) => $template};
+  gap: ${SPACE.lg};
+  align-items: center;
+  padding: ${SPACE.md} ${SPACE.lg};
+  min-width: min-content;
+  cursor: ${({ $clickable }) => ($clickable ? "pointer" : "default")};
+  transition: background 120ms ease;
+
+  & + & {
+    border-top: 1px solid var(--o-border);
+  }
+
+  &:hover {
+    background: ${({ $clickable }) => $clickable ? "var(--o-hover-tint)" : "transparent"};
+  }
+`;
+const BodyCell = styled.div `
+  min-width: 0;
+  display: flex;
+  align-items: center;
+  justify-content: ${({ $align }) => $align === "end" ? "flex-end" : "flex-start"};
+  color: var(--o-text);
+`;
+//# sourceMappingURL=index.js.map

package/dist/components/table/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/table/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/tabs/index.d.ts

@@ -0,0 +1,4 @@
+import { TabsProps } from "@mui/material";
+export type { TabsProps };
+export declare const Tabs: (props: TabsProps) => import("react").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/tabs/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/tabs/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAmB,SAAS,EAAE,MAAM,eAAe,CAAC;AAE3D,YAAY,EAAE,SAAS,EAAE,CAAC;AAE1B,eAAO,MAAM,IAAI,GAAI,OAAO,SAAS,gCAA2B,CAAC"}

package/dist/components/tabs/index.js

@@ -0,0 +1,5 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Tabs as MuiTabs } from "@mui/material";
+export const Tabs = (props) => _jsx(MuiTabs, { ...props });
+//# sourceMappingURL=index.js.map

package/dist/components/tabs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/tabs/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,IAAI,IAAI,OAAO,EAAa,MAAM,eAAe,CAAC;AAI3D,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,KAAgB,EAAE,EAAE,CAAC,KAAC,OAAO,OAAK,KAAK,GAAI,CAAC"}

package/dist/components/text-field/index.d.ts

@@ -0,0 +1,4 @@
+import { TextFieldProps } from "@mui/material";
+export type { TextFieldProps };
+export declare const TextField: (props: TextFieldProps) => import("react").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/text-field/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/text-field/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA6B,cAAc,EAAE,MAAM,eAAe,CAAC;AAE1E,YAAY,EAAE,cAAc,EAAE,CAAC;AAE/B,eAAO,MAAM,SAAS,GAAI,OAAO,cAAc,gCAAgC,CAAC"}

package/dist/components/text-field/index.js

@@ -0,0 +1,5 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { TextField as MuiTextField } from "@mui/material";
+export const TextField = (props) => _jsx(MuiTextField, { ...props });
+//# sourceMappingURL=index.js.map

package/dist/components/text-field/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/text-field/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,SAAS,IAAI,YAAY,EAAkB,MAAM,eAAe,CAAC;AAI1E,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,KAAqB,EAAE,EAAE,CAAC,KAAC,YAAY,OAAK,KAAK,GAAI,CAAC"}

package/dist/components/timeline/Timeline.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { TimelineProps } from "./types";
+export declare const Timeline: React.FC<TimelineProps>;
+//# sourceMappingURL=Timeline.d.ts.map

package/dist/components/timeline/Timeline.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Timeline.d.ts","sourceRoot":"","sources":["../../../src/components/timeline/Timeline.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,aAAa,EAAiB,MAAM,SAAS,CAAC;AAIvD,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA+G5C,CAAC"}

package/dist/components/timeline/Timeline.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useMediaQuery } from "@mui/material";
+import { useTheme } from "@mui/material/styles";
+import { TimelineTheme } from "./types";
+import { defaultDateFormatter } from "./utils";
+import * as Styled from "./Timeline.styled";
+export const Timeline = ({ items, theme = TimelineTheme.Light, singleColumn = false, startButton, endButton, formatDate = defaultDateFormatter, className, }) => {
+    const muiTheme = useTheme();
+    const isDesktop = useMediaQuery(muiTheme.breakpoints.up("sm"));
+    const useDoubleColumn = isDesktop && !singleColumn;
+    if (!items.length) {
+        return null;
+    }
+    return (_jsxs(Styled.Wrapper, { className: className, theme: theme, children: [_jsx(Styled.CenterLine, { theme: theme, singleColumn: singleColumn }), startButton && (_jsx(Styled.StartButtonContainer, { theme: theme, singleColumn: singleColumn, children: _jsx(Styled.TimelineButton, { theme: theme, singleColumn: singleColumn, onClick: startButton.onClick, "aria-label": startButton["aria-label"], children: _jsx(startButton.Icon, {}) }) })), _jsx(Styled.Columns, { singleColumn: singleColumn, children: useDoubleColumn ? (_jsxs(_Fragment, { children: [_jsx(Styled.LeftColumn, { children: items.map((item, index) => {
+                                if (index % 2 !== 0)
+                                    return null;
+                                return (_jsxs(Styled.EntryLeft, { theme: theme, children: [_jsx(Styled.DotLeft, { theme: theme, singleColumn: singleColumn }), item && (_jsx(Styled.DateRight, { theme: theme, children: _jsx("strong", { children: item.title || formatDate(item.date) }) })), _jsx(Styled.ContentContainer, { theme: theme, children: item.content })] }, `left-${index}`));
+                            }) }), _jsx(Styled.RightColumn, { children: items.map((item, index) => {
+                                if (index % 2 === 0)
+                                    return null;
+                                return (_jsxs(Styled.EntryRight, { theme: theme, children: [_jsx(Styled.DotRight, { theme: theme, singleColumn: singleColumn }), item && (_jsx(Styled.DateLeft, { theme: theme, children: _jsx("strong", { children: item.title || formatDate(item.date) }) })), _jsx(Styled.ContentContainer, { theme: theme, children: item.content })] }, `right-${index}`));
+                            }) })] })) : (_jsx("div", { children: items.map((item, index) => (_jsxs(Styled.EntryRight, { theme: theme, children: [_jsx(Styled.DotRight, { theme: theme, singleColumn: singleColumn }), item && (_jsx(Styled.DateLeft, { theme: theme, children: _jsx("strong", { children: item.title || formatDate(item.date) }) })), _jsx(Styled.ContentContainer, { theme: theme, children: item.content })] }, `mobile-${index}`))) })) }), endButton && (_jsx(Styled.EndButtonContainer, { theme: theme, singleColumn: singleColumn, children: _jsx(Styled.TimelineButton, { theme: theme, singleColumn: singleColumn, onClick: endButton.onClick, "aria-label": endButton["aria-label"], children: _jsx(endButton.Icon, {}) }) }))] }));
+};
+//# sourceMappingURL=Timeline.js.map

package/dist/components/timeline/Timeline.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Timeline.js","sourceRoot":"","sources":["../../../src/components/timeline/Timeline.tsx"],"names":[],"mappings":"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"}

package/dist/components/timeline/Timeline.styled/buttons.d.ts

@@ -0,0 +1,22 @@
+import { TimelineTheme } from "../types";
+export declare const StartButtonContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    theme: TimelineTheme;
+    singleColumn?: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const EndButtonContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    theme: TimelineTheme;
+    singleColumn?: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TimelineButton: import("@emotion/styled").StyledComponent<import("@mui/material").IconButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, keyof import("@mui/material").IconButtonOwnProps> & Omit<import("@mui/material").ButtonBaseOwnProps, "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "nativeButton" | "onFocusVisible" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "type" | keyof import("@mui/material").IconButtonOwnProps> & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "className" | "style" | "classes" | "action" | "centerRipple" | "children" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "nativeButton" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "type" | "color" | "disableFocusRipple" | "loading" | "loadingIndicator" | "size" | "edge"> & {
+    theme?: import("@emotion/react").Theme;
+} & {
+    theme: TimelineTheme;
+    singleColumn?: boolean;
+}, {}, {}>;
+//# sourceMappingURL=buttons.d.ts.map

package/dist/components/timeline/Timeline.styled/buttons.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"buttons.d.ts","sourceRoot":"","sources":["../../../../src/components/timeline/Timeline.styled/buttons.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAGzC,eAAO,MAAM,oBAAoB;;;;WACxB,aAAa;mBACL,OAAO;yGAmBvB,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;;WACtB,aAAa;mBACL,OAAO;yGAmBvB,CAAC;AAEF,eAAO,MAAM,cAAc;;;WAClB,aAAa;mBACL,OAAO;UAwDvB,CAAC"}

package/dist/components/timeline/Timeline.styled/buttons.js

@@ -0,0 +1,96 @@
+import styled from "@emotion/styled";
+import { IconButton } from "@mui/material";
+import { css } from "@emotion/react";
+import { TimelineTheme } from "../types";
+import { Breakpoints, forwardProps } from "./shared";
+export const StartButtonContainer = styled("div", forwardProps) `
+  display: flex;
+  justify-content: center;
+  margin-bottom: 3rem;
+  position: relative;
+  z-index: 2;
+
+  ${({ singleColumn }) => singleColumn &&
+    css `
+      justify-content: flex-start;
+      padding-left: 18px;
+    `}
+
+  @media (max-width: ${Breakpoints.sm}px) {
+    justify-content: flex-start;
+    padding-left: 18px;
+  }
+`;
+export const EndButtonContainer = styled("div", forwardProps) `
+  display: flex;
+  justify-content: center;
+  margin-top: 3rem;
+  position: relative;
+  z-index: 2;
+
+  ${({ singleColumn }) => singleColumn &&
+    css `
+      justify-content: flex-start;
+      padding-left: 18px;
+    `}
+
+  @media (max-width: ${Breakpoints.sm}px) {
+    justify-content: flex-start;
+    padding-left: 18px;
+  }
+`;
+export const TimelineButton = styled(IconButton, forwardProps) `
+  width: 56px;
+  height: 56px;
+  border: 3px solid white;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+  position: relative;
+  z-index: 3;
+
+  ${({ theme }) => theme === TimelineTheme.Light
+    ? css `
+          color: var(--color-light-blue) !important;
+          background-color: var(--color-primary) !important;
+          &:hover {
+            color: var(--color-primary) !important;
+            background-color: var(--color-light-blue) !important;
+          }
+
+          [data-theme="dark"] &:hover {
+            color: var(--color-light-blue) !important;
+            background-color: #0e2748 !important;
+          }
+        `
+    : css `
+          color: var(--color-primary) !important;
+          background-color: var(--color-light-blue) !important;
+          &:hover {
+            color: var(--color-light-blue) !important;
+            background-color: var(--color-primary) !important;
+          }
+
+          [data-theme="dark"] & {
+            color: var(--color-light-blue) !important;
+            background-color: #0e2748 !important;
+          }
+        `}
+
+  &:disabled {
+    background-color: var(--color-light-gray);
+    color: var(--color-gray);
+  }
+
+  ${({ singleColumn }) => singleColumn &&
+    css `
+      width: 48px;
+      height: 48px;
+      transform: translateX(-50%);
+    `}
+
+  @media (max-width: ${Breakpoints.sm}px) {
+    width: 48px;
+    height: 48px;
+    transform: translateX(-50%);
+  }
+`;
+//# sourceMappingURL=buttons.js.map

package/dist/components/timeline/Timeline.styled/buttons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"buttons.js","sourceRoot":"","sources":["../../../../src/components/timeline/Timeline.styled/buttons.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AACrC,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAErD,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,KAAK,EAAE,YAAY,CAAC,CAG7D;;;;;;;IAOE,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE,CACrB,YAAY;IACZ,GAAG,CAAA;;;KAGF;;uBAEkB,WAAW,CAAC,EAAE;;;;CAIpC,CAAC;AAEF,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,KAAK,EAAE,YAAY,CAAC,CAG3D;;;;;;;IAOE,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE,CACrB,YAAY;IACZ,GAAG,CAAA;;;KAGF;;uBAEkB,WAAW,CAAC,EAAE;;;;CAIpC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,UAAU,EAAE,YAAY,CAAC,CAG5D;;;;;;;;IAQE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CACd,KAAK,KAAK,aAAa,CAAC,KAAK;IAC3B,CAAC,CAAC,GAAG,CAAA;;;;;;;;;;;;SAYF;IACH,CAAC,CAAC,GAAG,CAAA;;;;;;;;;;;;SAYF;;;;;;;IAOL,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE,CACrB,YAAY;IACZ,GAAG,CAAA;;;;KAIF;;uBAEkB,WAAW,CAAC,EAAE;;;;;CAKpC,CAAC"}

package/dist/components/timeline/Timeline.styled/entries.d.ts

@@ -0,0 +1,56 @@
+import { TimelineTheme } from "../types";
+export declare const EntryLeft: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme;
+} & {
+    theme: TimelineTheme;
+}, {}, {}>;
+export declare const EntryRight: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme;
+} & {
+    theme: TimelineTheme;
+}, {}, {}>;
+export declare const DateRight: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "className" | "style" | "classes" | "children" | "sx" | "color" | "variant" | "align" | "gutterBottom" | "noWrap" | "variantMapping"> & {
+    theme?: import("@emotion/react").Theme;
+} & {
+    theme: TimelineTheme;
+}, {}, {}>;
+export declare const DateLeft: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "className" | "style" | "classes" | "children" | "sx" | "color" | "variant" | "align" | "gutterBottom" | "noWrap" | "variantMapping"> & {
+    theme?: import("@emotion/react").Theme;
+} & {
+    theme: TimelineTheme;
+}, {}, {}>;
+export declare const DotLeft: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    theme: TimelineTheme;
+} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme;
+} & {
+    theme: TimelineTheme;
+    singleColumn?: boolean;
+}, {}, {}>;
+export declare const DotRight: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    theme: TimelineTheme;
+} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme;
+} & {
+    theme: TimelineTheme;
+    singleColumn?: boolean;
+}, {}, {}>;
+export declare const ContentContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    theme: TimelineTheme;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+//# sourceMappingURL=entries.d.ts.map

package/dist/components/timeline/Timeline.styled/entries.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"entries.d.ts","sourceRoot":"","sources":["../../../../src/components/timeline/Timeline.styled/entries.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAazC,eAAO,MAAM,SAAS;;;;;;WAA8B,aAAa;UAGhE,CAAC;AAEF,eAAO,MAAM,UAAU;;;;;;WAA8B,aAAa;UAGjE,CAAC;AAEF,eAAO,MAAM,SAAS;;;WAA+B,aAAa;UAoBjE,CAAC;AAEF,eAAO,MAAM,QAAQ;;;WAA+B,aAAa;UAoBhE,CAAC;AA0BF,eAAO,MAAM,OAAO;;;;WAxBgB,aAAa;;;;WAyBxC,aAAa;mBACL,OAAO;UAkBvB,CAAC;AAEF,eAAO,MAAM,QAAQ;;;;WA9Ce,aAAa;;;;WA+CxC,aAAa;mBACL,OAAO;UAgBvB,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;WAAuB,aAAa;yGAMhE,CAAC"}

package/dist/components/timeline/Timeline.styled/entries.js

@@ -0,0 +1,124 @@
+import styled from "@emotion/styled";
+import { Typography } from "@mui/material";
+import { css } from "@emotion/react";
+import { TimelineTheme } from "../types";
+import { Breakpoints, forwardProps } from "./shared";
+const EntryBase = styled.div `
+  position: relative;
+  margin-bottom: 24px;
+  width: 100%;
+
+  @media (max-width: ${Breakpoints.sm}px) {
+    padding-left: 34px;
+  }
+`;
+export const EntryLeft = styled(EntryBase) `
+  padding-right: 28px;
+  justify-self: end;
+`;
+export const EntryRight = styled(EntryBase) `
+  padding-left: 28px;
+  justify-self: start;
+`;
+export const DateRight = styled(Typography) `
+  text-align: right;
+  padding-right: 12px;
+  margin-bottom: 8px;
+  font-size: 0.875rem;
+  font-weight: 400;
+  line-height: 1.43;
+
+  ${({ theme }) => theme === TimelineTheme.Light
+    ? css `
+          color: var(--color-light-blue);
+        `
+    : css `
+          color: var(--color-primary);
+
+          [data-theme="dark"] & {
+            color: var(--color-light-blue);
+          }
+        `}
+`;
+export const DateLeft = styled(Typography) `
+  text-align: left;
+  padding-left: 12px;
+  margin-bottom: 8px;
+  font-size: 0.875rem;
+  font-weight: 400;
+  line-height: 1.43;
+
+  ${({ theme }) => theme === TimelineTheme.Light
+    ? css `
+          color: var(--color-light-blue);
+        `
+    : css `
+          color: var(--color-primary);
+
+          [data-theme="dark"] & {
+            color: var(--color-light-blue);
+          }
+        `}
+`;
+const DotBase = styled.div `
+  position: absolute;
+  top: 10px;
+  width: 12px;
+  height: 12px;
+  border-radius: 50%;
+  border: 2px solid #fff;
+
+  ${({ theme }) => theme === TimelineTheme.Light
+    ? css `
+          background: var(--color-light-blue);
+          box-shadow: 0 0 0 6px var(--color-primary);
+
+          [data-theme="dark"] & {
+            background: #0e2748;
+          }
+        `
+    : css `
+          background: var(--color-primary);
+          box-shadow: 0 0 0 6px var(--color-light-blue);
+        `}
+`;
+export const DotLeft = styled(DotBase, forwardProps) `
+  top: 4px;
+  right: -22px;
+
+  ${({ singleColumn }) => singleColumn &&
+    css `
+      right: auto;
+      left: 17px;
+      transform: translateX(-50%);
+    `}
+
+  @media (max-width: ${Breakpoints.sm}px) {
+    right: auto;
+    left: 17px;
+    transform: translateX(-50%);
+  }
+`;
+export const DotRight = styled(DotBase, forwardProps) `
+  top: 4px;
+  left: -22px;
+
+  ${({ singleColumn }) => singleColumn &&
+    css `
+      left: 17px;
+      transform: translateX(-50%);
+    `}
+
+  @media (max-width: ${Breakpoints.sm}px) {
+    left: 17px;
+    transform: translateX(-50%);
+  }
+`;
+export const ContentContainer = styled.div `
+  position: relative;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+`;
+//# sourceMappingURL=entries.js.map

package/dist/components/timeline/Timeline.styled/entries.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"entries.js","sourceRoot":"","sources":["../../../../src/components/timeline/Timeline.styled/entries.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AACrC,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAErD,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;uBAKL,WAAW,CAAC,EAAE;;;CAGpC,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC,CAA0B;;;CAGnE,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,SAAS,CAAC,CAA0B;;;CAGpE,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,MAAM,CAAC,UAAU,CAAC,CAA0B;;;;;;;;IAQjE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CACd,KAAK,KAAK,aAAa,CAAC,KAAK;IAC3B,CAAC,CAAC,GAAG,CAAA;;SAEF;IACH,CAAC,CAAC,GAAG,CAAA;;;;;;SAMF;CACR,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,MAAM,CAAC,UAAU,CAAC,CAA0B;;;;;;;;IAQhE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CACd,KAAK,KAAK,aAAa,CAAC,KAAK;IAC3B,CAAC,CAAC,GAAG,CAAA;;SAEF;IACH,CAAC,CAAC,GAAG,CAAA;;;;;;SAMF;CACR,CAAC;AAEF,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAA0B;;;;;;;;IAQhD,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CACd,KAAK,KAAK,aAAa,CAAC,KAAK;IAC3B,CAAC,CAAC,GAAG,CAAA;;;;;;;SAOF;IACH,CAAC,CAAC,GAAG,CAAA;;;SAGF;CACR,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,MAAM,CAAC,OAAO,EAAE,YAAY,CAAC,CAGlD;;;;IAIE,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE,CACrB,YAAY;IACZ,GAAG,CAAA;;;;KAIF;;uBAEkB,WAAW,CAAC,EAAE;;;;;CAKpC,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,MAAM,CAAC,OAAO,EAAE,YAAY,CAAC,CAGnD;;;;IAIE,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE,CACrB,YAAY;IACZ,GAAG,CAAA;;;KAGF;;uBAEkB,WAAW,CAAC,EAAE;;;;CAIpC,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAA0B;;;;;;CAMnE,CAAC"}

package/dist/components/timeline/Timeline.styled/index.d.ts

@@ -0,0 +1,4 @@
+export * from "./layout";
+export * from "./entries";
+export * from "./buttons";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/timeline/Timeline.styled/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/timeline/Timeline.styled/index.tsx"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC"}

package/dist/components/timeline/Timeline.styled/index.js

@@ -0,0 +1,4 @@
+export * from "./layout";
+export * from "./entries";
+export * from "./buttons";
+//# sourceMappingURL=index.js.map

package/dist/components/timeline/Timeline.styled/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/timeline/Timeline.styled/index.tsx"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC"}

package/dist/components/timeline/Timeline.styled/layout.d.ts

@@ -0,0 +1,29 @@
+import { TimelineTheme } from "../types";
+export declare const Wrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    theme: TimelineTheme;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const CenterLine: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    theme: TimelineTheme;
+    singleColumn?: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Columns: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    singleColumn?: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const LeftColumn: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const RightColumn: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+//# sourceMappingURL=layout.d.ts.map

package/dist/components/timeline/Timeline.styled/layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../../../../src/components/timeline/Timeline.styled/layout.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAGzC,eAAO,MAAM,OAAO;;;;WAAuB,aAAa;yGAgBvD,CAAC;AAEF,eAAO,MAAM,UAAU;;;;WACd,aAAa;mBACL,OAAO;yGAiCvB,CAAC;AAEF,eAAO,MAAM,OAAO;;;;mBACH,OAAO;yGAgBvB,CAAC;AAEF,eAAO,MAAM,UAAU;;;yGAGtB,CAAC;AAEF,eAAO,MAAM,WAAW;;;yGAQvB,CAAC"}

package/dist/components/timeline/Timeline.styled/layout.js

@@ -0,0 +1,80 @@
+import styled from "@emotion/styled";
+import { css } from "@emotion/react";
+import { TimelineTheme } from "../types";
+import { Breakpoints, forwardProps } from "./shared";
+export const Wrapper = styled.div `
+  position: relative;
+  width: 100%;
+
+  ${({ theme }) => theme === TimelineTheme.Light
+    ? css `
+          color: var(--color-light-blue);
+        `
+    : css `
+          color: var(--color-primary);
+
+          [data-theme="dark"] & {
+            color: var(--color-light-blue);
+          }
+        `}
+`;
+export const CenterLine = styled("div", forwardProps) `
+  position: absolute;
+  left: 50%;
+  top: 0;
+  bottom: 0;
+  width: 3px;
+  transform: translateX(-50%);
+
+  ${({ theme }) => theme === TimelineTheme.Light
+    ? css `
+          background: var(--color-light-blue);
+
+          [data-theme="dark"] & {
+            background: #0e2748;
+          }
+        `
+    : css `
+          background: var(--color-primary);
+        `}
+
+  ${({ singleColumn }) => singleColumn &&
+    css `
+      left: 16px;
+      transform: none;
+    `}
+
+  @media (max-width: ${Breakpoints.sm}px) {
+    left: 16px;
+    transform: none;
+  }
+`;
+export const Columns = styled("div", forwardProps) `
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  column-gap: 32px;
+  align-items: start;
+
+  ${({ singleColumn }) => singleColumn &&
+    css `
+      grid-template-columns: 1fr;
+    `}
+
+  @media (max-width: ${Breakpoints.sm}px) {
+    grid-template-columns: 1fr;
+  }
+`;
+export const LeftColumn = styled.div `
+  display: flex;
+  flex-direction: column;
+`;
+export const RightColumn = styled.div `
+  display: flex;
+  flex-direction: column;
+  margin-top: 3rem;
+
+  @media (max-width: ${Breakpoints.sm}px) {
+    margin-top: 0;
+  }
+`;
+//# sourceMappingURL=layout.js.map

package/dist/components/timeline/Timeline.styled/layout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.js","sourceRoot":"","sources":["../../../../src/components/timeline/Timeline.styled/layout.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AACrC,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AACzC,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAErD,MAAM,CAAC,MAAM,OAAO,GAAG,MAAM,CAAC,GAAG,CAA0B;;;;IAIvD,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CACd,KAAK,KAAK,aAAa,CAAC,KAAK;IAC3B,CAAC,CAAC,GAAG,CAAA;;SAEF;IACH,CAAC,CAAC,GAAG,CAAA;;;;;;SAMF;CACR,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,KAAK,EAAE,YAAY,CAAC,CAGnD;;;;;;;;IAQE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,CACd,KAAK,KAAK,aAAa,CAAC,KAAK;IAC3B,CAAC,CAAC,GAAG,CAAA;;;;;;SAMF;IACH,CAAC,CAAC,GAAG,CAAA;;SAEF;;IAEL,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE,CACrB,YAAY;IACZ,GAAG,CAAA;;;KAGF;;uBAEkB,WAAW,CAAC,EAAE;;;;CAIpC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,MAAM,CAAC,KAAK,EAAE,YAAY,CAAC,CAEhD;;;;;;IAME,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE,CACrB,YAAY;IACZ,GAAG,CAAA;;KAEF;;uBAEkB,WAAW,CAAC,EAAE;;;CAGpC,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAA;;;CAGnC,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;uBAKd,WAAW,CAAC,EAAE;;;CAGpC,CAAC"}