@reykjavik/hanna-react 0.10.99 → 0.10.100

package/ArticleCards.d.ts

@@ -2,6 +2,8 @@ import { ImageCardListProps, ImageCardProps } from './_abstract/_CardList.js';
 export type ArticleCardsItemProps = ImageCardProps;
 /** @deprecated Use `ArticleCardsItemProps` instead (Remove in v0.11) */
 export type ArticleCardProps = ArticleCardsItemProps;
-export type ArticleCardsProps = Pick<ImageCardListProps, 'cards' | 'imgPlaceholder'>;
+export type ArticleCardsProps = Pick<ImageCardListProps, 'cards' | 'imgPlaceholder'> & {
+    size?: 'large' | 'normal';
+};
 export declare const ArticleCards: (props: ArticleCardsProps) => JSX.Element;
 export default ArticleCards;

package/ArticleCards.js

@@ -4,6 +4,6 @@ exports.ArticleCards = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const _CardList_js_1 = require("./_abstract/_CardList.js");
-const ArticleCards = (props) => (react_1.default.createElement(_CardList_js_1.CardList, { bemPrefix: "ArticleCards", standalone: true, cards: props.cards, imgPlaceholder: props.imgPlaceholder || true }));
+const ArticleCards = (props) => (react_1.default.createElement(_CardList_js_1.CardList, { bemPrefix: "ArticleCards", modifier: props.size === 'large' ? 'large' : undefined, standalone: true, cards: props.cards, imgPlaceholder: props.imgPlaceholder || true }));
 exports.ArticleCards = ArticleCards;
 exports.default = exports.ArticleCards;

package/CHANGELOG.md

@@ -4,12 +4,13 @@
 
 - ... <!-- Add new lines here. -->
 
-## 0.10.97 – 0.10.99
+## 0.10.97 – 0.10.100
 
 _2023-08-22_
 
 - feat: Add prop `meta` to items of `ActionCards`
 - feat: Add prop `summary` to items of `ArticleCards` and `ImageCards`
+- feat: Add prop `size="large"` to `ArticleCards`
 - feat: Allow `JSX.Element` as item `meta` for accepting `*Cards` components
 - feat: Allow `JSX.Element` as item `summary` for all `*Cards` components
 - feat: Expand `MainMenuItemList` to allow components as custom

package/_abstract/_CardList.d.ts

@@ -1,5 +1,6 @@
 import React, { ReactElement, ReactNode } from 'react';
 import { EitherObj } from '@reykjavik/hanna-utils';
+import { BemModifierProps } from '../utils/types.js';
 import { ImageProps } from './_Image.js';
 export type TextCardProps = {
     title: string;
@@ -28,6 +29,6 @@ type _CardListProps = EitherObj<ImageCardListProps, TextCardListProps> & CardLis
     bemPrefix: string;
     children?: ReactNode;
     standalone?: boolean;
-};
+} & BemModifierProps;
 export declare const CardList: (props: _CardListProps) => JSX.Element;
 export {};

package/_abstract/_CardList.js

