@ilo-org/react 0.12.0 → 0.14.0

package/lib/types/react/src/components/Cards/Card.props.d.ts

@@ -1,307 +0,0 @@
-import { CardAlignment, ThemeTypes, CardCornerType, CardColor, CardSize, CardTypes } from "../../types";
-import { LinkProps, LinkListProps } from "../LinkList/LinkList.props";
-import { ProfileProps } from "../Profile/Profile.props";
-export type DataCardProps = {
-    /**
-     * A line of text that appears as a small heading at the top of the card
-     */
-    eyebrow?: string;
-    /**
-     * How big should the card be
-     */
-    size?: Omit<CardSize, "standard">;
-    /**
-     * The image to show in the card
-     */
-    image?: string;
-    /**
-     * Array of Content (label, copy), Files object (optional headline, array of items with label and url) and Links * * object (optional headline, array of items with label and url)
-     */
-    dataset?: CardDataset;
-    /**
-     * Make the content appear in one or two columns. Only applies when the size is set to `wide` or `fluid`
-     */
-    columns?: string;
-};
-export type DetailCardProps = {
-    /**
-     * A line of text that appears as a small heading above the title of the card
-     */
-    eyebrow?: string;
-    /**
-     * The title of the card
-     */
-    title: string;
-    /**
-     * Introductory text in the card
-     */
-    intro?: string;
-    /**
-     * Specify the event Date, in both human and Unix format.
-     */
-    date?: EventDate;
-    /**
-     * Information about an event
-     */
-    eventdetails?: string;
-    /**
-     * A URL to link to
-     */
-    link?: string;
-    /**
-     * The image to show in the card
-     */
-    image?: string;
-    /**
-     * How big should the card be
-     */
-    size?: Omit<CardSize, "standard">;
-};
-export type FactlistCardProps = {
-    /**
-     * The title of the card
-     */
-    title: string;
-    /**
-     * Will render the card to appear on light or dark backgrounds
-     */
-    theme?: ThemeTypes;
-    /**
-     * How big should the card be
-     */
-    size?: Omit<CardSize, "standard">;
-    list?: string[];
-};
-export type FeatureCardProps = {
-    isvideo?: boolean;
-    /**
-     * A line of text that appears as a small heading above the title of the card
-     */
-    eyebrow?: string;
-    /**
-     * The title of the card
-     */
-    title: string;
-    /**
-     * Will render the card to appear on light or dark backgrounds
-     */
-    theme?: ThemeTypes;
-    /**
-     * How big should the card be
-     */
-    size?: Omit<CardSize, "standard">;
-    /**
-     * Specify the event Date, in both human and Unix format.
-     */
-    date?: EventDate;
-    link?: string;
-    linklist?: LinkListProps;
-    /**
-     * The image to show in the card
-     */
-    image?: string;
-};
-export type MultilinkCardProps = {
-    isvideo?: boolean;
-    /**
-     * A line of text that appears as a small heading above the title of the card
-     */
-    eyebrow?: string;
-    /**
-     * The title of the card
-     */
-    title: string;
-    /**
-     * How big should the card be
-     */
-    size?: CardSize;
-    alignment?: CardAlignment;
-    intro?: string;
-    link?: string;
-    linklist?: LinkListProps;
-    /**
-     * The image to show in the card
-     */
-    image?: string;
-};
-export type PromoCardProps = {
-    /**
-     * A line of text that appears as a small heading above the title of the card
-     */
-    eyebrow?: string;
-    /**
-     * The title of the card
-     */
-    title: string;
-    /**
-     * Will render the card to appear on light or dark backgrounds
-     */
-    theme?: ThemeTypes;
-    /**
-     * How big should the card be
-     */
-    size?: CardSize;
-    /**
-     * Apply an optional corner cut to the top of the card
-     */
-    cornercut?: CardCornerType;
-    /**
-     * Introductory text in the card
-     */
-    intro?: string;
-    link?: string;
-    cta?: LinkProps;
-};
-export type StatCardProps = {
-    /**
-     * The title of the card
-     */
-    title: string;
-    color?: CardColor;
-    /**
-     * How big should the card be
-     */
-    size?: Omit<CardSize, "narrow" | "wide">;
-    /**
-     * Introductory text in the card
-     */
-    intro?: string;
-    source?: LinkProps;
-};
-export type TextCardProps = {
-    /**
-     * A line of text that appears as a small heading above the title of the card
-     */
-    eyebrow?: string;
-    /**
-     * The title of the card
-     */
-    title: string;
-    /**
-     * Will render the card to appear on light or dark backgrounds
-     */
-    theme?: ThemeTypes;
-    /**
-     * How big should the card be
-     */
-    size?: Omit<CardSize, "standard">;
-    /**
-     * Specify the event Date, in both human and Unix format.
-     */
-    date?: EventDate;
-    profile: ProfileProps;
-    link?: string;
-};
-export interface CardProps {
-    /**
-     * Specify whether the card should display a video icon (for Feature card). Possible options: true | false
-     */
-    isvideo?: boolean;
-    /**
-     * Eyebrow field for the card.
-     */
-    eyebrow: string;
-    /**
-     * Title field for the card
-     */
-    title: string;
-    /**
-     * Color of the stat cards, options are turquoise | green| yellow| blue. Only used for stat cards.
-     */
-    color?: CardColor;
-    /**
-     * The theme type for the card. Theme doesn't apply to these card types: Multilink, Data, Stat and Detail. Possible themes: light | dark.
-     */
-    theme?: ThemeTypes;
-    /**
-     * Type - Sets the type of card to render.
-       Option keys: feature, text, detail, promo, multilink, data, stat, factlist
-     */
-    type: CardTypes;
-    /**
-     * Size of the cards (usually reduces padding). `Wide` on Multilink and Feature cause a two column structure above a desktop breakpoint. Possible options: Wide | Standard | Narrow.
-     */
-    size?: CardSize;
-    /**
-     * Specify whether the card has a cut corner. The only card that uses this setting are `Promo`.
-     */
-    cornercut?: CardCornerType;
-    /**
-     * Specify whether a card image is right-aligned or left-aligned for `Multilink` cards. Possible options: left | right.
-     */
-    alignment?: CardAlignment;
-    /**
-     * Intro text field for the card
-     */
-    intro?: string;
-    /**
-     * Specify the event Date, in both human and Unix format.
-     */
-    date?: EventDate;
-    /**
-     * Event details for `Detail` card
-     */
-    eventdetails?: string;
-    /**
-     * Profile to embed in the card for `Text` card
-     */
-    profile?: ProfileProps;
-    /**
-     * A list of text itmes to be embed in the card, specifically used in `Factlist` card.
-     */
-    listitems?: Array<string>;
-    /**
-     * A Link behind a clickable card. Do no use on `Multilink`, `Factlist`, `Data`, or `Stat` cards.
-     */
-    link?: string;
-    /**
-     * Props of the LinkList component. Appears at the bottom of `Multilink` or `Feature` card.
-     */
-    linklist?: LinkListProps;
-    /**
-     * Items for clickable CTA button, specifically used for `Promo` card.
-     */
-    cta?: LinkProps;
-    /**
-     * The image used in a card. Images should be avoided on `Promo`, `Text`, `Factlist`, and `Stat` card.
-     */
-    image?: string;
-    /**
-     * Source link for `Stat` cards.
-     */
-    source?: LinkProps;
-    /**
-     * Dataset object for the `Data` card. An array of Content (label, copy), Files (optional headline, array of items with label and url), and Links (optional headline, array of items with label and url).
-     */
-    dataset?: CardDataset;
-}
-interface EventDate {
-    unix?: string;
-    human?: string;
-}
-interface CardDataset {
-    content?: DataContent;
-    files?: DataFile;
-    links?: DataLink;
-    cta?: Cta;
-}
-interface DataContent {
-    items?: Array<ContentItem>;
-}
-interface ContentItem {
-    label?: string;
-    copy?: string;
-}
-interface DataFile {
-    headline?: string;
-    items?: Array<LinkProps>;
-}
-interface DataLink {
-    headline?: string;
-    items?: Array<LinkProps>;
-}
-interface Cta {
-    headline?: string;
-    items?: Array<LinkProps>;
-}
-export {};

