@samvera/nectar-iiif - npm Package Compare versions

Comparing version 0.0.5-alpha.5 to 0.0.5

dist/index.cjs.js

@@ -1,2 +0,2 @@
-var A=Object.create;var u=Object.defineProperty;var H=Object.getOwnPropertyDescriptor;var V=Object.getOwnPropertyNames;var M=Object.getPrototypeOf,j=Object.prototype.hasOwnProperty;var q=(r,t)=>{for(var e in t)u(r,e,{get:t[e],enumerable:!0})},N=(r,t,e,a)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of V(t))!j.call(r,o)&&o!==e&&u(r,o,{get:()=>t[o],enumerable:!(a=H(t,o))||a.enumerable});return r};var i=(r,t,e)=>(e=r!=null?A(M(r)):{},N(t||!r||!r.__esModule?u(e,"default",{value:r,enumerable:!0}):e,r)),R=r=>N(u({},"__esModule",{value:!0}),r);var J={};q(J,{Homepage:()=>S,Label:()=>m,Metadata:()=>G,RequiredStatement:()=>v,Summary:()=>F,Value:()=>s});module.exports=R(J);var l=i(require("react")),y=require("@stitches/react");var f=(r,t="none")=>{var a;if(!r)return null;if(typeof r=="string")return[r];if(!r[t]){let o=Object.getOwnPropertyNames(r);if(o.length>0)return(a=r[o[0]])==null?void 0:a.join(", ")}return!r[t]||!Array.isArray(r[t])?null:r[t].join(", ")};var h=(0,y.styled)("div",{}),k=(0,y.styled)("span",{}),I=({as:r="div",children:t,homepage:e,language:a="none"})=>{let o="span";return r!=="div"&&(o="li"),l.default.createElement(h,{as:r},e.map(g=>l.default.createElement(k,{as:o,key:g.id},l.default.createElement("a",{href:g.id},t||f(g.label,a)))))},S=I;var L=i(require("react")),b=require("@stitches/react");var O=(0,b.styled)("span",{}),w=({as:r="span",label:t,language:e="none"})=>L.default.createElement(O,{as:r},f(t,e)),m=w;var n=i(require("react"));var d=i(require("react"));var x=i(require("react"));var P=({as:r="dd",language:t,value:e})=>x.default.createElement(m,{label:e,as:r,language:t}),s=P;var z=({item:r,language:t})=>{let{label:e,value:a}=r;return d.default.createElement("div",{role:"group"},d.default.createElement(m,{as:"dt",label:e,language:t}),d.default.createElement(s,{as:"dd",value:a,language:t}))},c=z;var B=({language:r,metadata:t,title:e})=>Array.isArray(t)?n.default.createElement(n.default.Fragment,null,t.length>0&&n.default.createElement("dl",{title:e},t.map((a,o)=>n.default.createElement(c,{item:a,key:o,language:r})))):n.default.createElement(n.default.Fragment,null),G=B;var p=i(require("react"));var D=({language:r,requiredStatement:t})=>t?p.default.createElement("dl",null,p.default.createElement(c,{item:t,language:r})):p.default.createElement(p.default.Fragment,null),v=D;var C=i(require("react"));var E=({as:r="p",language:t,summary:e})=>C.default.createElement(m,{as:r,label:e,language:t}),F=E;
+var M=Object.create;var g=Object.defineProperty;var V=Object.getOwnPropertyDescriptor;var q=Object.getOwnPropertyNames;var O=Object.getPrototypeOf,P=Object.prototype.hasOwnProperty;var z=(e,r)=>{for(var t in r)g(e,t,{get:r[t],enumerable:!0})},I=(e,r,t,a)=>{if(r&&typeof r=="object"||typeof r=="function")for(let o of q(r))!P.call(e,o)&&o!==t&&g(e,o,{get:()=>r[o],enumerable:!(a=V(r,o))||a.enumerable});return e};var n=(e,r,t)=>(t=e!=null?M(O(e)):{},I(r||!e||!e.__esModule?g(t,"default",{value:e,enumerable:!0}):t,e)),B=e=>I(g({},"__esModule",{value:!0}),e);var ae={};z(ae,{Homepage:()=>h,Label:()=>s,Metadata:()=>R,RequiredStatement:()=>G,Summary:()=>C,Thumbnail:()=>w,Value:()=>b});module.exports=B(ae);var y=n(require("react")),S=require("@stitches/react");var p=(e,r="none")=>{var a;if(!e)return null;if(typeof e=="string")return[e];if(!e[r]){let o=Object.getOwnPropertyNames(e);if(o.length>0)return(a=e[o[0]])==null?void 0:a.join(", ")}return!e[r]||!Array.isArray(e[r])?null:e[r].join(", ")};var D=(0,S.styled)("div",{}),J=(0,S.styled)("span",{}),K=({as:e="div",children:r,homepage:t,language:a="none"})=>{let o="span";return e!=="div"&&(o="li"),y.default.createElement(D,{as:e,"data-testid":"nectar-homepage"},t.map(i=>{let l=p(i.label,a);return y.default.createElement(J,{as:o,key:i.id},y.default.createElement("a",{href:i.id,"aria-label":l},r||l))}))},h=K;var v=n(require("react")),L=require("@stitches/react");var Q=(0,L.styled)("span",{}),U=({as:e="span",label:r,language:t="none"})=>v.default.createElement(Q,{as:e},p(r,t)),s=U;var u=n(require("react"));var x=n(require("react"));var F=n(require("react"));var X=({as:e="dd",language:r,value:t})=>F.default.createElement(s,{label:t,as:e,language:r}),b=X;var Y=({item:e,language:r})=>{let{label:t,value:a}=e;return x.default.createElement("div",{role:"group"},x.default.createElement(s,{as:"dt",label:t,language:r}),x.default.createElement(b,{as:"dd",value:a,language:r}))},N=Y;var Z=({language:e,metadata:r,title:t})=>Array.isArray(r)?u.default.createElement(u.default.Fragment,null,r.length>0&&u.default.createElement("dl",{title:t},r.map((a,o)=>u.default.createElement(N,{item:a,key:o,language:e})))):u.default.createElement(u.default.Fragment,null),R=Z;var c=n(require("react"));var _=({language:e,requiredStatement:r})=>r?c.default.createElement("dl",null,c.default.createElement(N,{item:r,language:e})):c.default.createElement(c.default.Fragment,null),G=_;var A=n(require("react"));var ee=({as:e="p",language:r,summary:t})=>A.default.createElement(s,{as:e,label:t,language:r}),C=ee;var d=n(require("react")),T=require("@stitches/react");var m=n(require("react")),W=n(require("clsx")),j=require("@stitches/react");var E=(e,r="200,",t="full")=>{Array.isArray(e)&&(e=e[0]);let{id:a,service:o}=e,i;if(!o)return a;if(Array.isArray(e.service)&&e.service.length>0&&(i=o[0]),i){if(i["@id"])return`${i["@id"]}/${t}/${r}/0/default.jpg`;if(i.id)return`${i.id}/${t}/${r}/0/default.jpg`}};var $=(0,j.styled)("img",{width:"100%",height:"100%",transition:"all 1s cubic-bezier(0.16, 1, 0.3, 1)",opacity:0,["&.loaded"]:{opacity:1}}),re=({alt:e,resource:r,objectFit:t})=>{let[a,o]=(0,m.useState)(!1),i=(0,m.useRef)(null);(0,m.useEffect)(()=>{i.current&&i.current.complete&&o(!0)},[]);let{type:l,id:f}=r;switch(l){case"Image":let k=E(r);return m.default.createElement($,{alt:e,src:k,ref:i,as:"img",key:f,style:{objectFit:t},onLoad:()=>o(!0),className:(0,W.default)("source",a&&"loaded")});case"Sound":return m.default.createElement($,{src:f,as:"video",key:f});default:return console.warn(`Resource type: ${l} is not valid or not yet supported in Nectar.`),m.default.createElement(m.default.Fragment,null)}},H=re;var te=(0,T.styled)("div",{}),oe=({altAsLabel:e,language:r,objectFit:t="cover",thumbnail:a})=>{let o=p(e,r);return d.default.createElement(d.default.Fragment,null,a.map(i=>{let{width:l,height:f}=i;return d.default.createElement(te,{style:{width:`${l}px`,height:`${f}px`,backgroundColor:"#c1c8cd"}},d.default.createElement(H,{alt:o,resource:i,objectFit:t}))}))},w=oe;
 //# sourceMappingURL=index.cjs.js.map

