@oods/components-vue 0.4.1 → 0.4.2

package/README.md

@@ -34,4 +34,4 @@ Use matching versions of the OODS packages. These packages are separate from the
 
 ## License
 
-Apache License 2.0. See [LICENSE](https://cdn.jsdelivr.net/npm/@oods/components-vue@0.4.1/LICENSE) and [NOTICE](https://cdn.jsdelivr.net/npm/@oods/components-vue@0.4.1/NOTICE). Generated output belongs to its user; installed package dependencies retain their own licenses.
+Apache License 2.0. See [LICENSE](https://cdn.jsdelivr.net/npm/@oods/components-vue@0.4.2/LICENSE) and [NOTICE](https://cdn.jsdelivr.net/npm/@oods/components-vue@0.4.2/NOTICE). Generated output belongs to its user; installed package dependencies retain their own licenses.

package/dist/index.cjs

@@ -1523,11 +1523,14 @@ var CancellationBadge = createBadgeFamily({
   booleanLabels: ["Cancellation scheduled", "No cancellation scheduled"]
 });
 var ArchiveSummary = vue.defineComponent({
+  // s224-m01 (#2542 ruling 6): hideWhenDefault is Boolean first, as the badges' hideWhenFalse is: a generated template writes
+  // the bare attribute, which Vue casts to true only then.
   name: "OodsArchiveSummary",
-  props: { title: String, label: String, heading: String, name: String, isArchived: { type: [String, Boolean], default: void 0 }, archived: { type: [String, Boolean], default: void 0 }, status: { type: [String, Boolean], default: void 0 }, archivedAt: String, reason: String, archiveReason: String, summary: String, text: String, description: String },
+  props: { title: String, label: String, heading: String, name: String, isArchived: { type: [String, Boolean], default: void 0 }, archived: { type: [String, Boolean], default: void 0 }, status: { type: [String, Boolean], default: void 0 }, archivedAt: String, reason: String, archiveReason: String, summary: String, text: String, description: String, hideWhenDefault: { type: [Boolean, String], default: void 0 } },
   setup(props, { slots }) {
     return () => {
       const content = authoredContent(slots.default?.());
+      if (props.hideWhenDefault === true && (props.isArchived ?? props.archived ?? props.status) === false && !props.archivedAt && !firstText(props.reason, props.archiveReason) && !content.length) return null;
       const terms = [["Archived", componentContracts.summaryValue(props.isArchived ?? props.archived ?? props.status)], ["Archived At", props.archivedAt ? componentContracts.formatDateTime(props.archivedAt) : void 0], ["Reason", firstText(props.reason, props.archiveReason)]].filter((entry) => entry[1] !== void 0);
       const fallback = firstText(props.summary, props.text, props.description);
       return vue.h("section", { class: "oods-archive-summary", "data-oods-component": "ArchiveSummary", "data-summary-type": "archive" }, [
@@ -2183,13 +2186,16 @@ var Tabs = vue.defineComponent({
           onClick: () => selectTab(item.id),
           onKeydown: (event) => onTabKeydown(event, item.id)
         }, slots.itemLabel?.({ item, selected: item.id === activeId.value }) ?? [item.label])),
-        overflowItems.value.length > 0 ? vue.h("div", { class: "oods-tabs-overflow" }, [
+        // s224-m01 (#2542 ruling 2): the overflow markup is React's too: both class families, the trigger's data
+        // attribute and aria-current="true" on an item.
+        overflowItems.value.length > 0 ? vue.h("div", { class: "oods-tabs-overflow oods-tabs__overflow" }, [
           vue.h("button", {
             type: "button",
             class: "oods-tabs-overflow-trigger",
             "aria-label": `${props.overflowLabel} tabs`,
             "aria-haspopup": "menu",
             "aria-expanded": overflowOpen.value,
+            "data-tabs-overflow-trigger": "true",
             onClick: () => {
               overflowOpen.value = !overflowOpen.value;
             }
@@ -2199,7 +2205,7 @@ var Tabs = vue.defineComponent({
             type: "button",
             role: "menuitem",
             disabled: itemDisabled(item),
-            "aria-current": item.id === activeId.value ? "page" : void 0,
+            "aria-current": item.id === activeId.value ? "true" : void 0,
             onClick: () => {
               selectTab(item.id);
               overflowOpen.value = false;
@@ -2613,12 +2619,15 @@ var CancellationSummary = vue.defineComponent({
     cancelAtPeriodEndField: String,
     requestedAtField: String,
     reasonField: String,
-    codeField: String
+    codeField: String,
+    // s224-m01 (#2542 ruling 6): Boolean first, as the badges' hideWhenFalse is (a bare attribute casts to true).
+    hideWhenDefault: { type: [Boolean, String], default: void 0 }
   },
   setup(props, { attrs, slots }) {
     return () => {
       const slotValue = slotSummaryValue(slots);
       const cancellationValue = props.cancelAtPeriodEnd ?? slotValue;
+      if (props.hideWhenDefault === true && props.cancelAtPeriodEnd === false && !props.requestedAt && !props.reason && !props.code && slotValue === void 0) return null;
       const rows = [];
       if (cancellationValue !== void 0) {
         rows.push(summaryEntry(

package/dist/index.d.cts

@@ -1695,9 +1695,13 @@ declare const ArchiveSummary: vue.DefineComponent<vue.ExtractPropTypes<{
     summary: StringConstructor;
     text: StringConstructor;
     description: StringConstructor;
+    hideWhenDefault: {
+        type: (StringConstructor | BooleanConstructor)[];
+        default: undefined;
+    };
 }>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
     [key: string]: any;
-}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+}> | null, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     title: StringConstructor;
     label: StringConstructor;
     heading: StringConstructor;
@@ -1720,10 +1724,15 @@ declare const ArchiveSummary: vue.DefineComponent<vue.ExtractPropTypes<{
     summary: StringConstructor;
     text: StringConstructor;
     description: StringConstructor;
+    hideWhenDefault: {
+        type: (StringConstructor | BooleanConstructor)[];
+        default: undefined;
+    };
 }>> & Readonly<{}>, {
     status: string | boolean;
     isArchived: string | boolean;
     archived: string | boolean;
+    hideWhenDefault: string | boolean;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 declare const PriceCardMeta: vue.DefineComponent<vue.ExtractPropTypes<{
     title: StringConstructor;
@@ -2722,9 +2731,13 @@ declare const CancellationSummary: vue.DefineComponent<vue.ExtractPropTypes<{
     requestedAtField: StringConstructor;
     reasonField: StringConstructor;
     codeField: StringConstructor;
+    hideWhenDefault: {
+        type: (StringConstructor | BooleanConstructor)[];
+        default: undefined;
+    };
 }>, () => VNode<vue.RendererNode, vue.RendererElement, {
     [key: string]: any;
-}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+}> | null, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     title: StringConstructor;
     label: StringConstructor;
     cancelAtPeriodEnd: {
@@ -2739,8 +2752,13 @@ declare const CancellationSummary: vue.DefineComponent<vue.ExtractPropTypes<{
     requestedAtField: StringConstructor;
     reasonField: StringConstructor;
     codeField: StringConstructor;
+    hideWhenDefault: {
+        type: (StringConstructor | BooleanConstructor)[];
+        default: undefined;
+    };
 }>> & Readonly<{}>, {
     cancelAtPeriodEnd: boolean;
+    hideWhenDefault: string | boolean;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 declare const SearchInput: vue.DefineComponent<vue.ExtractPropTypes<{
     id: StringConstructor;

package/dist/index.d.ts

@@ -1695,9 +1695,13 @@ declare const ArchiveSummary: vue.DefineComponent<vue.ExtractPropTypes<{
     summary: StringConstructor;
     text: StringConstructor;
     description: StringConstructor;
+    hideWhenDefault: {
+        type: (StringConstructor | BooleanConstructor)[];
+        default: undefined;
+    };
 }>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
     [key: string]: any;
-}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+}> | null, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     title: StringConstructor;
     label: StringConstructor;
     heading: StringConstructor;
@@ -1720,10 +1724,15 @@ declare const ArchiveSummary: vue.DefineComponent<vue.ExtractPropTypes<{
     summary: StringConstructor;
     text: StringConstructor;
     description: StringConstructor;
+    hideWhenDefault: {
+        type: (StringConstructor | BooleanConstructor)[];
+        default: undefined;
+    };
 }>> & Readonly<{}>, {
     status: string | boolean;
     isArchived: string | boolean;
     archived: string | boolean;
+    hideWhenDefault: string | boolean;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 declare const PriceCardMeta: vue.DefineComponent<vue.ExtractPropTypes<{
     title: StringConstructor;
@@ -2722,9 +2731,13 @@ declare const CancellationSummary: vue.DefineComponent<vue.ExtractPropTypes<{
     requestedAtField: StringConstructor;
     reasonField: StringConstructor;
     codeField: StringConstructor;
+    hideWhenDefault: {
+        type: (StringConstructor | BooleanConstructor)[];
+        default: undefined;
+    };
 }>, () => VNode<vue.RendererNode, vue.RendererElement, {
     [key: string]: any;
-}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+}> | null, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     title: StringConstructor;
     label: StringConstructor;
     cancelAtPeriodEnd: {
@@ -2739,8 +2752,13 @@ declare const CancellationSummary: vue.DefineComponent<vue.ExtractPropTypes<{
     requestedAtField: StringConstructor;
     reasonField: StringConstructor;
     codeField: StringConstructor;
+    hideWhenDefault: {
+        type: (StringConstructor | BooleanConstructor)[];
+        default: undefined;
+    };
 }>> & Readonly<{}>, {
     cancelAtPeriodEnd: boolean;
+    hideWhenDefault: string | boolean;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 declare const SearchInput: vue.DefineComponent<vue.ExtractPropTypes<{
     id: StringConstructor;

package/dist/index.js

@@ -1521,11 +1521,14 @@ var CancellationBadge = createBadgeFamily({
   booleanLabels: ["Cancellation scheduled", "No cancellation scheduled"]
 });
 var ArchiveSummary = defineComponent({
+  // s224-m01 (#2542 ruling 6): hideWhenDefault is Boolean first, as the badges' hideWhenFalse is: a generated template writes
+  // the bare attribute, which Vue casts to true only then.
   name: "OodsArchiveSummary",
-  props: { title: String, label: String, heading: String, name: String, isArchived: { type: [String, Boolean], default: void 0 }, archived: { type: [String, Boolean], default: void 0 }, status: { type: [String, Boolean], default: void 0 }, archivedAt: String, reason: String, archiveReason: String, summary: String, text: String, description: String },
+  props: { title: String, label: String, heading: String, name: String, isArchived: { type: [String, Boolean], default: void 0 }, archived: { type: [String, Boolean], default: void 0 }, status: { type: [String, Boolean], default: void 0 }, archivedAt: String, reason: String, archiveReason: String, summary: String, text: String, description: String, hideWhenDefault: { type: [Boolean, String], default: void 0 } },
   setup(props, { slots }) {
     return () => {
       const content = authoredContent(slots.default?.());
+      if (props.hideWhenDefault === true && (props.isArchived ?? props.archived ?? props.status) === false && !props.archivedAt && !firstText(props.reason, props.archiveReason) && !content.length) return null;
       const terms = [["Archived", summaryValue(props.isArchived ?? props.archived ?? props.status)], ["Archived At", props.archivedAt ? formatDateTime(props.archivedAt) : void 0], ["Reason", firstText(props.reason, props.archiveReason)]].filter((entry) => entry[1] !== void 0);
       const fallback = firstText(props.summary, props.text, props.description);
       return h("section", { class: "oods-archive-summary", "data-oods-component": "ArchiveSummary", "data-summary-type": "archive" }, [
@@ -2181,13 +2184,16 @@ var Tabs = defineComponent({
           onClick: () => selectTab(item.id),
           onKeydown: (event) => onTabKeydown(event, item.id)
         }, slots.itemLabel?.({ item, selected: item.id === activeId.value }) ?? [item.label])),
-        overflowItems.value.length > 0 ? h("div", { class: "oods-tabs-overflow" }, [
+        // s224-m01 (#2542 ruling 2): the overflow markup is React's too: both class families, the trigger's data
+        // attribute and aria-current="true" on an item.
+        overflowItems.value.length > 0 ? h("div", { class: "oods-tabs-overflow oods-tabs__overflow" }, [
           h("button", {
             type: "button",
             class: "oods-tabs-overflow-trigger",
             "aria-label": `${props.overflowLabel} tabs`,
             "aria-haspopup": "menu",
             "aria-expanded": overflowOpen.value,
+            "data-tabs-overflow-trigger": "true",
             onClick: () => {
               overflowOpen.value = !overflowOpen.value;
             }
@@ -2197,7 +2203,7 @@ var Tabs = defineComponent({
             type: "button",
             role: "menuitem",
             disabled: itemDisabled(item),
-            "aria-current": item.id === activeId.value ? "page" : void 0,
+            "aria-current": item.id === activeId.value ? "true" : void 0,
             onClick: () => {
               selectTab(item.id);
               overflowOpen.value = false;
@@ -2611,12 +2617,15 @@ var CancellationSummary = defineComponent({
     cancelAtPeriodEndField: String,
     requestedAtField: String,
     reasonField: String,
-    codeField: String
+    codeField: String,
+    // s224-m01 (#2542 ruling 6): Boolean first, as the badges' hideWhenFalse is (a bare attribute casts to true).
+    hideWhenDefault: { type: [Boolean, String], default: void 0 }
   },
   setup(props, { attrs, slots }) {
     return () => {
       const slotValue = slotSummaryValue(slots);
       const cancellationValue = props.cancelAtPeriodEnd ?? slotValue;
+      if (props.hideWhenDefault === true && props.cancelAtPeriodEnd === false && !props.requestedAt && !props.reason && !props.code && slotValue === void 0) return null;
       const rows = [];
       if (cancellationValue !== void 0) {
         rows.push(summaryEntry(

package/dist/ported.cjs

@@ -1110,12 +1110,15 @@ var CancellationSummary = vue.defineComponent({
     cancelAtPeriodEndField: String,
     requestedAtField: String,
     reasonField: String,
-    codeField: String
+    codeField: String,
+    // s224-m01 (#2542 ruling 6): Boolean first, as the badges' hideWhenFalse is (a bare attribute casts to true).
+    hideWhenDefault: { type: [Boolean, String], default: void 0 }
   },
   setup(props, { attrs, slots }) {
     return () => {
       const slotValue = slotSummaryValue(slots);
       const cancellationValue = props.cancelAtPeriodEnd ?? slotValue;
+      if (props.hideWhenDefault === true && props.cancelAtPeriodEnd === false && !props.requestedAt && !props.reason && !props.code && slotValue === void 0) return null;
       const rows = [];
       if (cancellationValue !== void 0) {
         rows.push(summaryEntry(

package/dist/ported.d.cts

@@ -401,9 +401,13 @@ declare const CancellationSummary: vue.DefineComponent<vue.ExtractPropTypes<{
     requestedAtField: StringConstructor;
     reasonField: StringConstructor;
     codeField: StringConstructor;
+    hideWhenDefault: {
+        type: (StringConstructor | BooleanConstructor)[];
+        default: undefined;
+    };
 }>, () => VNode<vue.RendererNode, vue.RendererElement, {
     [key: string]: any;
-}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+}> | null, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     title: StringConstructor;
     label: StringConstructor;
     cancelAtPeriodEnd: {
@@ -418,8 +422,13 @@ declare const CancellationSummary: vue.DefineComponent<vue.ExtractPropTypes<{
     requestedAtField: StringConstructor;
     reasonField: StringConstructor;
     codeField: StringConstructor;
+    hideWhenDefault: {
+        type: (StringConstructor | BooleanConstructor)[];
+        default: undefined;
+    };
 }>> & Readonly<{}>, {
     cancelAtPeriodEnd: boolean;
+    hideWhenDefault: string | boolean;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 declare const SearchInput: vue.DefineComponent<vue.ExtractPropTypes<{
     id: StringConstructor;

package/dist/ported.d.ts

@@ -401,9 +401,13 @@ declare const CancellationSummary: vue.DefineComponent<vue.ExtractPropTypes<{
     requestedAtField: StringConstructor;
     reasonField: StringConstructor;
     codeField: StringConstructor;
+    hideWhenDefault: {
+        type: (StringConstructor | BooleanConstructor)[];
+        default: undefined;
+    };
 }>, () => VNode<vue.RendererNode, vue.RendererElement, {
     [key: string]: any;
-}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
+}> | null, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
     title: StringConstructor;
     label: StringConstructor;
     cancelAtPeriodEnd: {
@@ -418,8 +422,13 @@ declare const CancellationSummary: vue.DefineComponent<vue.ExtractPropTypes<{
     requestedAtField: StringConstructor;
     reasonField: StringConstructor;
     codeField: StringConstructor;
+    hideWhenDefault: {
+        type: (StringConstructor | BooleanConstructor)[];
+        default: undefined;
+    };
 }>> & Readonly<{}>, {
     cancelAtPeriodEnd: boolean;
+    hideWhenDefault: string | boolean;
 }, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
 declare const SearchInput: vue.DefineComponent<vue.ExtractPropTypes<{
     id: StringConstructor;

package/dist/ported.js

@@ -1108,12 +1108,15 @@ var CancellationSummary = defineComponent({
     cancelAtPeriodEndField: String,
     requestedAtField: String,
     reasonField: String,
-    codeField: String
+    codeField: String,
+    // s224-m01 (#2542 ruling 6): Boolean first, as the badges' hideWhenFalse is (a bare attribute casts to true).
+    hideWhenDefault: { type: [Boolean, String], default: void 0 }
   },
   setup(props, { attrs, slots }) {
     return () => {
       const slotValue = slotSummaryValue(slots);
       const cancellationValue = props.cancelAtPeriodEnd ?? slotValue;
+      if (props.hideWhenDefault === true && props.cancelAtPeriodEnd === false && !props.requestedAt && !props.reason && !props.code && slotValue === void 0) return null;
       const rows = [];
       if (cancellationValue !== void 0) {
         rows.push(summaryEntry(

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oods/components-vue",
-  "version": "0.4.1",
+  "version": "0.4.2",
   "description": "Vue 3 components for OODS Foundry: the controls, layouts and domain views its generated screens use.",
   "homepage": "https://oods-foundry.com/",
   "bugs": {
@@ -53,8 +53,8 @@
     "**/*.css"
   ],
   "dependencies": {
-    "@oods/component-contracts": "0.4.1",
-    "@oods/component-styles": "0.4.1"
+    "@oods/component-contracts": "0.4.2",
+    "@oods/component-styles": "0.4.2"
   },
   "peerDependencies": {
     "vue": "^3.5.0"