@primer/view-components 0.0.108 → 0.0.110

package/app/components/primer/beta/progress_bar.css

@@ -0,0 +1 @@
+.Progress{background-color:var(--color-neutral-muted);border-radius:6px;display:flex;height:8px;outline:1px solid #0000;overflow:hidden}.Progress--large{height:10px}.Progress--small{height:5px}.Progress-item{outline:2px solid #0000}.Progress-item+.Progress-item{margin-left:2px}

package/app/components/primer/beta/progress_bar.css.json

@@ -0,0 +1 @@
+{"name":"beta/progress_bar","selectors":[".Progress",".Progress--large",".Progress--small",".Progress-item",".Progress-item+.Progress-item"]}

package/app/components/primer/beta/truncate.css

@@ -0,0 +1 @@
+.Truncate{display:inline-flex;max-width:100%;min-width:0}.Truncate>.Truncate-text{max-width:-moz-fit-content;max-width:fit-content;min-width:1ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:is(.Truncate>.Truncate-text)+.Truncate-text{margin-left:var(--primer-control-small-gap,4px)}.Truncate>.Truncate-text.Truncate-text--primary{flex-basis:200%}.Truncate>.Truncate-text.Truncate-text--expandable:active,.Truncate>.Truncate-text.Truncate-text--expandable:focus,.Truncate>.Truncate-text.Truncate-text--expandable:hover{cursor:pointer;flex-shrink:0;max-width:100%!important}

package/app/components/primer/beta/truncate.css.json

@@ -0,0 +1 @@
+{"name":"beta/truncate","selectors":[".Truncate",".Truncate>.Truncate-text",":is(.Truncate>.Truncate-text)+.Truncate-text",".Truncate>.Truncate-text.Truncate-text--primary",".Truncate>.Truncate-text.Truncate-text--expandable:active",".Truncate>.Truncate-text.Truncate-text--expandable:focus",".Truncate>.Truncate-text.Truncate-text--expandable:hover"]}

package/app/components/primer/primer.d.ts

@@ -4,8 +4,8 @@ import './alpha/nav_list';
 import './alpha/segmented_control';
 import './alpha/toggle_switch';
 import './alpha/tool_tip';
+import './alpha/x_banner';
 import './beta/auto_complete/auto_complete';
-import './beta/x_banner';
 import './clipboard_copy';
 import './dropdown';
 import './local_time';

package/app/components/primer/primer.js

@@ -4,8 +4,8 @@ import './alpha/nav_list';
 import './alpha/segmented_control';
 import './alpha/toggle_switch';
 import './alpha/tool_tip';
+import './alpha/x_banner';
 import './beta/auto_complete/auto_complete';
-import './beta/x_banner';
 import './clipboard_copy';
 import './dropdown';
 import './local_time';

package/app/components/primer/state_component.css

@@ -0,0 +1 @@
+.State,.state{border-radius:2em;display:inline-block;font-size:var(--primer-text-body-size-medium,14px);font-weight:var(--base-text-weight-medium,500);line-height:var(--primer-control-medium-lineBoxHeight,20px);padding:5px var(--primer-control-medium-paddingInline-normal,12px);text-align:center;white-space:nowrap}.State,.State--draft,.state{background-color:var(--color-neutral-emphasis);border:var(--primer-borderWidth-thin,1px) solid #0000;color:var(--color-fg-on-emphasis)}.State--open{background-color:var(--color-open-emphasis)}.State--merged,.State--open{color:var(--color-fg-on-emphasis)}.State--merged{background-color:var(--color-done-emphasis)}.State--closed{background-color:var(--color-closed-emphasis);color:var(--color-fg-on-emphasis)}.State--small{font-size:var(--primer-text-body-size-small,12px);line-height:var(--base-size-24,24px);padding:0 10px}.State--small .octicon{width:1em}

package/app/components/primer/state_component.css.json

@@ -0,0 +1 @@
+{"name":"state_component","selectors":[".State",".state",".State--draft",".State--open",".State--merged",".State--closed",".State--small",".State--small .octicon"]}

package/app/components/primer/subhead_component.css

@@ -0,0 +1 @@
+.Subhead{border-bottom:var(--primer-borderWidth-thin,1px) solid var(--color-border-muted);display:flex;flex-flow:row wrap;justify-content:flex-end;margin-bottom:var(--primer-stack-gap-normal,16px);padding-bottom:var(--primer-stack-padding-condensed,8px)}.Subhead--spacious{margin-top:var(--base-size-40,40px)}.Subhead-heading{flex:1 1 auto;font-size:24px;font-weight:var(--base-text-weight-normal,400);order:0}.Subhead-heading--danger{color:var(--color-danger-fg);font-weight:var(--base-text-weight-semibold,600)}.Subhead-description{color:var(--color-fg-muted);flex:1 100%;font-size:var(--primer-text-body-size-medium,14px);order:2}.Subhead-actions{align-self:center;justify-content:flex-end;margin:var(--base-size-4,4px) 0 var(--base-size-4,4px) var(--base-size-4,4px);order:1}.Subhead-actions+.Subhead-description{margin-top:var(--base-size-4,4px)}

package/app/components/primer/subhead_component.css.json

@@ -0,0 +1 @@
+{"name":"subhead_component","selectors":[".Subhead",".Subhead--spacious",".Subhead-heading",".Subhead-heading--danger",".Subhead-description",".Subhead-actions",".Subhead-actions+.Subhead-description"]}

package/app/components/primer/truncate.css

@@ -0,0 +1 @@
+.css-truncate .css-truncate-overflow,.css-truncate .css-truncate-target,.css-truncate.css-truncate-overflow,.css-truncate.css-truncate-target{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.css-truncate .css-truncate-target,.css-truncate.css-truncate-target{display:inline-block;max-width:125px;vertical-align:top}.css-truncate.expandable.css-truncate-target:hover,.css-truncate.expandable.zeroclipboard-is-hover .css-truncate-target,.css-truncate.expandable.zeroclipboard-is-hover.css-truncate-target,.css-truncate.expandable:hover .css-truncate-target{max-width:10000px!important}

package/app/components/primer/truncate.css.json

@@ -0,0 +1 @@
+{"name":"truncate","selectors":[".css-truncate .css-truncate-overflow",".css-truncate .css-truncate-target",".css-truncate.css-truncate-overflow",".css-truncate.css-truncate-target",".css-truncate.expandable.css-truncate-target:hover",".css-truncate.expandable.zeroclipboard-is-hover .css-truncate-target",".css-truncate.expandable.zeroclipboard-is-hover.css-truncate-target",".css-truncate.expandable:hover .css-truncate-target"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@primer/view-components",
-  "version": "0.0.108",
+  "version": "0.0.110",
   "description": "ViewComponents for the Primer Design System",
   "main": "app/assets/javascripts/primer_view_components.js",
   "module": "app/components/primer/primer.js",
@@ -57,6 +57,7 @@
     "@changesets/cli": "^2.24.1",
     "@github/browserslist-config": "^1.0.0",
     "@github/prettier-config": "0.0.4",
+    "@playwright/test": "^1.27.1",
     "@primer/css": "20.4.7",
     "@primer/primitives": "^7.9.0",
     "@rollup/plugin-node-resolve": "^13.3.0",
@@ -71,6 +72,7 @@
     "eslint-plugin-prettier": "^4.2.1",
     "markdownlint-cli": "^0.32.2",
     "mocha": "^10.0.0",
+    "playwright": "^1.27.1",
     "postcss": "^8.4.16",
     "postcss-cli": "^10.0.0",
     "postcss-import": "^14.1.0",

package/static/arguments.json

@@ -205,6 +205,62 @@
       }
     ]
   },
+  {
+    "component": "Banner",
+    "status": "alpha",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/alpha/banner.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/alpha/banner/default/",
+    "parameters": [
+      {
+        "name": "full",
+        "type": "Boolean",
+        "default": "`false`",
+        "description": "Whether the component should take up the full width of the screen."
+      },
+      {
+        "name": "full_when_narrow",
+        "type": "Boolean",
+        "default": "`false`",
+        "description": "Whether the component should take up the full width of the screen when rendered inside smaller viewports."
+      },
+      {
+        "name": "dismissible",
+        "type": "Boolean",
+        "default": "`false`",
+        "description": "Whether the component can be dismissed with an \"x\" button."
+      },
+      {
+        "name": "description",
+        "type": "String",
+        "default": "`nil`",
+        "description": "Description text rendered underneath the message."
+      },
+      {
+        "name": "icon",
+        "type": "Symbol",
+        "default": "`nil`",
+        "description": "The name of an [Octicon](https://primer.style/octicons/) icon to use. If no icon is provided, a default one will be chosen based on the scheme."
+      },
+      {
+        "name": "scheme",
+        "type": "Symbol",
+        "default": "`:default`",
+        "description": "One of `:danger`, `:default`, `:success`, or `:warning`."
+      },
+      {
+        "name": "reappear",
+        "type": "Boolean",
+        "default": "`false`",
+        "description": "Whether or not the flash banner should reappear after being dismissed. Only for use in test and preview environments."
+      },
+      {
+        "name": "system_arguments",
+        "type": "Hash",
+        "default": "N/A",
+        "description": "[System arguments](/system-arguments)"
+      }
+    ]
+  },
   {
     "component": "ButtonMarketing",
     "status": "alpha",
@@ -1117,62 +1173,6 @@
       }
     ]
   },
-  {
-    "component": "Banner",
-    "status": "beta",
-    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/banner.rb",
-    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/banner/default/",
-    "parameters": [
-      {
-        "name": "full",
-        "type": "Boolean",
-        "default": "`false`",
-        "description": "Whether the component should take up the full width of the screen."
-      },
-      {
-        "name": "full_when_narrow",
-        "type": "Boolean",
-        "default": "`false`",
-        "description": "Whether the component should take up the full width of the screen when rendered inside smaller viewports."
-      },
-      {
-        "name": "dismissible",
-        "type": "Boolean",
-        "default": "`false`",
-        "description": "Whether the component can be dismissed with an \"x\" button."
-      },
-      {
-        "name": "description",
-        "type": "String",
-        "default": "`nil`",
-        "description": "Description text rendered underneath the message."
-      },
-      {
-        "name": "icon",
-        "type": "Symbol",
-        "default": "`nil`",
-        "description": "The name of an [Octicon](https://primer.style/octicons/) icon to use. If no icon is provided, a default one will be chosen based on the scheme."
-      },
-      {
-        "name": "scheme",
-        "type": "Symbol",
-        "default": "`:default`",
-        "description": "One of `:danger`, `:default`, `:success`, or `:warning`."
-      },
-      {
-        "name": "reappear",
-        "type": "Boolean",
-        "default": "`false`",
-        "description": "Whether or not the flash banner should reappear after being dismissed. Only for use in test and preview environments."
-      },
-      {
-        "name": "system_arguments",
-        "type": "Hash",
-        "default": "N/A",
-        "description": "[System arguments](/system-arguments)"
-      }
-    ]
-  },
   {
     "component": "BaseButton",
     "status": "beta",
@@ -1683,6 +1683,26 @@
       }
     ]
   },
