cloudcommerce 0.0.85 → 0.0.87

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 (49) hide show
  1. package/.vscode/settings.json +0 -3
  2. package/CHANGELOG.md +17 -0
  3. package/action.yml +1 -0
  4. package/package.json +1 -1
  5. package/packages/api/package.json +1 -1
  6. package/packages/apps/correios/package.json +1 -1
  7. package/packages/apps/custom-shipping/package.json +1 -1
  8. package/packages/apps/discounts/package.json +1 -1
  9. package/packages/apps/frenet/package.json +1 -1
  10. package/packages/apps/tiny-erp/package.json +1 -1
  11. package/packages/cli/package.json +1 -1
  12. package/packages/config/package.json +1 -1
  13. package/packages/events/package.json +1 -1
  14. package/packages/firebase/package.json +1 -1
  15. package/packages/modules/package.json +1 -1
  16. package/packages/passport/package.json +1 -1
  17. package/packages/ssr/package.json +1 -1
  18. package/packages/storefront/astro.config.mjs +1 -4
  19. package/packages/storefront/dist/client/assets/_...73e01db2.css +4 -0
  20. package/packages/storefront/dist/client/assets/{_...2fc8f657.css → _...ee104f19.css} +1 -1
  21. package/packages/storefront/dist/server/entry.mjs +154 -185
  22. package/packages/storefront/package.json +1 -2
  23. package/packages/storefront/src/assets/pico.css +2626 -0
  24. package/packages/storefront/src/lib/helpers/image.ts +24 -10
  25. package/packages/storefront/src/lib/layouts/Base.astro +4 -105
  26. package/packages/storefront/src/lib/layouts/BaseBody.astro +108 -0
  27. package/packages/storefront/src/lib/layouts/PagesHeader.astro +1 -1
  28. package/packages/storefront/src/lib/main/Fallback.astro +15 -0
  29. package/packages/storefront/src/lib/main/Home.astro +1 -66
  30. package/packages/storefront/src/lib/main/Wildcard.astro +21 -0
  31. package/packages/storefront/src/lib/ssr-context.ts +2 -2
  32. package/packages/storefront/src/pages/[...slug].astro +10 -2
  33. package/packages/storefront/src/pages/fallback.astro +8 -2
  34. package/packages/storefront/src/pages/index.astro +3 -0
  35. package/packages/types/package.json +1 -1
  36. package/packages/events/lib/firebase.js +0 -5
  37. package/packages/events/lib/firebase.js.map +0 -1
  38. package/packages/events/lib/index.js +0 -2
  39. package/packages/events/lib/index.js.map +0 -1
  40. package/packages/storefront/dist/client/assets/_...7af61807.css +0 -4
  41. package/packages/storefront/dist/client/assets/_...b330a555.css +0 -1
  42. package/packages/storefront/dist/client/assets/fallback-index.552fd862.css +0 -1
  43. package/packages/storefront/dist/client/assets/fallback.a3f85892.css +0 -1
  44. package/packages/storefront/dist/client/assets/index.73f26ab5.css +0 -1
  45. package/packages/storefront/src/lib/components/Card.astro +0 -74
  46. package/packages/storefront/src/lib/views/[...slug].astro +0 -77
  47. package/packages/storefront/src/lib/views/app/index.astro +0 -0
  48. package/packages/storefront/src/lib/views/fallback.astro +0 -81
  49. package/packages/storefront/src/lib/views/index.astro +0 -88
@@ -14,21 +14,35 @@ const tryImageSize = (src: string) => {
14
14
  return dimensions;
15
15
  };
16
16
 
