@getflip/swirl-components 0.200.0 → 0.200.1

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.
Files changed (13) hide show
  1. package/components.json +1 -1
  2. package/dist/cjs/swirl-app-bar.cjs.entry.js +1 -1
  3. package/dist/collection/components/swirl-app-bar/swirl-app-bar.css +13 -6
  4. package/dist/collection/components/swirl-app-bar/swirl-app-bar.spec.js +3 -3
  5. package/dist/collection/components/swirl-app-bar/swirl-app-bar.stories.js +1 -1
  6. package/dist/collection/components/swirl-app-layout/swirl-app-layout.stories.js +2 -2
  7. package/dist/components/assets/pdfjs/pdf.worker.min.js +1 -1
  8. package/dist/components/swirl-app-bar.js +1 -1
  9. package/dist/esm/swirl-app-bar.entry.js +1 -1
  10. package/dist/swirl-components/p-ea460fec.entry.js +1 -0
  11. package/dist/swirl-components/swirl-components.esm.js +1 -1
  12. package/package.json +1 -1
  13. package/dist/swirl-components/p-f4d3c5d2.entry.js +0 -1
package/components.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "timestamp": "2024-05-16T11:56:51",
2
+ "timestamp": "2024-05-17T07:54:57",
3
3
  "compiler": {
4
4
  "name": "@stencil/core",
5
5
  "version": "4.18.1",
package/dist/cjs/swirl-app-bar.cjs.entry.js CHANGED
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  const index = require('./index-2ab5d772.js');
6
6
  const index$1 = require('./index-9f94303c.js');
7
7
 
8
- const swirlAppBarCss = ":host{display:block;overflow-x:auto;width:100%}:host *{box-sizing:border-box}.app-bar{display:flex;min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content;min-height:3.5rem;padding-right:var(--s-space-16);padding-left:var(--s-space-16);align-items:center;gap:var(--s-space-16)}.app-bar--has-cta .app-bar__cta{display:block}.app-bar:not(.app-bar--has-right-controls) .app-bar__right-controls{display:none}.app-bar__left-controls{display:flex;min-width:0;flex-shrink:0;align-items:center;gap:var(--s-space-16)}.app-bar__main-navigation-control{flex-shrink:0}.app-bar__cta{display:none}.app-bar__heading{display:flex;min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content;flex-grow:1;align-items:center}@media (min-width: 992px){.app-bar__heading{flex-grow:0}}.app-bar__stepper-controls{position:relative;display:flex;flex-shrink:0;gap:var(--s-space-4)}.app-bar__stepper-controls:not(:first-child){padding-left:var(--s-space-16)}.app-bar__stepper-controls:not(:first-child):after{position:absolute;top:50%;left:0;width:var(--s-border-width-default);height:1.25rem;background-color:var(--s-border-default);content:\"\";transform:translateY(-50%)}.app-bar__center-controls{display:none;flex-grow:1;justify-content:center;align-items:center}@media (min-width: 992px){.app-bar__center-controls{display:flex}}.app-bar__right-controls{display:flex;min-width:0;flex-shrink:0;justify-content:flex-end;align-items:center}";
8
+ const swirlAppBarCss = ":host{display:block;overflow-x:auto;width:100%}:host *{box-sizing:border-box}.app-bar{display:flex;min-height:3.5rem;padding-right:var(--s-space-16);padding-left:var(--s-space-16);align-items:center;gap:var(--s-space-16)}@media (min-width: 992px){.app-bar{min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content}}.app-bar--has-cta .app-bar__cta{display:block}.app-bar:not(.app-bar--has-right-controls) .app-bar__right-controls{display:none}.app-bar__left-controls{display:flex;min-width:0;flex-shrink:0;align-items:center;gap:var(--s-space-16)}.app-bar__main-navigation-control{flex-shrink:0}.app-bar__cta{display:none}.app-bar__heading{display:flex;min-width:10rem;flex-grow:1;align-items:center}@media (min-width: 992px){.app-bar__heading{min-width:-webkit-min-content;min-width:-moz-min-content;min-width:min-content;flex-grow:0}}.app-bar__stepper-controls{position:relative;display:flex;flex-shrink:0;gap:var(--s-space-4)}.app-bar__stepper-controls:not(:first-child){padding-left:var(--s-space-16)}.app-bar__stepper-controls:not(:first-child):after{position:absolute;top:50%;left:0;width:var(--s-border-width-default);height:1.25rem;background-color:var(--s-border-default);content:\"\";transform:translateY(-50%)}.app-bar__center-controls{display:none;flex-grow:1;justify-content:center;align-items:center}@media (min-width: 992px){.app-bar__center-controls{display:flex}}.app-bar__right-controls{display:flex;min-width:0;flex-shrink:0;justify-content:flex-end;align-items:center}";
9
9
  const SwirlAppBarStyle0 = swirlAppBarCss;
10
10
 
11
11
  const SwirlAppBar = class {
package/dist/collection/components/swirl-app-bar/swirl-app-bar.css CHANGED
@@ -10,9 +10,6 @@
10
10
 
11
11
  .app-bar {
12
12
  display: flex;
13
- min-width: -webkit-min-content;
14
- min-width: -moz-min-content;
15
- min-width: min-content;
16
13
  min-height: 3.5rem;
17
14
  padding-right: var(--s-space-16);
18
15
  padding-left: var(--s-space-16);
@@ -20,6 +17,15 @@
20
17
  gap: var(--s-space-16);
21
18
  }
22
19
 
20
+ @media (min-width: 992px) {
21
+
22
+ .app-bar {
23
+ min-width: -webkit-min-content;
24
+ min-width: -moz-min-content;
25
+ min-width: min-content
26
+ }
27
+ }
28
+
23
29
  .app-bar--has-cta .app-bar__cta {
24
30
  display: block;
25
31
  }
@@ -46,9 +52,7 @@
46
52
 
47
53
  .app-bar__heading {
48
54
  display: flex;
49
- min-width: -webkit-min-content;
50
- min-width: -moz-min-content;
51
- min-width: min-content;
55
+ min-width: 10rem;
52
56
  flex-grow: 1;
53
57
  align-items: center;
54
58
  }
@@ -56,6 +60,9 @@
56
60
  @media (min-width: 992px) {
57
61
 
58
62
  .app-bar__heading {
63
+ min-width: -webkit-min-content;
64
+ min-width: -moz-min-content;
65
+ min-width: min-content;
59
66
  flex-grow: 0
60
67
  }
61
68
  }
package/dist/collection/components/swirl-app-bar/swirl-app-bar.spec.js CHANGED
@@ -21,7 +21,7 @@ describe("swirl-app-bar", () => {
21
21
  expect(page.root).toEqualHtml(`
22
22
  <swirl-app-bar>
23
23
  <mock:shadow-root>
24
- <div class="app-bar app-bar--has-cta app-bar--has-right-controls" style="padding-inline-end: 16; padding-inline-start: 16;">
24
+ <div class="app-bar app-bar--has-cta app-bar--has-right-controls" style="padding-inline-end: var(--s-space-16); padding-inline-start: var(--s-space-16);">
25
25
  <div class="app-bar__cta">
26
26
  <slot name="cta"></slot>
27
27
  </div>
@@ -69,7 +69,7 @@ describe("swirl-app-bar", () => {
69
69
  expect(page.root).toEqualHtml(`
70
70
  <swirl-app-bar show-stepper-controls="true">
71
71
  <mock:shadow-root>
72
- <div class="app-bar" style="padding-inline-end: 16; padding-inline-start: 16;">
72
+ <div class="app-bar" style="padding-inline-end: var(--s-space-16); padding-inline-start: var(--s-space-16);">
73
73
  <div class="app-bar__left-controls">
74
74
  <div class="app-bar__stepper-controls">
75
75
  <swirl-button hidelabel="" icon="<swirl-icon-arrow-upward></swirl-icon-arrow-upward>" label="Previous item"></swirl-button>
@@ -107,7 +107,7 @@ describe("swirl-app-bar", () => {
107
107
  expect(page.root).toEqualHtml(`
108
108
  <swirl-app-bar show-close-button="true">
109
109
  <mock:shadow-root>
110
- <div class="app-bar" style="padding-inline-end: 16; padding-inline-start: 16;">
110
+ <div class="app-bar" style="padding-inline-end: var(--s-space-16); padding-inline-start: var(--s-space-16);">
111
111
  <div class="app-bar__left-controls">
112
112
  <div class="app-bar__main-navigation-control">
113
113
  <swirl-button hidelabel="" icon="<swirl-icon-close></swirl-icon-close>" label="Close"></swirl-button>
package/dist/collection/components/swirl-app-bar/swirl-app-bar.stories.js CHANGED
@@ -29,5 +29,5 @@ const Template = (args) => {
29
29
  export const SwirlAppBar = Template.bind({});
30
30
  SwirlAppBar.args = {
31
31
  showCloseButton: true,
32
- showStepperControls: true,
32
+ showStepperControls: false,
33
33
  };
package/dist/collection/components/swirl-app-layout/swirl-app-layout.stories.js CHANGED
@@ -45,10 +45,10 @@ const Template = (args) => {
45
45
  <swirl-button label="Scheduled"></swirl-button>
46
46
  </swirl-stack>
47
47
  </swirl-app-bar>
48
- <div slot="app-bar-controls">
48
+ <swirl-stack orientation="horizontal" slot="app-bar-controls">
49
49
  <swirl-button hide-label="true" icon="<swirl-icon-search></swirl-icon-search>" label="Search"></swirl-button>
50
50
  <swirl-button hide-label class="info-button" icon="<swirl-icon-info></swirl-icon-info>" label="More information"></swirl-button>
51
- </div>
51
+ </swirl-stack>
52
52
  <div slot="content"></div>
53
53
  <div slot="sidebar"></div>
54
54
  <swirl-button slot="floating-action-button" icon="<swirl-icon-add></swirl-icon-add>" label="CTA" variant="floating" intent="primary" hide-label="true"></swirl-button>