@stack-spot/citric-react 0.5.0 → 0.6.0

package/dist/citric.css

@@ -2188,6 +2188,7 @@ input[data-citric="favorite"][type="checkbox"] {
   border: 1px solid var(--scheme-500, var(--primary-500));
   gap: var(--spacing-2);
   position: relative;
+  text-decoration: none;
 
   /* Appearances */
 

package/dist/components/Card.d.ts

@@ -1,5 +1,11 @@
 import { WithColorScheme } from '../types.js';
 export interface BaseCardProps extends WithColorScheme {
+    /**
+     * HTML tag to render.
+     *
+     * @default 'div'
+     */
+    tag?: 'div' | 'header' | 'ul' | 'ol' | 'dl' | 'section' | 'article';
     onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;
     /**
      * The size of the card.
@@ -15,5 +21,5 @@ export interface BaseCardProps extends WithColorScheme {
     bgLevel?: 300 | 400 | 500 | 600;
 }
 export type CardProps = React.JSX.IntrinsicElements['div'] & BaseCardProps;
-export declare const Card: ({ onClick, size, bgLevel, className, children, ...props }: CardProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Card: ({ tag, onClick, size, bgLevel, className, children, ...props }: CardProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Card.d.ts.map

package/dist/components/Card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../src/components/Card.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAG1C,MAAM,WAAW,aAAc,SAAQ,eAAe;IACpD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAC5D;;;;OAIG;IACH,IAAI,CAAC,EAAE,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;IACxD;;;;OAIG;IACH,OAAO,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;CACjC;AAED,MAAM,MAAM,SAAS,GAAG,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,GAAG,aAAa,CAAA;AAE1E,eAAO,MAAM,IAAI,GAAI,2DAA2D,SAAS,4CASxF,CAAA"}
+{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../src/components/Card.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAG1C,MAAM,WAAW,aAAc,SAAQ,eAAe;IACpD;;;;OAIG;IACH,GAAG,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,SAAS,GAAG,SAAS,CAAC;IACpE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAC5D;;;;OAIG;IACH,IAAI,CAAC,EAAE,KAAK,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;IACxD;;;;OAIG;IACH,OAAO,CAAC,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;CACjC;AAED,MAAM,MAAM,SAAS,GAAG,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,KAAK,CAAC,GAAG,aAAa,CAAA;AAE1E,eAAO,MAAM,IAAI,GAAI,gEAAwE,SAAS,4CASrG,CAAA"}

package/dist/components/Card.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { listToClass } from '@stack-spot/portal-theme';
 import { CitricComponent } from './CitricComponent.js';
-export const Card = ({ onClick, size, bgLevel, className, children, ...props }) => (_jsx(CitricComponent, { tag: "div", component: "card", className: listToClass([onClick && 'clickable', size, bgLevel && `bg-${bgLevel}`, className]), ...props, children: children }));
+export const Card = ({ tag = 'div', onClick, size, bgLevel, className, children, ...props }) => (_jsx(CitricComponent, { tag: tag, component: "card", className: listToClass([onClick && 'clickable', size, bgLevel && `bg-${bgLevel}`, className]), ...props, children: children }));
 //# sourceMappingURL=Card.js.map

package/dist/components/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../src/components/Card.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAEtD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAoBnD,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAa,EAAE,EAAE,CAAC,CAC5F,KAAC,eAAe,IACd,GAAG,EAAC,KAAK,EACT,SAAS,EAAC,MAAM,EAChB,SAAS,EAAE,WAAW,CAAC,CAAC,OAAO,IAAI,WAAW,EAAE,IAAI,EAAE,OAAO,IAAI,MAAM,OAAO,EAAE,EAAE,SAAS,CAAC,CAAC,KACzF,KAAK,YAER,QAAQ,GACO,CACnB,CAAA"}
+{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../src/components/Card.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAEtD,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AA0BnD,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,EAAE,GAAG,GAAG,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAa,EAAE,EAAE,CAAC,CACzG,KAAC,eAAe,IACd,GAAG,EAAE,GAAG,EACR,SAAS,EAAC,MAAM,EAChB,SAAS,EAAE,WAAW,CAAC,CAAC,OAAO,IAAI,WAAW,EAAE,IAAI,EAAE,OAAO,IAAI,MAAM,OAAO,EAAE,EAAE,SAAS,CAAC,CAAC,KACzF,KAAK,YAER,QAAQ,GACO,CACnB,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stack-spot/citric-react",
-  "version": "0.5.0",
+  "version": "0.6.0",
   "author": "StackSpot",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",

package/src/components/Card.tsx

@@ -3,6 +3,12 @@ import { WithColorScheme } from '../types'
 import { CitricComponent } from './CitricComponent'
 
 export interface BaseCardProps extends WithColorScheme {
+  /**
+   * HTML tag to render.
+   * 
+   * @default 'div'
+   */
+  tag?: 'div' | 'header' | 'ul' | 'ol' | 'dl' | 'section' | 'article',
   onClick?: (event: React.MouseEvent<HTMLDivElement>) => void,
   /**
    * The size of the card.
@@ -20,9 +26,9 @@ export interface BaseCardProps extends WithColorScheme {
 
 export type CardProps = React.JSX.IntrinsicElements['div'] & BaseCardProps
 
-export const Card = ({ onClick, size, bgLevel, className, children, ...props }: CardProps) => (
+export const Card = ({ tag = 'div', onClick, size, bgLevel, className, children, ...props }: CardProps) => (
   <CitricComponent
-    tag="div"
+    tag={tag}
     component="card"
     className={listToClass([onClick && 'clickable', size, bgLevel && `bg-${bgLevel}`, className])}
     {...props}