17
- const getImage = (options: Parameters<typeof _getImage>[0]) => {
18
- const { src } = options;
17
+ const getImage = async (options: Parameters<typeof _getImage>[0]) => {
18
+ if (options.width) {
19
+ options.width *= 2;
20
+ } else if (options.height) {
21
+ options.height *= 2;
22
+ }
19
23
  if (
20
- typeof src === 'string'
24
+ typeof options.src === 'string'
21
25
  && !options.aspectRatio
22
26
  && (!options.width || !options.height)
23
27
  ) {
24
- const { width, height } = tryImageSize(src);
25
- return _getImage({
26
- width,
27
- ...options,
28
- aspectRatio: width && height ? width / height : 1,
29
- });
28
+ const { width, height } = tryImageSize(options.src);
29
+ if (width) {
30
+ if (!options.width) {
31
+ options.width = width;
32
+ }
33
+ options.aspectRatio = height ? width / height : 1;
34
+ }
35
+ }
36
+ const imgAttrs = await _getImage(options);
37
+ imgAttrs.src += imgAttrs.src.includes('?') ? '&' : '?';
38
+ imgAttrs.src += `V=${import.meta.env.DEPLOY_RAND || '_'}`;
39
+ if (typeof imgAttrs.width === 'number') {
40
+ imgAttrs.width /= 2;
41
+ }
42
+ if (typeof imgAttrs.height === 'number') {
43
+ imgAttrs.height /= 2;
30
44
  }
31
- return _getImage(options);
45
+ return imgAttrs;
32
46
  };
33
47
 
34
48
  export default getImage;
@@ -1,10 +1,9 @@
1
1
  ---
2
2
  import type CmsCode from '../../types/cms-code';
3
3
  import type { PageContext } from '../ssr-context';
4
- import Color from 'color';
5
4
  import BaseHead from './BaseHead.astro';
6
5
  import BaseStateJson from './BaseStateJson.astro';
7
- import '@picocss/pico/css/pico.min.css';
6
+ import BaseBody from './BaseBody.astro';
8
7
 
9
8
  export interface Props {
10
9
  pageContext: PageContext;
@@ -12,50 +11,10 @@ export interface Props {
12
11
  }
13
12
 
14
13
  const { pageContext, title } = Astro.props as Props;
15
- const {
16
- lang,
17
- primaryColor,
18
- secondaryColor,
19
- cms,
20
- } = pageContext;
14
+ const { cms } = pageContext;
21
15
  const cmsCustomCode = cms('code') as CmsCode;
22
-
23
- const brandColors = {
24
- primary: primaryColor,
25
- secondary: secondaryColor,
26
- ...globalThis.storefront_brand_colors,
27
- };
28
- const colorVariants = {
29
- '50': -0.75, // whiter
30
- '100': -0.5, // white
31
- '200': -0.33, // lightest
32
- '300': -0.21, // lighter
33
- '400': -0.1, // light
34
- '500': 0,
35
- '600': 0.1, // dark
36
- '700': 0.16, // darker
37
- '800': 0.22, // darkest
38
- '900': 0.5, // black
39
- ...globalThis.storefront_color_variants,
40
- };
41
- const colorCSSVars: Record<string, string> = {};
42
- Object.keys(brandColors).forEach((colorName) => {
43
- const color = Color(brandColors[colorName]);
44
- Object.keys(colorVariants).forEach((colorVariant) => {
45
- const colorShift = colorVariants[colorVariant];
46
- const colorLabel = `${colorName}-${colorVariant}`;
47
- colorCSSVars[colorLabel] = color.darken(colorShift).hex();
48
- if (Number(colorVariant) > 100 && Number(colorVariant) < 900) {
49
- colorCSSVars[`${colorLabel}-yiq`] = color.isLight()
50
- ? 'var(--yiq-text-dark)' : 'var(--yiq-text-light)';
51
- colorCSSVars[`${colorLabel}-rgb`] = `${color.red()}, ${color.green()}, ${color.blue()}`;
52
- }
53
- });
54
- });
55
16
  ---
56
17
 
57
- <!DOCTYPE html>
58
- <html lang={lang.replace('_', '-')}>
59
18
  <head>
60
19
  <BaseHead pageContext={pageContext} title={title} />
61
20
  <BaseStateJson pageContext={pageContext} />
@@ -64,69 +23,9 @@ Object.keys(brandColors).forEach((colorName) => {
64
23
  {cmsCustomCode.html_head && <Fragment set:html={cmsCustomCode.html_head} />}
65
24
  </slot>
66
25
  </head>
67
-
68
- <body>
26
+ <BaseBody pageContext={pageContext}>
69
27
  <slot />
70
- <script>
71
- import { registerSW } from 'virtual:pwa-register';
72
- import { initializeApp } from 'firebase/app';
73
- registerSW();
74
- const firebaseConfig = window.firebaseConfig || {
75
- apiKey: "AIzaSyCrVzemDgpyp9i6ni7Yc5ZuEVfXYwl-4J0",
76
- authDomain: "ecom2-002.firebaseapp.com",
77
- projectId: "ecom2-002",
78
- storageBucket: "ecom2-002.appspot.com",
79
- messagingSenderId: "402807248219",
80
- appId: "1:402807248219:web:cf7d57759751e74776367e",
81
- measurementId: "G-SC592CE0GB"
82
- };
83
- initializeApp(firebaseConfig);
84
- </script>
85
28
  <slot name="before-body-end">
86
29
  {cmsCustomCode.html_body && <Fragment set:html={cmsCustomCode.html_body} />}
87
30
  </slot>
88
- </body>
89
- </html>
90
-
91
- <style is:global define:vars={colorCSSVars}>
92
- :root {
93
- --content-max-width: 80rem;
94
- --white: #fff;
95
- --gray-50: theme('colors.gray.50');
96
- --gray-200: theme('colors.gray.200');
97
- --gray-700: theme('colors.gray.700');
98
- --gray-800: theme('colors.gray.800');
99
- --gray-900: theme('colors.gray.900');
100
- --surface-color: var(--gray-50);
101
- --surface-border-color: var(--gray-200);
102
- --yiq-text-light: var(--white);
103
- --yiq-text-dark: var(--gray-900);
104
- }
105
- body,
106
- body [data-theme=light],
107
- body [data-theme=dark] {
108
- --primary: var(--primary-500);
109
- --primary-hover: var(--primary-700);
110
- --primary-focus: rgba(var(--primary-200-rgb), 0.2);
111
- --primary-inverse: var(--primary-500-yiq);
112
- --secondary: var(--secondary-500);
113
- --secondary-hover: var(--secondary-700);
114
- --secondary-focus: rgba(var(--secondary-200-rgb), 0.2);
115
- --secondary-inverse: var(--secondary-500-yiq);
116
- }
117
- @media only screen and (prefers-color-scheme: dark) {
118
- :root:not([data-theme=light]) {
119
- --surface-color: var(--gray-800);
120
- --surface-border-color: var(--gray-700);
121
- }
122
- :root:not([data-theme=light]) a {
123
- --color: var(--primary-200);
124
- }
125
- :root:not([data-theme=light]) a:is([aria-current], :hover, :active, :focus) {
126
- --color: var(--primary-400);
127
- }
128
- }
129
- body {
130
- overflow-x: hidden;
131
- }
132
- </style>
31
+ </BaseBody>
@@ -0,0 +1,108 @@
1
+ ---
2
+ import type { PageContext } from '../ssr-context';
3
+ import Color from 'color';
4
+ import '../../assets/pico.css';
5
+
6
+ export interface Props {
7
+ pageContext: PageContext;
8
+ }
9
+
10
+ const { pageContext } = Astro.props as Props;
11
+ const { primaryColor, secondaryColor } = pageContext;
12
+
13
+ const brandColors = {
14
+ primary: primaryColor,
15
+ secondary: secondaryColor,
16
+ ...globalThis.storefront_brand_colors,
17
+ };
18
+ const colorVariants = {
19
+ '50': -0.75, // whiter
20
+ '100': -0.5, // white
21
+ '200': -0.33, // lightest
22
+ '300': -0.21, // lighter
23
+ '400': -0.1, // light
24
+ '500': 0,
25
+ '600': 0.1, // dark
26
+ '700': 0.16, // darker
27
+ '800': 0.22, // darkest
28
+ '900': 0.5, // black
29
+ ...globalThis.storefront_color_variants,
30
+ };
31
+ const colorCSSVars: Record<string, string> = {};
32
+ Object.keys(brandColors).forEach((colorName) => {
33
+ const color = Color(brandColors[colorName]);
34
+ Object.keys(colorVariants).forEach((colorVariant) => {
35
+ const colorShift = colorVariants[colorVariant];
36
+ const colorLabel = `${colorName}-${colorVariant}`;
37
+ colorCSSVars[colorLabel] = color.darken(colorShift).hex();
38
+ if (Number(colorVariant) > 100 && Number(colorVariant) < 900) {
39
+ colorCSSVars[`${colorLabel}-yiq`] = color.isLight()
40
+ ? 'var(--yiq-text-dark)' : 'var(--yiq-text-light)';
41
+ colorCSSVars[`${colorLabel}-rgb`] = `${color.red()}, ${color.green()}, ${color.blue()}`;
42
+ }
43
+ });
44
+ });
45
+ ---
46
+
47
+ <body>
48
+ <slot />
49
+ <script>
50
+ import { registerSW } from 'virtual:pwa-register';
51
+ import { initializeApp } from 'firebase/app';
52
+ registerSW();
53
+ const firebaseConfig = window.firebaseConfig || {
54
+ apiKey: "AIzaSyCrVzemDgpyp9i6ni7Yc5ZuEVfXYwl-4J0",
55
+ authDomain: "ecom2-002.firebaseapp.com",
56
+ projectId: "ecom2-002",
57
+ storageBucket: "ecom2-002.appspot.com",
58
+ messagingSenderId: "402807248219",
59
+ appId: "1:402807248219:web:cf7d57759751e74776367e",
60
+ measurementId: "G-SC592CE0GB"
61
+ };
62
+ initializeApp(firebaseConfig);
63
+ </script>
64
+ <slot name="before-body-end" />
65
+ </body>
66
+
67
+ <style is:global define:vars={colorCSSVars}>
68
+ :root {
69
+ --content-max-width: 80rem;
70
+ --white: #fff;
71
+ --gray-50: #f9fafb;
72
+ --gray-200: #e5e7eb;
73
+ --gray-700: #374151;
74
+ --gray-800: #1f2937;
75
+ --gray-900: #111827;
76
+ --surface-color: var(--gray-50);
77
+ --surface-border-color: var(--gray-200);
78
+ --yiq-text-light: var(--white);
79
+ --yiq-text-dark: var(--gray-900);
80
+ }
81
+ body,
82
+ body [data-theme=light],
83
+ body [data-theme=dark] {
84
+ --primary: var(--primary-500);
85
+ --primary-hover: var(--primary-700);
86
+ --primary-focus: rgba(var(--primary-200-rgb), 0.2);
87
+ --primary-inverse: var(--primary-500-yiq);
88
+ --secondary: var(--secondary-500);
89
+ --secondary-hover: var(--secondary-700);
90
+ --secondary-focus: rgba(var(--secondary-200-rgb), 0.2);
91
+ --secondary-inverse: var(--secondary-500-yiq);
92
+ }
93
+ @media only screen and (prefers-color-scheme: dark) {
94
+ :root:not([data-theme=light]) {
95
+ --surface-color: var(--gray-800);
96
+ --surface-border-color: var(--gray-700);
97
+ }
98
+ :root:not([data-theme=light]) a {
99
+ --color: var(--primary-200);
100
+ }
101
+ :root:not([data-theme=light]) a:is([aria-current], :hover, :active, :focus) {
102
+ --color: var(--primary-400);
103
+ }
104
+ }
105
+ body {
106
+ overflow-x: hidden;
107
+ }
108
+ </style>
@@ -70,7 +70,7 @@ globalThis.TopBarProps = {
70
70
  hasPhoneLinks: header.contacts_stripe.phone_wpp,
71
71
  hasNetworkLinks: header.contacts_stripe.socials,
72
72
  contacts,
73
- ...Astro.props.topBarProps,
73
+ ...topBarProps,
74
74
  };
75
75
 
76
76
  const logoWebpAttrs = await getImage({
@@ -0,0 +1,15 @@
1
+ ---
2
+ import type { PageContext } from '../ssr-context';
3
+
4
+ export interface Props {
5
+ pageContext?: PageContext;
6
+ }
7
+ ---
8
+
9
+ <main>
10
+ <h1>Error :/</h1>
11
+ <p class="instructions">
12
+ Check out the <code>src/pages</code> directory to get started.<br/>
13
+ <strong>Code Challenge:</strong> Tweak the "Welcome to Astro" message above.
14
+ </p>
15
+ </main>
@@ -1,7 +1,6 @@
1
1
  ---
2
2
  import type { PageContext } from '../ssr-context';
3
3
  import api from '@cloudcommerce/api';
4
- import Card from '../components/Card.astro';
5
4
 
6
5
  export interface Props {
7
6
  pageContext: PageContext;
@@ -11,74 +10,10 @@ const products = (await api.get('products')).data.result;
11
10
  ---
12
11
 
13
12
  <main>
14
- <h1>Welcome to <span class="text-gradient">Astro</span></h1>
15
- <p class="instructions">
16
- Check out the <code>src/pages</code> directory to get started.<br/>
17
- <strong>Code Challenge:</strong> Tweak the "Welcome to Astro" message above.
18
- </p>
19
- <ul role="list" class="link-card-grid">
20
- <Card href="https://docs.astro.build/" title="Documentation" body="Learn how Astro works and explore the official API docs." />
21
- <Card href="https://astro.build/integrations/" title="Integrations" body="Supercharge your project with new frameworks and libraries." />
22
- <Card href="https://astro.build/themes/" title="Themes" body="Explore a galaxy of community-built starter themes." />
23
- <Card href="https://astro.build/chat/" title="Chat" body="Come say hi to our amazing Discord community. ❤️" />
24
- </ul>
13
+ <h1>Welcome to <span class="text-primary">Astro</span></h1>
25
14
  <ul role="list" class="mt-3 fs-20">
26
15
  {products.map((product) => <li>
27
16
  <a href={`/${product.slug}`}>{product.sku}</a>
28
17
  </li>)}
29
18
  </ul>
30
19
  </main>
31
-
32
- <style>
33
- :root {
34
- --astro-gradient: linear-gradient(0deg,#4F39FA, #DA62C4);
35
- }
36
-
37
- h1 {
38
- margin: 2rem 0;
39
- }
40
-
41
- main {
42
- margin: auto;
43
- padding: 1em;
44
- max-width: 60ch;
45
- }
46
-
47
- .text-gradient {
48
- font-weight: 900;
49
- background-image: var(--astro-gradient);
50
- -webkit-background-clip: text;
51
- -webkit-text-fill-color: transparent;
52
- background-size: 100% 200%;
53
- background-position-y: 100%;
54
- border-radius: 0.4rem;
55
- animation: pulse 4s ease-in-out infinite;
56
- }
57
-
58
- @keyframes pulse {
59
- 0%, 100% { background-position-y: 0%; }
60
- 50% { background-position-y: 80%; }
61
- }
62
-
63
- .instructions {
64
- line-height: 1.6;
65
- margin: 1rem 0;
66
- background: #4F39FA;
67
- padding: 1.0rem;
68
- border-radius: 0.4rem;
69
- color: var(--color-bg);
70
- }
71
-
72
- .instructions code {
73
- font-size: 0.875em;
74
- border: 0.1em solid var(--color-border);
75
- border-radius: 4px;
76
- padding: 0.15em 0.25em;
77
- }
78
- .link-card-grid {
79
- display: grid;
80
- grid-template-columns: repeat(auto-fit, minmax(24ch, 1fr));
81
- gap: 1rem;
82
- padding: 0;
83
- }
84
- </style>
@@ -0,0 +1,21 @@
1
+ ---
2
+ import type { PageContext } from '../ssr-context';
3
+
4
+ export interface Props {
5
+ pageContext: PageContext;
6
+ }
7
+
8
+ const {
9
+ pageContext: { apiResource, apiDoc },
10
+ } = Astro.props as Props;
11
+ ---
12
+
13
+ <main>
14
+ <h1>Hello <span class="text-gradient">{apiDoc.name}</span></h1>
15
+ <hr>
16
+ <div class="mt-3">
17
+ <mark>{apiDoc._id}</mark> from <i>{apiResource}</i>
18
+ <p>{Math.random()}</p>
19
+ <em>Lorem ipsum dolor sit amet</em>
20
+ </div>
21
+ </main>
@@ -96,11 +96,11 @@ const loadPageContext = async (Astro: AstroGlobal, {
96
96
  Astro.response.headers.set('X-SSR-Error', error.message);
97
97
  }
98
98
  Astro.response.status = status;
99
- err.responseHTML = `<html><head>
99
+ err.responseHTML = `<head>
100
100
  <meta http-equiv="refresh" content="0;
101
101
  url=/fallback?status=${status}&url=${encodeURIComponent(urlPath)}"/>
102
102
  </head>
103
- <body></body></html>`;
103
+ <body></body>`;
104
104
  throw err;
105
105
  }
106
106
  if (urlPath === '/fallback') {
@@ -1,6 +1,7 @@
1
1
  ---
2
- import ViewWildcard from '../lib/views/[...slug].astro';
3
2
  import loadPageContext, { PageContext } from '../lib/ssr-context';
3
+ import PagesLayout from '../lib/layouts/Pages.astro';
4
+ import WildcardMain from '../lib/main/Wildcard.astro';
4
5
 
5
6
  if (String(Astro.params.slug).endsWith('.css.map')) {
6
7
  return new Response(null, { status: 404 });
@@ -18,5 +19,12 @@ try {
18
19
  }
19
20
  ---
20
21
 
21
- {pageContext && <ViewWildcard pageContext={pageContext} />}
22
+ <!DOCTYPE html>
23
+ <html lang={pageContext?.lang.replace('_', '-')}>
24
+ {pageContext &&
25
+ <PagesLayout pageContext={pageContext}>
26
+ <WildcardMain pageContext={pageContext} />
27
+ </PagesLayout>
28
+ }
22
29
  {loadError && <Fragment set:html={loadError.responseHTML} />}
30
+ </html>
@@ -1,6 +1,7 @@
1
1
  ---
2
- import ViewFallback from '../lib/views/fallback.astro';
3
2
  import loadPageContext, { PageContext } from '../lib/ssr-context';
3
+ import PagesLayout from '../lib/layouts/Pages.astro';
4
+ import FallbackMain from '../lib/main/Fallback.astro';
4
5
 
5
6
  let pageContext: PageContext;
6
7
  try {
@@ -10,4 +11,9 @@ try {
10
11
  }
11
12
  ---
12
13
 
13
- <ViewFallback pageContext={pageContext} />
14
+ <!DOCTYPE html>
15
+ <html lang={pageContext?.lang.replace('_', '-')}>
16
+ <PagesLayout pageContext={pageContext}>
17
+ <FallbackMain pageContext={pageContext} />
18
+ </PagesLayout>
19
+ </html>
@@ -15,9 +15,12 @@ try {
15
15
  }
16
16
  ---
17
17
 
18
+ <!DOCTYPE html>
19
+ <html lang={pageContext?.lang.replace('_', '-')}>
18
20
  {pageContext &&
19
21
  <PagesLayout pageContext={pageContext}>
20
22
  <HomeMain pageContext={pageContext} />
21
23
  </PagesLayout>
22
24
  }
23
25
  {loadError && <Fragment set:html={loadError.responseHTML} />}
26
+ </html>
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@cloudcommerce/types",
3
3
  "type": "module",
4
- "version": "0.0.85",
4
+ "version": "0.0.87",
5
5
  "description": "E-Com Plus Cloud Commerce reusable type definitions",
6
6
  "main": "index.ts",
7
7
  "repository": {
@@ -1,5 +0,0 @@
1
- /* eslint-disable import/prefer-default-export */
2
- import '@cloudcommerce/firebase/lib/init';
3
-
4
- export * from '@cloudcommerce/app-tiny-erp';
5
- // # sourceMappingURL=firebase.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"firebase.js","sourceRoot":"","sources":["../src/firebase.ts"],"names":[],"mappings":"AAAA,iDAAiD;AACjD,OAAO,kCAAkC,CAAC;AAE1C,cAAc,6BAA6B,CAAC"}
@@ -1,2 +0,0 @@
1
- import './firebase.js';
2
- // # sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,YAAY,CAAC"}