@@ -3,6 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.CardList = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
+const classUtils_1 = require("@hugsmidjan/qj/classUtils");
 const _Button_js_1 = require("./_Button.js");
 const _Image_js_1 = require("./_Image.js");
 const Card = (props) => {
@@ -21,7 +22,7 @@ const Card = (props) => {
         ' '));
 };
 const CardList = (props) => {
-    const { bemPrefix, title, summaryElement, cards, titleTag = 'h2', children, imgPlaceholder, } = props;
+    const { bemPrefix, modifier, title, summaryElement, cards, titleTag = 'h2', children, imgPlaceholder, } = props;
     const TitleTag = titleTag;
     const fallbackImageUrl = (imgPlaceholder !== true && imgPlaceholder) || undefined;
     const fallbackImageStyle = fallbackImageUrl
@@ -33,7 +34,7 @@ const CardList = (props) => {
         summaryElement ? (react_1.default.createElement("div", { className: bemPrefix + '__summary' },
             title && react_1.default.createElement(TitleTag, { className: bemPrefix + '__title' }, title),
             summaryElement)) : (title && react_1.default.createElement(TitleTag, { className: bemPrefix + '__title' }, title)),
-        react_1.default.createElement("ul", { className: bemPrefix + (props.standalone ? '' : '__list'), style: fallbackImageStyle }, cards.map((card, i) => (react_1.default.createElement("li", { key: i, className: bemPrefix + '__item' },
+        react_1.default.createElement("ul", { className: props.standalone ? (0, classUtils_1.modifiedClass)(bemPrefix, modifier) : bemPrefix + '__list', style: fallbackImageStyle }, cards.map((card, i) => (react_1.default.createElement("li", { key: i, className: bemPrefix + '__item' },
             react_1.default.createElement(Card
             /* Assert as `ImageCardProps` to silence the imgPlaceholder false-positive */
             , Object.assign({}, card, { bem: bemPrefix, imgPlaceholder: !!imgPlaceholder })))))),

package/esm/ArticleCards.d.ts

@@ -2,6 +2,8 @@ import { ImageCardListProps, ImageCardProps } from './_abstract/_CardList.js';
 export type ArticleCardsItemProps = ImageCardProps;
 /** @deprecated Use `ArticleCardsItemProps` instead (Remove in v0.11) */
 export type ArticleCardProps = ArticleCardsItemProps;
-export type ArticleCardsProps = Pick<ImageCardListProps, 'cards' | 'imgPlaceholder'>;
+export type ArticleCardsProps = Pick<ImageCardListProps, 'cards' | 'imgPlaceholder'> & {
+    size?: 'large' | 'normal';
+};
 export declare const ArticleCards: (props: ArticleCardsProps) => JSX.Element;
 export default ArticleCards;

package/esm/ArticleCards.js

@@ -1,4 +1,4 @@
 import React from 'react';
 import { CardList } from './_abstract/_CardList.js';
-export const ArticleCards = (props) => (React.createElement(CardList, { bemPrefix: "ArticleCards", standalone: true, cards: props.cards, imgPlaceholder: props.imgPlaceholder || true }));
+export const ArticleCards = (props) => (React.createElement(CardList, { bemPrefix: "ArticleCards", modifier: props.size === 'large' ? 'large' : undefined, standalone: true, cards: props.cards, imgPlaceholder: props.imgPlaceholder || true }));
 export default ArticleCards;

package/esm/_abstract/_CardList.d.ts

@@ -1,5 +1,6 @@
 import React, { ReactElement, ReactNode } from 'react';
 import { EitherObj } from '@reykjavik/hanna-utils';
+import { BemModifierProps } from '../utils/types.js';
 import { ImageProps } from './_Image.js';
 export type TextCardProps = {
     title: string;
@@ -28,6 +29,6 @@ type _CardListProps = EitherObj<ImageCardListProps, TextCardListProps> & CardLis
     bemPrefix: string;
     children?: ReactNode;
     standalone?: boolean;
-};
+} & BemModifierProps;
 export declare const CardList: (props: _CardListProps) => JSX.Element;
 export {};

package/esm/_abstract/_CardList.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import { modifiedClass } from '@hugsmidjan/qj/classUtils';
 import { Button } from './_Button.js';
 import { Image } from './_Image.js';
 const Card = (props) => {
@@ -17,7 +18,7 @@ const Card = (props) => {
         ' '));
 };
 export const CardList = (props) => {
-    const { bemPrefix, title, summaryElement, cards, titleTag = 'h2', children, imgPlaceholder, } = props;
+    const { bemPrefix, modifier, title, summaryElement, cards, titleTag = 'h2', children, imgPlaceholder, } = props;
     const TitleTag = titleTag;
     const fallbackImageUrl = (imgPlaceholder !== true && imgPlaceholder) || undefined;
     const fallbackImageStyle = fallbackImageUrl
@@ -29,7 +30,7 @@ export const CardList = (props) => {
         summaryElement ? (React.createElement("div", { className: bemPrefix + '__summary' },
             title && React.createElement(TitleTag, { className: bemPrefix + '__title' }, title),
             summaryElement)) : (title && React.createElement(TitleTag, { className: bemPrefix + '__title' }, title)),
-        React.createElement("ul", { className: bemPrefix + (props.standalone ? '' : '__list'), style: fallbackImageStyle }, cards.map((card, i) => (React.createElement("li", { key: i, className: bemPrefix + '__item' },
+        React.createElement("ul", { className: props.standalone ? modifiedClass(bemPrefix, modifier) : bemPrefix + '__list', style: fallbackImageStyle }, cards.map((card, i) => (React.createElement("li", { key: i, className: bemPrefix + '__item' },
             React.createElement(Card
             /* Assert as `ImageCardProps` to silence the imgPlaceholder false-positive */
             , Object.assign({}, card, { bem: bemPrefix, imgPlaceholder: !!imgPlaceholder })))))),

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@reykjavik/hanna-react",
-	"version": "0.10.99",
+	"version": "0.10.100",
 	"author": "Reykjavík (http://www.reykjavik.is)",
 	"contributors": [
 		"Hugsmiðjan ehf (http://www.hugsmidjan.is)",