+  {
+    "component": "ProgressBar",
+    "status": "beta",
+    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/beta/progress_bar.rb",
+    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/beta/progress_bar/default/",
+    "parameters": [
+      {
+        "name": "size",
+        "type": "Symbol",
+        "default": "`:default`",
+        "description": "One of `:default`, `:large`, or `:small`. Increases height."
+      },
+      {
+        "name": "system_arguments",
+        "type": "Hash",
+        "default": "N/A",
+        "description": "[System arguments](/system-arguments)"
+      }
+    ]
+  },
   {
     "component": "Text",
     "status": "beta",
@@ -2221,26 +2241,6 @@
       }
     ]
   },
-  {
-    "component": "ProgressBar",
-    "status": "beta",
-    "source": "https://github.com/primer/view_components/tree/main/app/components/primer/progress_bar_component.rb",
-    "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/progress_bar/default/",
-    "parameters": [
-      {
-        "name": "size",
-        "type": "Symbol",
-        "default": "`:default`",
-        "description": "One of `:default`, `:large`, or `:small`. Increases height."
-      },
-      {
-        "name": "system_arguments",
-        "type": "Hash",
-        "default": "N/A",
-        "description": "[System arguments](/system-arguments)"
-      }
-    ]
-  },
   {
     "component": "Spinner",
     "status": "beta",

package/static/audited_at.json

@@ -5,6 +5,7 @@
   "Primer::Alpha::ActionList::Item": "",
   "Primer::Alpha::AutoComplete": "",
   "Primer::Alpha::AutoComplete::Item": "",
+  "Primer::Alpha::Banner": "",
   "Primer::Alpha::ButtonMarketing": "",
   "Primer::Alpha::Dialog": "",
   "Primer::Alpha::Dialog::Body": "",
@@ -33,7 +34,6 @@
   "Primer::Beta::AutoComplete::Item": "",
   "Primer::Beta::Avatar": "",
   "Primer::Beta::AvatarStack": "",
-  "Primer::Beta::Banner": "",
   "Primer::Beta::BaseButton": "",
   "Primer::Beta::Blankslate": "",
   "Primer::Beta::BorderBox": "",
@@ -50,6 +50,7 @@
   "Primer::Beta::IconButton": "",
   "Primer::Beta::Label": "",
   "Primer::Beta::Link": "",
+  "Primer::Beta::ProgressBar": "",
   "Primer::Beta::Text": "",
   "Primer::Beta::Truncate": "",
   "Primer::Beta::Truncate::TruncateText": "",

package/static/constants.json

@@ -72,6 +72,27 @@
   },
   "Primer::Alpha::AutoComplete::Item": {
   },
