@webority/ui-react 0.56.0 → 0.57.0

package/dist/components/AppTimeline.js

@@ -1 +1 @@
-import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppIcon.js";import{jsx as r,jsxs as i}from"react/jsx-runtime";var a=[`feed`,`progress`],o=[`vertical`,`horizontal`],s=[`neutral`,`success`,`warning`,`danger`,`info`],c={done:`check`,current:`clock`,"on-hold":`lock`,rejected:`x`,cancelled:`minus`,skipped:`arrow-right`,upcoming:null};function l({items:l=[],variant:u=`feed`,orientation:d=`vertical`,size:f,className:p=``,style:m,...h}){t(`AppTimeline`,h),e(`AppTimeline`,`variant`,u,a),e(`AppTimeline`,`orientation`,d,o);for(let t of l)e(`AppTimeline`,`items[].tone`,t.tone,s),u===`progress`&&e(`AppTimeline`,`items[].status`,t.status,Object.keys(c));let g=u===`progress`,_=`timeline${g?` timeline--progress`:``}${d===`horizontal`?` timeline--horizontal`:``}${p?` ${p}`:``}`,v=typeof f==`number`&&f>0?f:void 0,y=v?Math.round(v*.54):g?13:12;return r(`ol`,{className:_,style:v?{...m,"--wui-timeline-dot":`${v}px`}:m,...h,children:l.map((e,t)=>{let a=g?e.status:void 0,o=a?` is-${a}`:``,s=e.tone&&e.tone!==`neutral`?` ${e.tone}`:``,l=g?e.icon??(a?c[a]:void 0):e.icon||`circle`;return i(`li`,{className:`timeline-item${o}${s}`,children:[r(`span`,{className:`timeline-dot`,children:l?r(n,{name:l,size:y}):null}),i(`div`,{className:`timeline-body`,children:[g?i(`div`,{className:`timeline-head`,children:[r(`div`,{className:`timeline-title`,children:e.title}),(e.at||e.time)&&i(`span`,{className:`timeline-when`,children:[e.at&&r(`span`,{className:`timeline-at`,children:e.at}),e.time&&r(`span`,{className:`timeline-time`,children:e.time})]})]}):r(`div`,{className:`timeline-title`,children:e.title}),e.description&&r(`div`,{className:`timeline-desc`,children:e.description}),!g&&(e.at||e.time||e.by)&&i(`div`,{className:`timeline-meta`,children:[(e.at||e.time)&&i(`span`,{className:`timeline-when`,children:[e.at&&r(`span`,{className:`timeline-at`,children:e.at}),e.time&&r(`span`,{className:`timeline-time`,children:e.time})]}),e.by&&r(`span`,{className:`timeline-by`,children:e.by})]}),g&&e.by&&r(`div`,{className:`timeline-meta`,children:r(`span`,{className:`timeline-by`,children:e.by})}),e.note&&r(`p`,{className:`timeline-note`,children:e.note})]})]},e.key??`${e.at}-${t}`)})})}export{l as default};
+import e from"./warnInvalidValue.js";import t from"./warnUnknownProps.js";import n from"./AppIcon.js";import{jsx as r,jsxs as i}from"react/jsx-runtime";var a=[`feed`,`progress`],o=[`vertical`,`horizontal`],s=[`neutral`,`success`,`warning`,`danger`,`info`],c={done:`check`,current:`clock`,"on-hold":`lock`,rejected:`x`,cancelled:`minus`,skipped:`arrow-right`,upcoming:null},l=e=>typeof e==`string`&&(/^https?:[/][/]/i.test(e)||e.startsWith(`/`)&&e[1]!==`/`&&e[1]!==`\\`)&&![...e].some(e=>e.charCodeAt(0)<=32||e.charCodeAt(0)===127);function u(e){if(!(e.byHref==null||e.byHref===``)){if(!l(e.byHref))throw Error(`<AppTimeline> items[].byHref must be a path starting with one '/', or an http:// or https:// address, with no spaces.`);if(!e.by)throw Error(`<AppTimeline> items[].byHref links the by name, so the item needs by.`)}}var d=e=>e.byHref?r(`a`,{className:`timeline-by-link`,href:e.byHref,children:e.by}):e.by;function f({items:l=[],variant:f=`feed`,orientation:p=`vertical`,size:m,className:h=``,style:g,..._}){t(`AppTimeline`,_),e(`AppTimeline`,`variant`,f,a),e(`AppTimeline`,`orientation`,p,o);for(let t of l)e(`AppTimeline`,`items[].tone`,t.tone,s),u(t),f===`progress`&&e(`AppTimeline`,`items[].status`,t.status,Object.keys(c));let v=f===`progress`,y=`timeline${v?` timeline--progress`:``}${p===`horizontal`?` timeline--horizontal`:``}${h?` ${h}`:``}`,b=typeof m==`number`&&m>0?m:void 0,x=b?Math.round(b*.54):v?13:12;return r(`ol`,{className:y,style:b?{...g,"--wui-timeline-dot":`${b}px`}:g,..._,children:l.map((e,t)=>{let a=v?e.status:void 0,o=a?` is-${a}`:``,s=e.tone&&e.tone!==`neutral`?` ${e.tone}`:``,l=v?e.icon??(a?c[a]:void 0):e.icon||`circle`;return i(`li`,{className:`timeline-item${o}${s}`,children:[r(`span`,{className:`timeline-dot`,children:l?r(n,{name:l,size:x}):null}),i(`div`,{className:`timeline-body`,children:[v?i(`div`,{className:`timeline-head`,children:[r(`div`,{className:`timeline-title`,children:e.title}),(e.at||e.time)&&i(`span`,{className:`timeline-when`,children:[e.at&&r(`span`,{className:`timeline-at`,children:e.at}),e.time&&r(`span`,{className:`timeline-time`,children:e.time})]})]}):r(`div`,{className:`timeline-title`,children:e.title}),e.description&&r(`div`,{className:`timeline-desc`,children:e.description}),!v&&(e.at||e.time||e.by)&&i(`div`,{className:`timeline-meta`,children:[(e.at||e.time)&&i(`span`,{className:`timeline-when`,children:[e.at&&r(`span`,{className:`timeline-at`,children:e.at}),e.time&&r(`span`,{className:`timeline-time`,children:e.time})]}),e.by&&r(`span`,{className:`timeline-by`,children:d(e)})]}),v&&e.by&&r(`div`,{className:`timeline-meta`,children:r(`span`,{className:`timeline-by`,children:d(e)})}),e.note&&r(`p`,{className:`timeline-note`,children:e.note})]})]},e.key??`${e.at}-${t}`)})})}export{f as default};

