@phillips/seldon 1.8.0 → 1.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +5 -0
- package/package.json +2 -2
package/dist/index.cjs
ADDED
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
"use strict";var me=Object.defineProperty;var xe=(n,s,o)=>s in n?me(n,s,{enumerable:!0,configurable:!0,writable:!0,value:o}):n[s]=o;var B=(n,s,o)=>(xe(n,typeof s!="symbol"?s+"":s,o),o);Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),fe=require("react");function be(n){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(n){for(const o in n)if(o!=="default"){const h=Object.getOwnPropertyDescriptor(n,o);Object.defineProperty(s,o,h.get?h:{enumerable:!0,get:()=>n[o]})}}return s.default=n,Object.freeze(s)}const i=be(fe);function je(n){return n&&n.__esModule&&Object.prototype.hasOwnProperty.call(n,"default")?n.default:n}var W={exports:{}};/*!
|
|
2
|
+
Copyright (c) 2018 Jed Watson.
|
|
3
|
+
Licensed under the MIT License (MIT), see
|
|
4
|
+
http://jedwatson.github.io/classnames
|
|
5
|
+
*/(function(n){(function(){var s={}.hasOwnProperty;function o(){for(var h=[],p=0;p<arguments.length;p++){var u=arguments[p];if(u){var m=typeof u;if(m==="string"||m==="number")h.push(u);else if(Array.isArray(u)){if(u.length){var x=o.apply(null,u);x&&h.push(x)}}else if(m==="object"){if(u.toString!==Object.prototype.toString&&!u.toString.toString().includes("[native code]")){h.push(u.toString());continue}for(var r in u)s.call(u,r)&&u[r]&&h.push(r)}}}return h.join(" ")}n.exports?(o.default=o,n.exports=o):window.classNames=o})()})(W);var ge=W.exports;const S=je(ge),c="phillips";function Y({disabled:n=!1,id:s,invalid:o=!1,invalidText:h="invalid",readOnly:p=!1,type:u,warn:m=!1,warnText:x}){const r={disabled:!p&&n,invalid:!p&&!n&&o,invalidId:`${s}-error-msg`,type:u==="toggle"?"checkbox":u,warn:!p&&!n&&!o&&m,warnId:`${s}-warn-msg`,validation:null};return r.invalid&&(r.validation=e.jsx("div",{className:`${c}-input__validation ${c}-${u}-input--invalid`,id:r.invalidId,children:h})),r.warn&&(r.validation=e.jsx("div",{className:`${c}-input__validation ${c}-${u}-input--warn`,id:r.warnId,children:x})),r}const N=({buttonType:n="primary",size:s="md",children:o,iconLast:h=!1,id:p,...u})=>e.jsx("button",{"data-testid":p?`button-${p}`:"button",id:p,type:"button",className:S(`${c}-button`,`${c}-button--${s}`,`${c}-button--${n}`,{[`${c}-button--icon-last`]:h}),...u,children:o});class G extends i.Component{constructor(){super(...arguments);B(this,"state",{hasError:!1})}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(o,h){var p;(p=this.props)==null||p.logger(o,h.componentStack)}render(){return this.state.hasError?this.props.fallback||e.jsx("h2",{children:"Sorry... An error occurred and we are looking into it"}):this.props.children}}B(G,"defaultProps",{logger:console.log});const J=({user:n,onLogin:s,onLogout:o,onCreateAccount:h})=>e.jsx("header",{children:e.jsxs("div",{className:"storybook-header",children:[e.jsxs("div",{children:[e.jsx("svg",{width:"32",height:"32",viewBox:"0 0 32 32",xmlns:"http://www.w3.org/2000/svg",children:e.jsxs("g",{fill:"none",fillRule:"evenodd",children:[e.jsx("path",{d:"M10 0h12a10 10 0 0110 10v12a10 10 0 01-10 10H10A10 10 0 010 22V10A10 10 0 0110 0z",fill:"#FFF"}),e.jsx("path",{d:"M5.3 10.6l10.4 6v11.1l-10.4-6v-11zm11.4-6.2l9.7 5.5-9.7 5.6V4.4z",fill:"#555AB9"}),e.jsx("path",{d:"M27.2 10.6v11.2l-10.5 6V16.5l10.5-6zM15.7 4.4v11L6 10l9.7-5.5z",fill:"#91BAF8"})]})}),e.jsx("h1",{children:"Acme"})]}),e.jsx("div",{children:n?e.jsxs(e.Fragment,{children:[e.jsxs("span",{className:"welcome",children:["Welcome, ",e.jsx("b",{children:n.name}),"!"]}),e.jsx(N,{size:"sm",onClick:o,children:"Log out"})]}):e.jsxs(e.Fragment,{children:[e.jsx(N,{size:"sm",onClick:s,children:"Log in"}),e.jsx(N,{size:"sm",onClick:h,children:"Sign up"})]})})]})}),D=`${c}-hero-banner`,we=({prehead:n,date:s,headerText:o,subHeadText:h,association:p,background:u,id:m})=>e.jsx("header",{"data-testid":m?`hero-banner-${m}`:"hero-banner",id:m,className:D,style:{"--background":u},children:e.jsxs("span",{className:`${D}__content-wrapper`,children:[n||s?e.jsxs("p",{className:`${D}__pre-head`,children:[n?e.jsx("span",{children:n}):null,s?e.jsx("span",{children:s}):null]}):null,e.jsxs("h1",{className:`${D}__heading`,children:[o,h?e.jsx("span",{children:h}):null]}),p?e.jsx("p",{children:p}):null]})}),w=i.forwardRef(({className:n,defaultValue:s,disabled:o,hideLabel:h,id:p,inline:u,invalid:m,invalidText:x,labelText:r,onChange:t,onClick:b,placeholder:f,readOnly:l,size:_="md",type:T="text",value:j,warn:g,warnText:z,...y},d)=>{const a=Y({disabled:o,id:p,invalid:m,invalidText:x,readOnly:l,type:T,warn:g,warnText:z}),$=S(`${c}-${T}-input`,`${c}-input`,`${c}-input--${_}`,{[`${c}-input--inline`]:u,[`${c}-input--readonly`]:l,[`${c}-input--disabled`]:a.disabled,[`${c}-input--invalid`]:a.invalid,[`${c}-input--warn`]:a.warn,[`${n}__wrapper`]:n,[`${c}-input--hidden`]:y.hidden});return e.jsxs("div",{className:$,children:[e.jsx("label",{htmlFor:p,className:S(`${c}-input__label`,{[`${c}-input__label--hidden`]:h}),children:r}),e.jsx("input",{className:S(`${c}-input__input`,{className:n}),"data-testid":p,defaultValue:s,disabled:a.disabled,id:p,name:y.name,onChange:t,onClick:b,placeholder:f,readOnly:l,ref:d,type:a.type,value:j,...y}),a.validation]})});w.displayName="Input";const $e=i.forwardRef(({children:n,className:s,defaultValue:o,disabled:h,hideLabel:p,id:u,inline:m,invalid:x,invalidText:r,labelText:t,onChange:b,onClick:f,readOnly:l,size:_="md",value:T,warn:j,warnText:g,...z},y)=>{const d="select",a=Y({disabled:h,id:u,invalid:x,invalidText:r,readOnly:l,type:d,warn:j,warnText:g}),$=S(`${c}-${d}-input`,`${c}-input`,`${c}-input--${_}`,{[`${c}-input--inline`]:m,[`${c}-input--readonly`]:l,[`${c}-input--disabled`]:a.disabled,[`${c}-input--invalid`]:a.invalid,[`${c}-input--warn`]:a.warn,[`${s}__wrapper`]:s});return e.jsxs("div",{className:$,children:[e.jsx("label",{htmlFor:u,className:S(`${c}-input__label`,{[`${c}-input__label--hidden`]:p}),children:t}),e.jsx("select",{className:S(`${c}-input__input`,{className:s}),"data-testid":u,defaultValue:o,disabled:a.disabled,id:u,onChange:b,onClick:f,ref:y,value:T,...z,children:n}),a.validation]})}),v=`${c}-viewings-list-card-form`,ie=({address1:n,address1Label:s="Address ('432 Park Ave', ETC)",addressUrl:o,addressUrlLabel:h="URL for map link ('http://www.website.com')",address2:p,address2Label:u="City, State, Zip ('New York, NY 10019')",address3:m,address3Label:x="Country (United States)",id:r,invalidFields:t,previewDates:b,previewDatesLabel:f="Date(s)",previewHours1:l,previewHours1Label:_="Hours1",previewHours2:T,previewHours2Label:j="Hours2",previewLabel:g="Label ('Preview', 'Opening NIght', etc)",previewLabelValue:z,previewOn:y="false",previewToggleLabel:d="Preview/ Reception",viewingLabel:a="Label ('Open to public')",viewingLabelValue:$,viewingDates:H,viewingDatesLabel:E="Date(s)",viewingHours1:A,viewingHours1Label:P="Hours1",viewingHours2:I,viewingHours2Label:R="Hours2"})=>{const[k,O]=i.useState(y==="true");return i.useEffect(()=>{O(y==="true")},[y]),e.jsxs(e.Fragment,{children:[e.jsx(w,{id:`previewOn-${r}`,type:"toggle",labelText:d,size:"md",defaultChecked:k,inline:!0,invalid:t==null?void 0:t.previewOn,invalidText:t==null?void 0:t.previewOn,value:!0,name:"previewOn",onChange:()=>O(U=>!U)}),k?null:e.jsx("input",{type:"hidden",name:"previewOn",value:"false"}),e.jsxs("div",{className:S(`${v}__preview-set`,{[`${v}__preview-set--hidden`]:!k}),children:[e.jsx(w,{id:`previewLabel-${r}`,name:"previewLabelValue",defaultValue:z,labelText:g,size:"sm",invalid:t==null?void 0:t.previewLabelValue,invalidText:t==null?void 0:t.previewLabelValue,hidden:!k}),e.jsx(w,{id:`previewDates-${r}`,name:"previewDates",defaultValue:b,labelText:f,size:"sm",invalid:t==null?void 0:t.previewDates,invalidText:t==null?void 0:t.previewDates,hidden:!k}),e.jsx(w,{id:`previewHours1-${r}`,name:"previewHours1",defaultValue:l,labelText:_,size:"sm",invalid:t==null?void 0:t.previewHours1,invalidText:t==null?void 0:t.previewHours1,hidden:!k}),e.jsx(w,{id:`previewHours2-${r}`,name:"previewHours2",defaultValue:T,labelText:j,size:"sm",invalid:t==null?void 0:t.previewHours2,invalidText:t==null?void 0:t.previewHours2,hidden:!k})]}),e.jsx(w,{id:`viewingLabel-${r}`,name:"viewingLabelValue",defaultValue:$,labelText:a,size:"sm",invalid:t==null?void 0:t.viewingLabelValue,invalidText:t==null?void 0:t.viewingLabelValue}),e.jsx(w,{id:`viewingDates-${r}`,name:"viewingDates",defaultValue:H,labelText:E,size:"sm",invalid:t==null?void 0:t.viewingDates,invalidText:t==null?void 0:t.viewingDates}),e.jsx(w,{id:`viewingHours1-${r}`,name:"viewingHours1",defaultValue:A,labelText:P,size:"sm",invalid:t==null?void 0:t.viewingHours1,invalidText:t==null?void 0:t.viewingHours1}),e.jsx(w,{id:`viewingHours2-${r}`,name:"viewingHours2",defaultValue:I,labelText:R,size:"sm",invalid:t==null?void 0:t.viewingHours2,invalidText:t==null?void 0:t.viewingHours2}),e.jsx(w,{id:`address1-${r}`,name:"address1",defaultValue:n,labelText:s,size:"sm",invalid:t==null?void 0:t.address1,invalidText:t==null?void 0:t.address1}),e.jsx(w,{id:`address2-${r}`,name:"address2",defaultValue:p,labelText:u,size:"sm",invalid:t==null?void 0:t.address2,invalidText:t==null?void 0:t.address2}),e.jsx(w,{id:`address3-${r}`,name:"address3",defaultValue:m,labelText:x,size:"sm",invalid:t==null?void 0:t.address3,invalidText:t==null?void 0:t.address3}),e.jsx(w,{id:`addressUrl-${r}`,name:"addressUrl",defaultValue:o,labelText:h,size:"sm",type:"url",invalid:t==null?void 0:t.addressUrl,invalidText:t==null?void 0:t.addressUrl})]})},L=`${c}-viewings-list-card`,ye=({address1:n,address1Label:s,addressUrl:o,addressUrlLabel:h,address2:p,address2Label:u,address3:m,address3Label:x,cancelBtnLabel:r="CANCEL",cardTitle:t="Add New Viewing",deleteBtnLabel:b="DELETE",editBtnLabel:f="EDIT",editState:l,enableOnSite:_="false",enableOnSiteToggleLabel:T="Enabled on website",id:j,invalidFields:g,location:z,locationLabel:y="Location",onCancel:d,onEdit:a,onDelete:$,onSave:H,previewDates:E,previewDatesLabel:A,previewHours1:P,previewHours1Label:I,previewHours2:R,previewHours2Label:k,previewLabel:O,previewLabelValue:U,previewOn:K,previewToggleLabel:Q,saveBtnLabel:X="SAVE DETAILS",viewingLabel:F,viewingLabelValue:ee,viewingDates:te,viewingDatesLabel:ne,viewingHours1:se,viewingHours1Label:re,viewingHours2:oe,viewingHours2Label:ae})=>{const[ce,ue]=i.useState(_==="true"),C=i.useRef(null);i.useEffect(()=>{l&&C.current&&C.current.focus()},[l]),i.useEffect(()=>{var V,M;g&&C.current&&((M=(V=C.current.closest(".phillips-viewings-list-card"))==null?void 0:V.querySelector(".phillips-input--invalid input"))==null||M.focus())},[g]);const pe=()=>{typeof d=="function"&&d()},he=()=>{typeof a=="function"&&a()},le=V=>{typeof H=="function"&&H(V)};return e.jsxs("section",{"data-testid":`viewings-list-card-${j}`,id:j,className:S(`${L}`,{[`${L}--edit-state`]:l}),children:[e.jsx("h3",{className:`${L}__title`,children:t}),e.jsx("input",{type:"hidden",name:"id",value:j}),e.jsx(w,{ref:C,id:`location-${j}`,defaultValue:z,labelText:y,size:"sm",name:"location",invalid:g==null?void 0:g.location,invalidText:g==null?void 0:g.location,readOnly:!l}),l?e.jsx(ie,{address1:n,address1Label:s,addressUrl:o,addressUrlLabel:h,address2:p,address2Label:u,address3:m,address3Label:x,id:j,invalidFields:g,previewDates:E,previewDatesLabel:A,previewHours1:P,previewHours1Label:I,previewHours2:R,previewHours2Label:k,previewLabel:O,previewLabelValue:U,previewOn:K,previewToggleLabel:Q,viewingLabel:F,viewingLabelValue:ee,viewingDates:te,viewingDatesLabel:ne,viewingHours1:se,viewingHours1Label:re,viewingHours2:oe,viewingHours2Label:ae}):null,e.jsx(w,{id:`enableOnSite-${j}`,type:"toggle",defaultChecked:_==="true",labelText:T,size:"md",inline:!0,value:"true",name:"enableOnSite",onChange:()=>ue(V=>!V),readOnly:!l}),ce?null:e.jsx("input",{type:"hidden",name:"enableOnSite",value:"false"}),e.jsx("hr",{}),e.jsx("div",{className:`${L}__btn-group ${c}-button__group`,children:l?e.jsxs(e.Fragment,{children:[e.jsx(N,{id:`vlc-save-btn-${j}`,buttonType:"ghost",type:"submit",size:"sm",onClick:le,children:X}),e.jsx(N,{id:`vlc-cancel-btn-${j}`,buttonType:"ghost",type:"button",size:"sm",onClick:pe,children:r})]}):e.jsxs(e.Fragment,{children:[e.jsx(N,{id:`vlc-edit-btn-${j}`,buttonType:"ghost",type:"button",size:"sm",onClick:he,children:f}),e.jsx(N,{id:`vlc-delete-btn-${j}`,buttonType:"ghost",type:"button",size:"sm",onClick:()=>typeof $=="function"&&$(j),children:b})]})})]})},q=()=>Math.floor(Math.random()*100)+Date.now(),Z=({cardTitle:n="Viewing Details",id:s,i18n:o={},onAdd:h,onDelete:p,onSave:u,title:m,viewings:x})=>{const[r,t]=i.useState(x),[b,f]=i.useState(""),[l,_]=i.useState();i.useEffect(()=>{t(x)},[x]);const{addViewingsBtnLabel:T="ADD VIEWINGS"}=o,j=()=>{const a=`${q()}${r?"-"+r.length:""}`;f(a),_(a),h&&h(a)},g=a=>{f(""),typeof p=="function"&&p(a)},z=a=>{f(a),_(r==null?void 0:r.find($=>$.id===a))},y=a=>{u(a)&&f("")},d=()=>{typeof l=="string"?typeof p=="function"&&p(l):b===(l==null?void 0:l.id)&&t(a=>a==null?void 0:a.map($=>$.id===l.id?l:$)),f("")};return e.jsxs("div",{className:S(`${c}-viewings-list`),id:s,children:[e.jsx("h2",{className:S(`${c}-viewings-list__title`),children:m}),r==null?void 0:r.map((a,$)=>e.jsx(ye,{...a,...o,cardTitle:a.location?`${n} ${$+1}`:void 0,editState:b===a.id,onCancel:d,onDelete:g,onEdit:()=>z(a.id),onSave:y},`${a.id}`)),e.jsx(N,{id:`viewings-list-add-btn-${s||q()}`,size:"sm",onClick:j,children:T})]},b)},_e=({defaultViewing:n,i18n:s,validate:o=()=>{},onDelete:h=()=>{},onSave:p,...u})=>{const[m,x]=i.useState(n),r=b=>{x(f=>f==null?void 0:f.filter(l=>l.id!==b)),h(b)},t=b=>{x(f=>f?[...f,{id:b}]:[{id:b}])};return e.jsx(Z,{...u,i18n:s,viewings:m,onDelete:r,onAdd:t,onSave:b=>p(b,x,o)})},de=()=>{const[n,s]=i.useState();return e.jsxs("article",{children:[e.jsx(J,{user:n,onLogin:()=>s({name:"Jane Doe"}),onLogout:()=>s(void 0),onCreateAccount:()=>s({name:"Jane Doe"})}),e.jsxs("section",{className:"storybook-page",children:[e.jsx("h2",{children:"Pages in Storybook"}),e.jsxs("p",{children:["We recommend building UIs with a"," ",e.jsx("a",{href:"https://componentdriven.org",target:"_blank",rel:"noopener noreferrer",children:e.jsx("strong",{children:"component-driven"})})," ","process starting with atomic components and ending with pages."]}),e.jsx("p",{children:"Render pages with mock data. This makes it easy to build and review page states without needing to navigate to them in your app. Here are some handy patterns for managing page data in Storybook:"}),e.jsxs("ul",{children:[e.jsx("li",{children:'Use a higher-level connected component. Storybook helps you compose such data from the "args" of child component stories'}),e.jsx("li",{children:"Assemble data in the page component from your services. You can mock these services out using Storybook."})]}),e.jsxs("p",{children:["Get a guided tutorial on component-driven development at"," ",e.jsx("a",{href:"https://storybook.js.org/tutorials/",target:"_blank",rel:"noopener noreferrer",children:"Storybook tutorials"}),". Read more in the"," ",e.jsx("a",{href:"https://storybook.js.org/docs",target:"_blank",rel:"noopener noreferrer",children:"docs"}),"."]}),e.jsxs("div",{className:"tip-wrapper",children:[e.jsx("span",{className:"tip",children:"Tip"})," Adjust the width of the canvas with the"," ",e.jsx("svg",{width:"10",height:"10",viewBox:"0 0 12 12",xmlns:"http://www.w3.org/2000/svg",children:e.jsx("g",{fill:"none",fillRule:"evenodd",children:e.jsx("path",{d:"M1.5 5.2h4.8c.3 0 .5.2.5.4v5.1c-.1.2-.3.3-.4.3H1.4a.5.5 0 01-.5-.4V5.7c0-.3.2-.5.5-.5zm0-2.1h6.9c.3 0 .5.2.5.4v7a.5.5 0 01-1 0V4H1.5a.5.5 0 010-1zm0-2.1h9c.3 0 .5.2.5.4v9.1a.5.5 0 01-1 0V2H1.5a.5.5 0 010-1zm4.3 5.2H2V10h3.8V6.2z",id:"a",fill:"#999"})})}),"Viewports addon in the toolbar"]})]})]})};exports.Button=N;exports.ErrorBoundary=G;exports.Header=J;exports.HeroBanner=we;exports.Input=w;exports.Page=de;exports.Select=$e;exports.StatefulViewingsList=_e;exports.ViewingsList=Z;
|