dist/index.d.ts

@@ -6,3 +6,4 @@ import Homepage from "components/Homepage/Homepage";
 import Summary from "components/Summary/Summary";
+import Thumbnail from "components/Thumbnail/Thumbnail";
 import Value from "components/Value/Value";
-export { Homepage, Label, Metadata, RequiredStatement, Summary, Value };
+export { Homepage, Label, Metadata, RequiredStatement, Summary, Thumbnail, Value, };

dist/index.esm.js

@@ -1,2 +0,2 @@
-import l from"react";import{styled as c}from"@stitches/react";var n=(r,t="none")=>{var o;if(!r)return null;if(typeof r=="string")return[r];if(!r[t]){let a=Object.getOwnPropertyNames(r);if(a.length>0)return(o=r[a[0]])==null?void 0:o.join(", ")}return!r[t]||!Array.isArray(r[t])?null:r[t].join(", ")};var g=c("div",{}),y=c("span",{}),N=({as:r="div",children:t,homepage:e,language:o="none"})=>{let a="span";return r!=="div"&&(a="li"),l.createElement(g,{as:r},e.map(f=>l.createElement(y,{as:a,key:f.id},l.createElement("a",{href:f.id},t||n(f.label,o)))))},S=N;import L from"react";import{styled as b}from"@stitches/react";var x=b("span",{}),G=({as:r="span",label:t,language:e="none"})=>L.createElement(x,{as:r},n(t,e)),m=G;import i from"react";import d from"react";import v from"react";var C=({as:r="dd",language:t,value:e})=>v.createElement(m,{label:e,as:r,language:t}),s=C;var F=({item:r,language:t})=>{let{label:e,value:o}=r;return d.createElement("div",{role:"group"},d.createElement(m,{as:"dt",label:e,language:t}),d.createElement(s,{as:"dd",value:o,language:t}))},p=F;var A=({language:r,metadata:t,title:e})=>Array.isArray(t)?i.createElement(i.Fragment,null,t.length>0&&i.createElement("dl",{title:e},t.map((o,a)=>i.createElement(p,{item:o,key:a,language:r})))):i.createElement(i.Fragment,null),H=A;import u from"react";var V=({language:r,requiredStatement:t})=>t?u.createElement("dl",null,u.createElement(p,{item:t,language:r})):u.createElement(u.Fragment,null),M=V;import j from"react";var q=({as:r="p",language:t,summary:e})=>j.createElement(m,{as:r,label:e,language:t}),R=q;export{S as Homepage,m as Label,H as Metadata,M as RequiredStatement,R as Summary,s as Value};
+import g from"react";import{styled as x}from"@stitches/react";var s=(e,r="none")=>{var i;if(!e)return null;if(typeof e=="string")return[e];if(!e[r]){let a=Object.getOwnPropertyNames(e);if(a.length>0)return(i=e[a[0]])==null?void 0:i.join(", ")}return!e[r]||!Array.isArray(e[r])?null:e[r].join(", ")};var v=x("div",{}),L=x("span",{}),F=({as:e="div",children:r,homepage:t,language:i="none"})=>{let a="span";return e!=="div"&&(a="li"),g.createElement(v,{as:e,"data-testid":"nectar-homepage"},t.map(o=>{let m=s(o.label,i);return g.createElement(L,{as:a,key:o.id},g.createElement("a",{href:o.id,"aria-label":m},r||m))}))},R=F;import G from"react";import{styled as A}from"@stitches/react";var C=A("span",{}),E=({as:e="span",label:r,language:t="none"})=>G.createElement(C,{as:e},s(r,t)),n=E;import l from"react";import b from"react";import $ from"react";var W=({as:e="dd",language:r,value:t})=>$.createElement(n,{label:t,as:e,language:r}),y=W;var j=({item:e,language:r})=>{let{label:t,value:i}=e;return b.createElement("div",{role:"group"},b.createElement(n,{as:"dt",label:t,language:r}),b.createElement(y,{as:"dd",value:i,language:r}))},p=j;var H=({language:e,metadata:r,title:t})=>Array.isArray(r)?l.createElement(l.Fragment,null,r.length>0&&l.createElement("dl",{title:t},r.map((i,a)=>l.createElement(p,{item:i,key:a,language:e})))):l.createElement(l.Fragment,null),T=H;import f from"react";var w=({language:e,requiredStatement:r})=>r?f.createElement("dl",null,f.createElement(p,{item:r,language:e})):f.createElement(f.Fragment,null),k=w;import M from"react";var V=({as:e="p",language:r,summary:t})=>M.createElement(n,{as:e,label:t,language:r}),q=V;import d from"react";import{styled as K}from"@stitches/react";import c,{useEffect as O,useRef as P,useState as z}from"react";import B from"clsx";import{styled as D}from"@stitches/react";var N=(e,r="200,",t="full")=>{Array.isArray(e)&&(e=e[0]);let{id:i,service:a}=e,o;if(!a)return i;if(Array.isArray(e.service)&&e.service.length>0&&(o=a[0]),o){if(o["@id"])return`${o["@id"]}/${t}/${r}/0/default.jpg`;if(o.id)return`${o.id}/${t}/${r}/0/default.jpg`}};var S=D("img",{width:"100%",height:"100%",transition:"all 1s cubic-bezier(0.16, 1, 0.3, 1)",opacity:0,["&.loaded"]:{opacity:1}}),J=({alt:e,resource:r,objectFit:t})=>{let[i,a]=z(!1),o=P(null);O(()=>{o.current&&o.current.complete&&a(!0)},[]);let{type:m,id:u}=r;switch(m){case"Image":let h=N(r);return c.createElement(S,{alt:e,src:h,ref:o,as:"img",key:u,style:{objectFit:t},onLoad:()=>a(!0),className:B("source",i&&"loaded")});case"Sound":return c.createElement(S,{src:u,as:"video",key:u});default:return console.warn(`Resource type: ${m} is not valid or not yet supported in Nectar.`),c.createElement(c.Fragment,null)}},I=J;var Q=K("div",{}),U=({altAsLabel:e,language:r,objectFit:t="cover",thumbnail:i})=>{let a=s(e,r);return d.createElement(d.Fragment,null,i.map(o=>{let{width:m,height:u}=o;return d.createElement(Q,{style:{width:`${m}px`,height:`${u}px`,backgroundColor:"#c1c8cd"}},d.createElement(I,{alt:a,resource:o,objectFit:t}))}))},X=U;export{R as Homepage,n as Label,T as Metadata,k as RequiredStatement,q as Summary,X as Thumbnail,y as Value};
 //# sourceMappingURL=index.esm.js.map