package/lib/types/react/src/components/Cards/CardGroup.props.d.ts

@@ -1,16 +0,0 @@
-import { CardProps } from "./Card.props";
-import { LinkProps } from "../LinkList/LinkList.props";
-export interface CardGroupProps {
-    /**
-     * An array of card objects
-     */
-    cards?: Required<CardProps>[];
-    /**
-     * Number of cards in the group
-     */
-    cardcount: Required<string>;
-    /**
-     * A Button to display after all the cards in the group
-     */
-    cta?: LinkProps;
-}

package/lib/types/react/src/components/Cards/index.d.ts

@@ -1,11 +0,0 @@
-import FeatureCard from "./FeatureCard";
-import DataCard from "./DataCard";
-import DetailCard from "./DetailCard";
-import FactlistCard from "./FactlistCard";
-import MultilinkCard from "./MultilinkCard";
-import PromoCard from "./PromoCard";
-import StatCard from "./StatCard";
-import TextCard from "./TextCard";
-export { FeatureCard, DataCard, DetailCard, FactlistCard, MultilinkCard, PromoCard, StatCard, TextCard, };
-export { default as Card } from "./Card";
-export { default as CardGroup } from "./CardGroup";

package/lib/types/react/src/components/List/ListCtx.d.ts

@@ -1,4 +0,0 @@
-import { ListContextProps } from "./List.props";
-import { ListItemContextProps } from "./ListItem.props";
-export declare const ListContext: import("react").Context<ListContextProps>;
-export declare const ListItemContext: import("react").Context<ListItemContextProps>;