+  "Primer::Alpha::Banner": {
+    "DEFAULT_ICONS": {
+      "default": "bell",
+      "warning": "alert",
+      "danger": "stop",
+      "success": "check-circle"
+    },
+    "DEFAULT_SCHEME": "default",
+    "LEGACY_SCHEME_MAPPINGS": {
+      "default": "",
+      "warning": "flash-warn",
+      "danger": "flash-error",
+      "success": "flash-success"
+    },
+    "SCHEME_MAPPINGS": {
+      "default": "",
+      "warning": "Banner--warning",
+      "danger": "Banner--error",
+      "success": "Banner--success"
+    }
+  },
   "Primer::Alpha::ButtonMarketing": {
     "DEFAULT_SCHEME": "default",
     "DEFAULT_TAG": "button",
@@ -396,21 +417,6 @@
       "span"
     ]
   },
-  "Primer::Beta::Banner": {
-    "DEFAULT_ICONS": {
-      "default": "bell",
-      "warning": "alert",
-      "danger": "stop",
-      "success": "check-circle"
-    },
-    "DEFAULT_SCHEME": "default",
-    "SCHEME_MAPPINGS": {
-      "default": "",
-      "warning": "Banner--warning",
-      "danger": "Banner--error",
-      "success": "Banner--success"
-    }
-  },
   "Primer::Beta::BaseButton": {
     "DEFAULT_TAG": "button",
     "DEFAULT_TYPE": "button",
@@ -664,6 +670,19 @@
       "span"
     ]
   },