dist/types/nectar.d.ts

@@ -1,3 +0,8 @@
-import { InternationalString, MetadataItem } from "@iiif/presentation-3";
+import { IIIFExternalWebResource, InternationalString, MetadataItem } from "@iiif/presentation-3";
 import { ReactNode } from "react";
+export interface NectarExternalWebResource {
+    alt: string | undefined;
+    resource: IIIFExternalWebResource;
+    objectFit: "contain" | "cover" | "fill" | "none" | "scale-down";
+}
 export interface NectarGroup {
@@ -35,2 +40,8 @@ item: MetadataItem;
 }
+export interface NectarThumbnail {
+    altAsLabel: InternationalString;
+    language: string;
+    thumbnail: IIIFExternalWebResource[];
+    objectFit?: "contain" | "cover" | "fill" | "none" | "scale-down";
+}
 export interface NectarSummary {
@@ -37,0 +48,0 @@ as?: "span" | "p" | "label" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6";

package.json

 {
   "name": "@samvera/nectar-iiif",
-  "version": "0.0.5-alpha.5",
+  "version": "0.0.5",
   "description": "",
@@ -51,2 +51,3 @@ "main": "dist/index.cjs.js",
     "@types/react-dom": "^18.0.1",
+    "clsx": "^1.1.1",
     "react": "^18.0.0",
@@ -53,0 +54,0 @@ "react-dom": "^18.0.0"

README.md

 # Nectar IIIF
+
 ReactJS UI component library of IIIF Presentation API 3.0 property fluent primitives.
@@ -24,3 +25,2 @@
 
-
 <h2 id="basic-usage">Basic Usage</h2>
@@ -31,8 +31,3 @@
 ```jsx
-import {
-  Label,
-  Metadata,
-  RequiredStatement,
-  Summary
-} from "@samvera/nectar-iiif";
+import { Label, Summary } from "@samvera/nectar-iiif";
 ```
@@ -50,4 +45,2 @@
     <Summary summary={manifest.summary} as="p" />
-    <Metadata metadata={manifest.metadata} />
-    <RequiredStatement requiredStatement={manifest.requiredStatement} />
   </>
@@ -58,1 +51,85 @@ );
 ---
+
+## Primitives
+
+### Label
+
+#### Reference
+
+| Prop       | Type                                                                                                              | Default | Required           |
+| ---------- | ----------------------------------------------------------------------------------------------------------------- | ------- | ------------------ |
+| `as`       | ` span`, `h1`, `h2`, `h3`, `h4`, `h5`, `h6`, `p`, `label`, `dt`, `dd`                                             | `span`  | --                 |
+| `language` | string                                                                                                            | `none`  | --                 |
+| `label`    | [InternationalString](https://github.com/IIIF-Commons/presentation-3-types/blob/main/iiif/descriptive.d.ts#L6-L8) | --      | :white_check_mark: |
+
+#### Usage
+
+```jsx
+import { Label } from "@samvera/nectar-iiif";
+```
+
+```jsx
+return <Label label={manifest.label} as="h1" language="en" />;
+```
+
+### Summary
+
+#### Reference
+
+| Prop       | Type                                                                                                              | Default | Required           |
+| ---------- | ----------------------------------------------------------------------------------------------------------------- | ------- | ------------------ |
+| `as`       | ` span`, `h1`, `h2`, `h3`, `h4`, `h5`, `h6`, `p`                                                                  | `p`     | --                 |
+| `language` | string                                                                                                            | `none`  | --                 |
+| `summary`  | [InternationalString](https://github.com/IIIF-Commons/presentation-3-types/blob/main/iiif/descriptive.d.ts#L6-L8) | --      | :white_check_mark: |
+
+#### Usage
+
+```jsx
+import { Summary } from "@samvera/nectar-iiif";
+```
+
+```jsx
+return <Summary summary={manifest.summary} as="p" />;
+```
+
+### Metadata
+
+```jsx
+import { Metadata } from "@samvera/nectar-iiif";
+```
+
+```jsx
+return <Metadata metadata={manifest.metadata} />;
+```
+
+### Required Statement
+
+```jsx
+import { RequiredStatement } from "@samvera/nectar-iiif";
+```
+
+```jsx
+return <RequiredStatement requiredStatement={manifest.requiredStatement} />;
+```
+
+### Homepage
+
+```jsx
+import { Homepage } from "@samvera/nectar-iiif";
+```
+
+Wrap resource label with homepage id.
+
+```jsx
+return <Homepage homepage={manifest.homepage} />;
+```
+
+Wrap React children with homepage id.
+
+```jsx
+return (
+  <Homepage homepage={manifest.homepage}>
+    <figure>...</figure>
+  </Homepage>
+);
+```

No alert changes

Improved metrics

Total package byte prevSize

41448

increased by71.78%

Number of package files

21

increased by16.67%

Lines of code

139

increased by31.13%

Number of lines in readme file

132

increased by140%

Worsened metrics

Dependency count

7

increased by16.67%

Dependency changes

• + Addedclsx@^1.1.1

• + Addedclsx@1.2.1(transitive)