@abgov/react-components 4.14.0-alpha.3 → 4.14.0

package/lib/table/table.d.ts

@@ -19,7 +19,7 @@ export interface TableProps extends Margins {
     onSort?: (sortBy: string, sortDir: number) => void;
     variant?: TableVariant;
     testId?: string;
-    children: ReactNode;
+    children?: ReactNode;
 }
 export declare function GoATable(props: TableProps): JSX.Element;
 export default GoATable;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abgov/react-components",
-  "version": "4.14.0-alpha.3",
+  "version": "4.14.0",
   "description": "Government of Alberta - UI components for React",
   "bugs": {
     "url": "https://github.com/GovAlta/ui-components/issues"

package/react-components.esm.js

@@ -436,7 +436,7 @@ function getCoords(radians){const x=radius+pathRadius*Math.cos(radians);const y=
 {// Typescript recognizes `progress` as a number, but once compiled, due to it being a web component, progress is a string.
 // This line makes both sides happy.
 const p=parseFloat(progress+'');if(p>=0){_progress.set(p||1);// start at 1 to prevent incorrect arc calculations
-$$invalidate(2,type="progress");}}}if($$self.$$.dirty&/*size*/1024){$$invalidate(5,diameter=size&&{small:16,medium:32,large:64,xlarge:100}[size]);}if($$self.$$.dirty&/*size*/1024){$$invalidate(4,strokewidth=size&&{small:2,medium:4,large:7,xlarge:9}[size]);}if($$self.$$.dirty&/*diameter*/32){$$invalidate(3,radius=diameter/2);}if($$self.$$.dirty&/*radius, strokewidth*/24){$$invalidate(12,pathRadius=radius-strokewidth/2);}if($$self.$$.dirty&/*type, pathRadius, progress*/6148){$$invalidate(6,ready=type==="infinite"?pathRadius:pathRadius&&progress);}};return [invert,testid,type,radius,strokewidth,diameter,ready,$_progress,_progress,getArc,size,progress,pathRadius];}class Spinner extends SvelteElement{constructor(options){super();const style=document.createElement('style');style.textContent=`:host{box-sizing:border-box;font-family:var(--goa-font-family-sans)}@keyframes rotate{100%{transform:rotate(360deg)}}.spinner-infinite{animation:rotate 2s linear infinite}`;this.shadowRoot.appendChild(style);init(this,{target:this.shadowRoot,props:attribute_to_object(this.attributes),customElement:true},instance$i,create_fragment$l,safe_not_equal,{size:10,invert:0,progress:11,testid:1},null);if(options){if(options.target){insert(options.target,this,options.anchor);}if(options.props){this.$set(options.props);flush();}}}static get observedAttributes(){return ["size","invert","progress","testid"];}get size(){return this.$$.ctx[10];}set size(size){this.$$set({size});flush();}get invert(){return this.$$.ctx[0];}set invert(invert){this.$$set({invert});flush();}get progress(){return this.$$.ctx[11];}set progress(progress){this.$$set({progress});flush();}get testid(){return this.$$.ctx[1];}set testid(testid){this.$$set({testid});flush();}}customElements.define("goa-spinner",Spinner);/* libs/web-components/src/components/table/Table.svelte generated by Svelte v3.59.2 */function create_else_block$6(ctx){let table;let slot;let table_style_value;return {c(){table=element("table");slot=element("slot");attr(table,"style",table_style_value=/*width*/ctx[0]&&"width: 100%;");},m(target,anchor){insert(target,table,anchor);append(table,slot);},p(ctx,dirty){if(dirty&/*width*/1&&table_style_value!==(table_style_value=/*width*/ctx[0]&&"width: 100%;")){attr(table,"style",table_style_value);}},d(detaching){if(detaching)detach(table);}};}// (83:2) {#if _isTableRoot}
+$$invalidate(2,type="progress");}}}if($$self.$$.dirty&/*size*/1024){$$invalidate(5,diameter=size&&{small:16,medium:32,large:64,xlarge:100}[size]);}if($$self.$$.dirty&/*size*/1024){$$invalidate(4,strokewidth=size&&{small:2,medium:4,large:7,xlarge:9}[size]);}if($$self.$$.dirty&/*diameter*/32){$$invalidate(3,radius=diameter/2);}if($$self.$$.dirty&/*radius, strokewidth*/24){$$invalidate(12,pathRadius=radius-strokewidth/2);}if($$self.$$.dirty&/*type, pathRadius, progress*/6148){$$invalidate(6,ready=type==="infinite"?pathRadius:pathRadius&&progress);}};return [invert,testid,type,radius,strokewidth,diameter,ready,$_progress,_progress,getArc,size,progress,pathRadius];}class Spinner extends SvelteElement{constructor(options){super();const style=document.createElement('style');style.textContent=`:host{box-sizing:border-box;font-family:var(--goa-font-family-sans)}@keyframes rotate{100%{transform:rotate(360deg)}}.spinner-infinite{animation:rotate 2s linear infinite}`;this.shadowRoot.appendChild(style);init(this,{target:this.shadowRoot,props:attribute_to_object(this.attributes),customElement:true},instance$i,create_fragment$l,safe_not_equal,{size:10,invert:0,progress:11,testid:1},null);if(options){if(options.target){insert(options.target,this,options.anchor);}if(options.props){this.$set(options.props);flush();}}}static get observedAttributes(){return ["size","invert","progress","testid"];}get size(){return this.$$.ctx[10];}set size(size){this.$$set({size});flush();}get invert(){return this.$$.ctx[0];}set invert(invert){this.$$set({invert});flush();}get progress(){return this.$$.ctx[11];}set progress(progress){this.$$set({progress});flush();}get testid(){return this.$$.ctx[1];}set testid(testid){this.$$set({testid});flush();}}customElements.define("goa-spinner",Spinner);/* libs/web-components/src/components/table/Table.svelte generated by Svelte v3.59.2 */function create_else_block$6(ctx){let table;let slot;let table_style_value;return {c(){table=element("table");slot=element("slot");attr(table,"style",table_style_value=/*width*/ctx[0]&&"width: 100%;");},m(target,anchor){insert(target,table,anchor);append(table,slot);},p(ctx,dirty){if(dirty&/*width*/1&&table_style_value!==(table_style_value=/*width*/ctx[0]&&"width: 100%;")){attr(table,"style",table_style_value);}},d(detaching){if(detaching)detach(table);}};}// (85:2) {#if _isTableRoot}
 function create_if_block$a(ctx){let slot;return {c(){slot=element("slot");},m(target,anchor){insert(target,slot,anchor);},p:noop,d(detaching){if(detaching)detach(slot);}};}function create_fragment$k(ctx){let div;let div_class_value;let div_style_value;function select_block_type(ctx,dirty){if(/*_isTableRoot*/ctx[7])return create_if_block$a;return create_else_block$6;}let current_block_type=select_block_type(ctx);let if_block=current_block_type(ctx);return {c(){div=element("div");if_block.c();this.c=noop;attr(div,"class",div_class_value=`goatable ${/*variant*/ctx[1]}`);attr(div,"style",div_style_value=`
     ${/*width*/ctx[0]&&`width: ${/*width*/ctx[0]};`}
     ${calculateMargin(/*mt*/ctx[2],/*mr*/ctx[3],/*mb*/ctx[4],/*ml*/ctx[5])}
@@ -447,7 +447,7 @@ function create_if_block$a(ctx){let slot;return {c(){slot=element("slot");},m(ta
 let _rootEl;let _isTableRoot=false;onMount(()=>{validateVariant(variant);// without setTimeout it won't properly sort in Safari
 setTimeout(attachSortEventHandling,0);// exit here if when running tests (tests don't have assignedElements)
 const slot=_rootEl.querySelector("slot");if(!slot||slot.assignedElements().length===0){return;}// React has everything nested in a table to prevent invalid DOM errors
-$$invalidate(7,_isTableRoot=slot.assignedElements()[0].tagName==="TABLE");});async function attachSortEventHandling(){await tick();const headings=_rootEl.querySelectorAll("goa-table-sort-header");headings.forEach(heading=>{heading.addEventListener("click",()=>{const sortBy=heading.getAttribute("name");let sortDir;// relay state to all children
+$$invalidate(7,_isTableRoot=slot.assignedElements()[0].tagName==="TABLE");});async function attachSortEventHandling(){var _a;await tick();const contentSlot=_rootEl.querySelector("slot");const headings=(_a=contentSlot.assignedElements().find(el=>el.tagName==="THEAD"||el.tagName==="TABLE"))===null||_a===void 0?void 0:_a.querySelectorAll("goa-table-sort-header");headings===null||headings===void 0?void 0:headings.forEach(heading=>{heading.addEventListener("click",()=>{const sortBy=heading.getAttribute("name");let sortDir;// relay state to all children
 headings.forEach(child=>{if(child.getAttribute("name")===sortBy){const direction=child["direction"];// starting direction is asc
 const newDirection=direction==="asc"?"desc":"asc";sortDir=newDirection==="asc"?1:-1;child.setAttribute("direction",newDirection);}else {child.setAttribute("direction","none");}});dispatch(heading,{sortBy,sortDir});});// dispatch the default sort params if initially set
 const initialSortBy=heading.getAttribute("name");const initialDirection=heading["direction"];if(initialDirection&&initialDirection!=="none"){setTimeout(()=>{dispatch(heading,{sortBy:initialSortBy,sortDir:initialDirection==="asc"?1:-1});},10);}});}function div_binding($$value){binding_callbacks[$$value?'unshift':'push'](()=>{_rootEl=$$value;$$invalidate(6,_rootEl);});}$$self.$$set=$$props=>{if('width'in $$props)$$invalidate(0,width=$$props.width);if('stickyheader'in $$props)$$invalidate(9,stickyheader=$$props.stickyheader);if('variant'in $$props)$$invalidate(1,variant=$$props.variant);if('mt'in $$props)$$invalidate(2,mt=$$props.mt);if('mr'in $$props)$$invalidate(3,mr=$$props.mr);if('mb'in $$props)$$invalidate(4,mb=$$props.mb);if('ml'in $$props)$$invalidate(5,ml=$$props.ml);};$$self.$$.update=()=>{if($$self.$$.dirty&/*stickyheader*/512){$$invalidate(8,_stickyHeader=toBoolean(stickyheader));}};return [width,variant,mt,mr,mb,ml,_rootEl,_isTableRoot,_stickyHeader,stickyheader,div_binding];}class Table extends SvelteElement{constructor(options){super();const style=document.createElement('style');style.textContent=`:host{overflow-x:auto}table{border-collapse:collapse}`;this.shadowRoot.appendChild(style);init(this,{target:this.shadowRoot,props:attribute_to_object(this.attributes),customElement:true},instance$h,create_fragment$k,safe_not_equal,{width:0,stickyheader:9,variant:1,mt:2,mr:3,mb:4,ml:5},null);if(options){if(options.target){insert(options.target,this,options.anchor);}if(options.props){this.$set(options.props);flush();}}}static get observedAttributes(){return ["width","stickyheader","variant","mt","mr","mb","ml"];}get width(){return this.$$.ctx[0];}set width(width){this.$$set({width});flush();}get stickyheader(){return this.$$.ctx[9];}set stickyheader(stickyheader){this.$$set({stickyheader});flush();}get variant(){return this.$$.ctx[1];}set variant(variant){this.$$set({variant});flush();}get mt(){return this.$$.ctx[2];}set mt(mt){this.$$set({mt});flush();}get mr(){return this.$$.ctx[3];}set mr(mr){this.$$set({mr});flush();}get mb(){return this.$$.ctx[4];}set mb(mb){this.$$set({mb});flush();}get ml(){return this.$$.ctx[5];}set ml(ml){this.$$set({ml});flush();}}customElements.define("goa-table",Table);/* libs/web-components/src/components/table/TableSortHeader.svelte generated by Svelte v3.59.2 */function create_else_block$5(ctx){let div;return {c(){div=element("div");div.innerHTML=`<goa-icon type="caret-up" size="small"></goa-icon> 

package/react-components.umd.js

@@ -438,14 +438,14 @@
 	{// Typescript recognizes `progress` as a number, but once compiled, due to it being a web component, progress is a string.
 	// This line makes both sides happy.
 	const p=parseFloat(progress+'');if(p>=0){_progress.set(p||1);// start at 1 to prevent incorrect arc calculations
-	$$invalidate(2,type="progress");}}}if($$self.$$.dirty&/*size*/1024){$$invalidate(5,diameter=size&&{small:16,medium:32,large:64,xlarge:100}[size]);}if($$self.$$.dirty&/*size*/1024){$$invalidate(4,strokewidth=size&&{small:2,medium:4,large:7,xlarge:9}[size]);}if($$self.$$.dirty&/*diameter*/32){$$invalidate(3,radius=diameter/2);}if($$self.$$.dirty&/*radius, strokewidth*/24){$$invalidate(12,pathRadius=radius-strokewidth/2);}if($$self.$$.dirty&/*type, pathRadius, progress*/6148){$$invalidate(6,ready=type==="infinite"?pathRadius:pathRadius&&progress);}};return [invert,testid,type,radius,strokewidth,diameter,ready,$_progress,_progress,getArc,size,progress,pathRadius];}class Spinner extends SvelteElement{constructor(options){super();const style=document.createElement('style');style.textContent=`:host{box-sizing:border-box;font-family:var(--goa-font-family-sans)}@keyframes rotate{100%{transform:rotate(360deg)}}.spinner-infinite{animation:rotate 2s linear infinite}`;this.shadowRoot.appendChild(style);init(this,{target:this.shadowRoot,props:attribute_to_object(this.attributes),customElement:true},instance$i,create_fragment$l,safe_not_equal,{size:10,invert:0,progress:11,testid:1},null);if(options){if(options.target){insert(options.target,this,options.anchor);}if(options.props){this.$set(options.props);flush();}}}static get observedAttributes(){return ["size","invert","progress","testid"];}get size(){return this.$$.ctx[10];}set size(size){this.$$set({size});flush();}get invert(){return this.$$.ctx[0];}set invert(invert){this.$$set({invert});flush();}get progress(){return this.$$.ctx[11];}set progress(progress){this.$$set({progress});flush();}get testid(){return this.$$.ctx[1];}set testid(testid){this.$$set({testid});flush();}}customElements.define("goa-spinner",Spinner);/* libs/web-components/src/components/table/Table.svelte generated by Svelte v3.59.2 */function create_else_block$6(ctx){let table;let slot;let table_style_value;return {c(){table=element("table");slot=element("slot");attr(table,"style",table_style_value=/*width*/ctx[0]&&"width: 100%;");},m(target,anchor){insert(target,table,anchor);append(table,slot);},p(ctx,dirty){if(dirty&/*width*/1&&table_style_value!==(table_style_value=/*width*/ctx[0]&&"width: 100%;")){attr(table,"style",table_style_value);}},d(detaching){if(detaching)detach(table);}};}// (83:2) {#if _isTableRoot}
+	$$invalidate(2,type="progress");}}}if($$self.$$.dirty&/*size*/1024){$$invalidate(5,diameter=size&&{small:16,medium:32,large:64,xlarge:100}[size]);}if($$self.$$.dirty&/*size*/1024){$$invalidate(4,strokewidth=size&&{small:2,medium:4,large:7,xlarge:9}[size]);}if($$self.$$.dirty&/*diameter*/32){$$invalidate(3,radius=diameter/2);}if($$self.$$.dirty&/*radius, strokewidth*/24){$$invalidate(12,pathRadius=radius-strokewidth/2);}if($$self.$$.dirty&/*type, pathRadius, progress*/6148){$$invalidate(6,ready=type==="infinite"?pathRadius:pathRadius&&progress);}};return [invert,testid,type,radius,strokewidth,diameter,ready,$_progress,_progress,getArc,size,progress,pathRadius];}class Spinner extends SvelteElement{constructor(options){super();const style=document.createElement('style');style.textContent=`:host{box-sizing:border-box;font-family:var(--goa-font-family-sans)}@keyframes rotate{100%{transform:rotate(360deg)}}.spinner-infinite{animation:rotate 2s linear infinite}`;this.shadowRoot.appendChild(style);init(this,{target:this.shadowRoot,props:attribute_to_object(this.attributes),customElement:true},instance$i,create_fragment$l,safe_not_equal,{size:10,invert:0,progress:11,testid:1},null);if(options){if(options.target){insert(options.target,this,options.anchor);}if(options.props){this.$set(options.props);flush();}}}static get observedAttributes(){return ["size","invert","progress","testid"];}get size(){return this.$$.ctx[10];}set size(size){this.$$set({size});flush();}get invert(){return this.$$.ctx[0];}set invert(invert){this.$$set({invert});flush();}get progress(){return this.$$.ctx[11];}set progress(progress){this.$$set({progress});flush();}get testid(){return this.$$.ctx[1];}set testid(testid){this.$$set({testid});flush();}}customElements.define("goa-spinner",Spinner);/* libs/web-components/src/components/table/Table.svelte generated by Svelte v3.59.2 */function create_else_block$6(ctx){let table;let slot;let table_style_value;return {c(){table=element("table");slot=element("slot");attr(table,"style",table_style_value=/*width*/ctx[0]&&"width: 100%;");},m(target,anchor){insert(target,table,anchor);append(table,slot);},p(ctx,dirty){if(dirty&/*width*/1&&table_style_value!==(table_style_value=/*width*/ctx[0]&&"width: 100%;")){attr(table,"style",table_style_value);}},d(detaching){if(detaching)detach(table);}};}// (85:2) {#if _isTableRoot}
 	function create_if_block$a(ctx){let slot;return {c(){slot=element("slot");},m(target,anchor){insert(target,slot,anchor);},p:noop,d(detaching){if(detaching)detach(slot);}};}function create_fragment$k(ctx){let div;let div_class_value;let div_style_value;function select_block_type(ctx,dirty){if(/*_isTableRoot*/ctx[7])return create_if_block$a;return create_else_block$6;}let current_block_type=select_block_type(ctx);let if_block=current_block_type(ctx);return {c(){div=element("div");if_block.c();this.c=noop;attr(div,"class",div_class_value=`goatable ${/*variant*/ctx[1]}`);attr(div,"style",div_style_value=`
     ${/*width*/ctx[0]&&`width: ${/*width*/ctx[0]};`}
     ${calculateMargin(/*mt*/ctx[2],/*mr*/ctx[3],/*mb*/ctx[4],/*ml*/ctx[5])}
   `);toggle_class(div,"sticky",/*_stickyHeader*/ctx[8]);},m(target,anchor){insert(target,div,anchor);if_block.m(div,null);/*div_binding*/ctx[10](div);},p(ctx,[dirty]){if(current_block_type===(current_block_type=select_block_type(ctx))&&if_block){if_block.p(ctx,dirty);}else {if_block.d(1);if_block=current_block_type(ctx);if(if_block){if_block.c();if_block.m(div,null);}}if(dirty&/*variant*/2&&div_class_value!==(div_class_value=`goatable ${/*variant*/ctx[1]}`)){attr(div,"class",div_class_value);}if(dirty&/*width, mt, mr, mb, ml*/61&&div_style_value!==(div_style_value=`
     ${/*width*/ctx[0]&&`width: ${/*width*/ctx[0]};`}
     ${calculateMargin(/*mt*/ctx[2],/*mr*/ctx[3],/*mb*/ctx[4],/*ml*/ctx[5])}
-  `)){attr(div,"style",div_style_value);}if(dirty&/*variant, _stickyHeader*/258){toggle_class(div,"sticky",/*_stickyHeader*/ctx[8]);}},i:noop,o:noop,d(detaching){if(detaching)detach(div);if_block.d();/*div_binding*/ctx[10](null);}};}function dispatch(el,params){el.dispatchEvent(new CustomEvent("_sort",{composed:true,bubbles:true,cancelable:false,detail:params}));}function instance$h($$self,$$props,$$invalidate){const attachSortEventHandling=function attachSortEventHandling(){return _call(tick,function(){const headings=_rootEl.querySelectorAll("goa-table-sort-header");headings.forEach(heading=>{heading.addEventListener("click",()=>{const sortBy=heading.getAttribute("name");let sortDir;// relay state to all children
+  `)){attr(div,"style",div_style_value);}if(dirty&/*variant, _stickyHeader*/258){toggle_class(div,"sticky",/*_stickyHeader*/ctx[8]);}},i:noop,o:noop,d(detaching){if(detaching)detach(div);if_block.d();/*div_binding*/ctx[10](null);}};}function dispatch(el,params){el.dispatchEvent(new CustomEvent("_sort",{composed:true,bubbles:true,cancelable:false,detail:params}));}function instance$h($$self,$$props,$$invalidate){const attachSortEventHandling=function attachSortEventHandling(){var _a;return _call(tick,function(){const contentSlot=_rootEl.querySelector("slot");const headings=(_a=contentSlot.assignedElements().find(el=>el.tagName==="THEAD"||el.tagName==="TABLE"))===null||_a===void 0?void 0:_a.querySelectorAll("goa-table-sort-header");headings===null||headings===void 0?void 0:headings.forEach(heading=>{heading.addEventListener("click",()=>{const sortBy=heading.getAttribute("name");let sortDir;// relay state to all children
 	headings.forEach(child=>{if(child.getAttribute("name")===sortBy){const direction=child["direction"];// starting direction is asc
 	const newDirection=direction==="asc"?"desc":"asc";sortDir=newDirection==="asc"?1:-1;child.setAttribute("direction",newDirection);}else {child.setAttribute("direction","none");}});dispatch(heading,{sortBy,sortDir});});// dispatch the default sort params if initially set
 	const initialSortBy=heading.getAttribute("name");const initialDirection=heading["direction"];if(initialDirection&&initialDirection!=="none"){setTimeout(()=>{dispatch(heading,{sortBy:initialSortBy,sortDir:initialDirection==="asc"?1:-1});},10);}});});};let _stickyHeader;const[Variants,validateVariant]=typeValidator("Table variant",["normal","relaxed"],true);let{width=""}=$$props;let{stickyheader="false"}=$$props;let{variant="normal"}=$$props;let{mt=null}=$$props;let{mr=null}=$$props;let{mb=null}=$$props;let{ml=null}=$$props;// Private