package/dist/types/components/AppTimeline.d.ts

@@ -20,12 +20,14 @@
  *   tone?: 'neutral'|'success'|'warning'|'danger'|'info',
  *   status?: 'upcoming'|'current'|'done'|'on-hold'|'rejected'|'cancelled'|'skipped',
  *   title: import('react').ReactNode, description?: import('react').ReactNode,
- *   at?: string, time?: string, by?: string, note?: string }[]} props.items
+ *   at?: string, time?: string, by?: string, byHref?: string, note?: string }[]} props.items
  *   Feed variant: newest first. Progress variant: first stage first.
  *   `status` drives the dot + rail in the progress variant; `description` is a
  *   plain inline subtext under the title (distinct from the boxed `note`).
  *   `at` is the date and `time` an optional time-of-day shown beside it — both are
  *   pre-formatted strings the caller owns (IST, DD-MMM-YYYY / HH:mm); pass either or both.
+ *   `byHref` links the `by` name (a path starting with one `/`, or an `http://` / `https://` address);
+ *   any other value, or `byHref` without `by`, throws.
  * @param {'feed'|'progress'} [props.variant] Layout mode. Defaults to `feed`.
  * @param {'vertical'|'horizontal'} [props.orientation] Rail direction — vertical (default) stacks
  *   items top-to-bottom; horizontal lays dots in a row with the body beneath each. Orthogonal to
@@ -47,6 +49,7 @@ export default function AppTimeline({ items, variant, orientation, size, classNa
         at?: string;
         time?: string;
         by?: string;
+        byHref?: string;
         note?: string;
     }[];
     variant?: 'feed' | 'progress';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webority/ui-react",
-  "version": "0.56.0",
+  "version": "0.57.0",
   "description": "Webority shared React component library — App* primitives on react-bootstrap + the @webority/theme design system.",
   "license": "SEE LICENSE IN LICENSE",
   "type": "module",
@@ -27,8 +27,8 @@
   },
   "sideEffects": false,
   "dependencies": {
-    "@webority/ui-elements": "0.56.0",
-    "@webority/theme": "0.56.0"
+    "@webority/theme": "0.57.0",
+    "@webority/ui-elements": "0.57.0"
   },
   "peerDependencies": {
     "@webority/analytics": "^0.21.0",