+  "Primer::Beta::ProgressBar": {
+    "SIZE_DEFAULT": "default",
+    "SIZE_MAPPINGS": {
+      "default": "",
+      "small": "Progress--small",
+      "large": "Progress--large"
+    },
+    "SIZE_OPTIONS": [
+      "default",
+      "small",
+      "large"
+    ]
+  },
   "Primer::Beta::Text": {
     "DEFAULT_TAG": "span"
   },
@@ -883,17 +902,6 @@
     "DEFAULT_HEADING_TAG": "h4"
   },
   "Primer::ProgressBarComponent": {
-    "SIZE_DEFAULT": "default",
-    "SIZE_MAPPINGS": {
-      "default": "",
-      "small": "Progress--small",
-      "large": "Progress--large"
-    },
-    "SIZE_OPTIONS": [
-      "default",
-      "small",
-      "large"
-    ]
   },
   "Primer::SpinnerComponent": {
     "DEFAULT_SIZE": "medium",

package/static/statuses.json

@@ -5,6 +5,7 @@
   "Primer::Alpha::ActionList::Item": "alpha",
   "Primer::Alpha::AutoComplete": "deprecated",
   "Primer::Alpha::AutoComplete::Item": "deprecated",
+  "Primer::Alpha::Banner": "alpha",
   "Primer::Alpha::ButtonMarketing": "alpha",
   "Primer::Alpha::Dialog": "alpha",
   "Primer::Alpha::Dialog::Body": "alpha",
@@ -33,7 +34,6 @@
   "Primer::Beta::AutoComplete::Item": "beta",
   "Primer::Beta::Avatar": "beta",
   "Primer::Beta::AvatarStack": "beta",
-  "Primer::Beta::Banner": "beta",
   "Primer::Beta::BaseButton": "beta",
   "Primer::Beta::Blankslate": "beta",
   "Primer::Beta::BorderBox": "beta",
@@ -50,6 +50,7 @@
   "Primer::Beta::IconButton": "beta",
   "Primer::Beta::Label": "beta",
   "Primer::Beta::Link": "beta",
+  "Primer::Beta::ProgressBar": "beta",
   "Primer::Beta::Text": "beta",
   "Primer::Beta::Truncate": "beta",
   "Primer::Beta::Truncate::TruncateText": "alpha",
@@ -78,7 +79,7 @@
   "Primer::OcticonComponent": "beta",
   "Primer::OcticonSymbolsComponent": "alpha",
   "Primer::PopoverComponent": "beta",
-  "Primer::ProgressBarComponent": "beta",
+  "Primer::ProgressBarComponent": "deprecated",
   "Primer::SpinnerComponent": "beta",
   "Primer::StateComponent": "beta",
   "Primer::SubheadComponent": "beta",

package/app/components/primer/beta/banner.css.json

@@ -1 +0,0 @@
-{"name":"primer/beta/banner","selectors":[".Banner",".Banner .Banner-actions",".Banner .Banner-visual",".Banner .Banner-visual>.octicon",".Banner .Banner-visual>*",".Banner .Banner-message",".Banner .Banner-close",".Banner .Banner-visual .octicon",".Banner.Banner--warning",".Banner.Banner--warning .Banner-visual .octicon",".Banner.Banner--error",".Banner.Banner--error .Banner-visual .octicon",".Banner.Banner--success",".Banner.Banner--success .Banner-visual .octicon",".Banner.Banner--full",".Banner.Banner--full-whenNarrow"]}