@usableapp/cardds 0.1.0

package/dist/actions/Link.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createElement } from 'react';
+import { cx } from '../cx';
+import { Icon } from '../type/Icon';
+/** Link — an inline text action big enough to tap (40px): "See all ↗" in a card head, "Skip" between pager buttons. */
+export function Link({ muted, icon, href, className, children, ...rest }) {
+    return createElement(href ? 'a' : 'button', { href, type: href ? undefined : 'button', className: cx('link', muted && 'link--muted', className), ...rest }, children, icon && _jsx(Icon, { name: icon, size: "xs" }));
+}

package/dist/actions/Segment.d.ts

@@ -0,0 +1,11 @@
+import type { ComponentPropsWithoutRef } from 'react';
+export interface SegmentProps extends ComponentPropsWithoutRef<'div'> {
+}
+/** Segment — a tab strip / day picker whose items share the width; children are SegmentItems. */
+export declare function Segment({ className, ...rest }: SegmentProps): import("react").JSX.Element;
+export interface SegmentItemProps extends ComponentPropsWithoutRef<'button'> {
+    /** the selected tab (filled) */
+    selected?: boolean;
+}
+/** SegmentItem — one tab in a Segment. */
+export declare function SegmentItem({ selected, className, ...rest }: SegmentItemProps): import("react").JSX.Element;

package/dist/actions/Segment.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cx } from '../cx';
+/** Segment — a tab strip / day picker whose items share the width; children are SegmentItems. */
+export function Segment({ className, ...rest }) {
+    return _jsx("div", { className: cx('segment', className), role: "tablist", ...rest });
+}
+/** SegmentItem — one tab in a Segment. */
+export function SegmentItem({ selected, className, ...rest }) {
+    return _jsx("button", { type: "button", role: "tab", "aria-selected": selected ? 'true' : undefined, className: cx('segment__item', className), ...rest });
+}