@fluid-topics/ftds-event-card 2.2.2

package/build/ftds-event-card.properties.d.ts

@@ -0,0 +1,9 @@
+import { FtCssVariable } from "@fluid-topics/ft-wc-utils";
+import { FtdsIcons, FtdsIconVariants } from "@fluid-topics/ftds-icon";
+export interface FtdsEventCardProperties {
+    color?: string | FtCssVariable;
+    icon?: FtdsIcons;
+    iconVariant?: FtdsIconVariants;
+    primary?: boolean;
+    secondary?: boolean;
+}

package/build/ftds-event-card.properties.js

@@ -0,0 +1 @@
+export {};

package/build/ftds-event-card.styles.d.ts

@@ -0,0 +1,12 @@
+export declare const FtdsEventCardCssVariables: {
+    borderRadius: import("@fluid-topics/design-system-variables").FtCssVariable;
+    borderWidth: import("@fluid-topics/design-system-variables").FtCssVariable;
+    backgroundColor: import("@fluid-topics/design-system-variables").FtCssVariable;
+    thumbnailWidth: import("@fluid-topics/design-system-variables").FtCssVariable;
+    thumbnailIconSize: import("@fluid-topics/design-system-variables").FtCssVariable;
+    slotHorizontalPadding: import("@fluid-topics/design-system-variables").FtCssVariable;
+    slotVerticalPadding: import("@fluid-topics/design-system-variables").FtCssVariable;
+    primaryThumbnailIconColor: import("@fluid-topics/design-system-variables").FtCssVariable;
+    secondaryThumbnailBackgroundColor: import("@fluid-topics/design-system-variables").FtCssVariable;
+};
+export declare const ftdsEventCardStyles: import("lit").CSSResult;

package/build/ftds-event-card.styles.js

@@ -0,0 +1,40 @@
+import { css } from "lit";
+import { eventCard } from "@fluid-topics/ft-wc-utils";
+import { FtdsIconCssVariables } from "@fluid-topics/ftds-icon";
+export const FtdsEventCardCssVariables = {
+    ...eventCard,
+};
+// language=CSS
+export const ftdsEventCardStyles = css `
+    .container {
+        display: grid;
+        grid-template-columns: ${eventCard.thumbnailWidth} 1fr;
+        border: ${eventCard.borderWidth} solid ${eventCard.backgroundColor};
+        border-radius: ${eventCard.borderRadius};
+    }
+
+    .icon {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+
+        ftds-icon {
+            ${FtdsIconCssVariables.size.set(eventCard.thumbnailIconSize)};
+        }
+    }
+
+    .icon.primary {
+        background-color: ${eventCard.backgroundColor};
+        color: ${eventCard.primaryThumbnailIconColor};
+    }
+
+    .icon.secondary {
+        background-color: ${eventCard.secondaryThumbnailBackgroundColor};
+        color: ${eventCard.backgroundColor};
+        border-radius: ${eventCard.borderRadius} 0 0 ${eventCard.borderRadius};
+    }
+    
+    .content {
+        padding: ${eventCard.slotVerticalPadding} ${eventCard.slotHorizontalPadding};
+    }
+`;

package/build/index.d.ts

@@ -0,0 +1,9 @@
+export * from "./ftds-event-card.styles";
+export * from "./ftds-event-card.properties";
+export * from "./ftds-event-card";
+export * from "./ftds-event-card-group.styles";
+export * from "./ftds-event-card-group.properties";
+export * from "./ftds-event-card-group";
+export * from "./ftds-event-card-trace-content.styles";
+export * from "./ftds-event-card-trace-content.properties";
+export * from "./ftds-event-card-trace-content";

package/build/index.js

@@ -0,0 +1,9 @@
+export * from "./ftds-event-card.styles";
+export * from "./ftds-event-card.properties";
+export * from "./ftds-event-card";
+export * from "./ftds-event-card-group.styles";
+export * from "./ftds-event-card-group.properties";
+export * from "./ftds-event-card-group";
+export * from "./ftds-event-card-trace-content.styles";
+export * from "./ftds-event-card-trace-content.properties";
+export * from "./ftds-event-card-trace-content";

package/package.json

@@ -0,0 +1,34 @@
+{
+    "name": "@fluid-topics/ftds-event-card",
+    "version": "2.2.2",
+    "description": "The DS component for displaying an event card.\n",
+    "keywords": [
+        "Lit"
+    ],
+    "author": "Fluid Topics <devtopics@antidot.net>",
+    "license": "ISC",
+    "main": "build/index.js",
+    "web": "build/ftds-event-card.min.js",
+    "typings": "build/index",
+    "files": [
+        "build/**/*.js",
+        "build/**/*.ts"
+    ],
+    "repository": {
+        "type": "git",
+        "url": "ssh://git@scm.mrs.antidot.net:2222/fluidtopics/ft-web-components.git"
+    },
+    "dependencies": {
+        "@fluid-topics/ft-wc-utils": "2.2.2",
+        "@fluid-topics/ftds-chip": "2.2.2",
+        "@fluid-topics/ftds-collapsible": "2.2.2",
+        "@fluid-topics/ftds-icon": "2.2.2",
+        "@fluid-topics/ftds-link": "2.2.2",
+        "@fluid-topics/ftds-typography": "2.2.2",
+        "lit": "3.3.3"
+    },
+    "devDependencies": {
+        "@fluid-topics/ft-wc-test-utils": "2.2.2"
+    },
+    "gitHead": "b4be5c398b242bdc7d902866c353cf92cc1f72c7"
+}