package/src/components/Cards/Card.args.ts

@@ -1,220 +0,0 @@
-import {
-  TextCardProps,
-  StatCardProps,
-  MultilinkCardProps,
-  PromoCardProps,
-  FeatureCardProps,
-  DetailCardProps,
-  FactlistCardProps,
-  DataCardProps,
-} from "./Card.props";
-
-const textCard: TextCardProps = {
-  title: "Why we need greater social justice",
-  eyebrow: "Podcast",
-  date: {
-    human: "20 September 2022",
-    unix: "1670389200",
-  },
-  theme: "light",
-  link: "https:/www.ilo.org",
-  profile: {
-    avatar: "/ilo-dg.jpg",
-    description:
-      "Gilbert Houngbo is the Director-General of the International Labour Organization",
-    name: "Gilbert Houngbo",
-    role: "ILO Director-General",
-  },
-};
-
-const statCard: StatCardProps = {
-  title: "Global employment growth down by half in 2023",
-  intro:
-    "The current global economic slowdown is likely to force more workers to accept lower quality, poorly paid jobs which lack job security and social protection, so accentuating inequalities exacerbated by the COVID-19 crisis.",
-  color: "turquoise",
-  source: {
-    label: "World Employment and Social Outlook: Trends 2023",
-    url: "https://www.ilo.org",
-  },
-};
-
-const multilinkCard: MultilinkCardProps = {
-  title:
-    "ILO welcomes G7 call to make a just transition to a green economy happen",
-  eyebrow: "High-level meeting",
-  intro:
-    "At the end of their meeting the G7 Labour Ministers highlighted the urgent need to greater focus on rights and occupational safety and health.",
-  image: "/hero.jpg",
-  alignment: "left",
-  link: "https:/www.ilo.org",
-  linklist: {
-    headline: "",
-    linkgroup: [
-      {
-        links: [
-          {
-            label: "Read the press release",
-            url: "https://www.ilo.org",
-          },
-          {
-            label: "See the statement",
-            url: "https://www.ilo.org",
-          },
-          {
-            label: "Remarks to G7 Openening Session",
-            url: "https://www.ilo.org",
-          },
-        ],
-      },
-    ],
-  },
-};
-
-const promoCard: PromoCardProps = {
-  size: "standard",
-  title:
-    "ILO welcomes G7 call to make a just transition to a green economy happen",
-  eyebrow: "High-level meeting",
-  theme: "dark",
-  cornercut: true,
-  intro:
-    "At the end of their meeting the G7 Labour Ministers highlighted the urgent need to greater focus on rights and occupational safety and health.",
-  link: "https:/www.ilo.org",
-  cta: {
-    label: "Read the press release",
-    url: "https://www.ilo.org",
-  },
-};
-
-const featureCard: FeatureCardProps = {
-  isvideo: false,
-  title:
-    "ILO welcomes G7 call to make a just transition to a green economy happen",
-  eyebrow: "High-level meeting",
-  theme: "light",
-  date: {
-    human: "18 March 2023",
-    unix: "1670389200",
-  },
-  image: "/hero.jpg",
-  link: "https:/www.ilo.org",
-  linklist: {
-    headline: "",
-    linkgroup: [
-      {
-        links: [
-          {
-            label: "Read the press release",
-            url: "http://www.google.com",
-          },
-        ],
-      },
-    ],
-  },
-};
-
-const detailCard: DetailCardProps = {
-  title: "Technical meeting on digitalization in the construction sector",
-  eyebrow: "Meeting",
-  intro:
-    "The purpose of the meeting will be to discuss opportunities and challenges for the future of work in the construction industry as a vehicle to ensure a human-centred economic recovery.",
-  date: {
-    human: "18 March 2023",
-    unix: "1670389200",
-  },
-  image: "/medium.jpg",
-  link: "https:/www.ilo.org",
-  eventdetails: "8:30 - 12:00 CET | Geneva",
-};
-
-const factListCard: FactlistCardProps = {
-  title:
-    "Economic slowdown likely to force workers to accept lower quality jobs",
-  theme: "light",
-  list: [
-    "Global employment growth will be only 1.0 per cent in 2023, less than half the level in 2022.",
-    "The labour market deterioration is mainly due to emerging geopolitical tensions and the Ukraine conflict.",
-    "The current slowdown means that many workers will have to accept lower quality jobs, often at very low pay.",
-  ],
-};
-
-const dataCard: DataCardProps = {
-  size: "wide",
-  eyebrow: "Meeting",
-  image: "/small.jpg",
-  columns: "two",
-  dataset: {
-    content: {
-      items: [
-        {
-          label: "Date",
-          copy: "18 March 2023",
-        },
-        {
-          label: "Event type",
-          copy: "Technical meeting of experts",
-        },
-      ],
-    },
-    files: {
-      headline: "Files",
-      items: [
-        {
-          label: "Meeting agenda",
-          url: "https://www.ilo.org",
-        },
-        {
-          label: "Briefing notes",
-          url: "https://www.ilo.org",
-        },
-        {
-          label: "Practical info",
-          url: "https://www.ilo.org",
-        },
-      ],
-    },
-    cta: {
-      headline: "Read online",
-      items: [
-        {
-          label: "HTML Version",
-          url: "https://www.ilo.org",
-        },
-        {
-          label: "InfoStories",
-          url: "https://www.ilo.org/infostories/en-GB",
-        },
-      ],
-    },
-    links: {
-      headline: "Languages",
-      items: [
-        {
-          label: "English",
-          url: "https://www.ilo.org",
-        },
-        {
-          label: "Español",
-          url: "https://www.ilo.org",
-        },
-        {
-          label: "Français",
-          url: "https://www.ilo.org",
-        },
-      ],
-    },
-  },
-};
-
-const CardArgs = {
-  textCard,
-  statCard,
-  multilinkCard,
-  promoCard,
-  featureCard,
-  detailCard,
-  factListCard,
-  dataCard,
-};
-
-export default CardArgs;