@a-type/ui 6.0.7 → 6.0.8

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 (11) hide show
  1. package/dist/components/splashScreen/SplashScreen.d.ts +5 -0
  2. package/dist/components/splashScreen/SplashScreen.js +9 -0
  3. package/dist/components/splashScreen/SplashScreen.js.map +1 -0
  4. package/dist/components/splashScreen/SplashScreen.module.css +54 -0
  5. package/dist/components/splashScreen/SplashScreen.stories.d.ts +17 -0
  6. package/dist/components/splashScreen/SplashScreen.stories.js +17 -0
  7. package/dist/components/splashScreen/SplashScreen.stories.js.map +1 -0
  8. package/package.json +1 -1
  9. package/src/components/splashScreen/SplashScreen.module.css +54 -0
  10. package/src/components/splashScreen/SplashScreen.stories.tsx +27 -0
  11. package/src/components/splashScreen/SplashScreen.tsx +11 -0
package/dist/components/splashScreen/SplashScreen.d.ts ADDED
@@ -0,0 +1,5 @@
1
+ export declare const SplashScreenRoot: import("react").FunctionComponent<import("../utility/SlotDiv.js").SlotDivProps>;
2
+ export declare const SplashScreenIcon: import("react").FunctionComponent<import("../utility/SlotDiv.js").SlotDivProps>;
3
+ export declare const SplashScreen: import("react").FunctionComponent<import("../utility/SlotDiv.js").SlotDivProps> & {
4
+ Icon: import("react").FunctionComponent<import("../utility/SlotDiv.js").SlotDivProps>;
5
+ };
package/dist/components/splashScreen/SplashScreen.js ADDED
@@ -0,0 +1,9 @@
1
+ import { withClassName } from '../../hooks.js';
2
+ import { SlotDiv } from '../utility/SlotDiv.js';
3
+ import cls from './SplashScreen.module.css';
4
+ export const SplashScreenRoot = withClassName(SlotDiv, cls.root);
5
+ export const SplashScreenIcon = withClassName(SlotDiv, cls.icon);
6
+ export const SplashScreen = Object.assign(SplashScreenRoot, {
7
+ Icon: SplashScreenIcon,
8
+ });
9
+ //# sourceMappingURL=SplashScreen.js.map
package/dist/components/splashScreen/SplashScreen.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SplashScreen.js","sourceRoot":"","sources":["../../../src/components/splashScreen/SplashScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAChD,OAAO,GAAG,MAAM,2BAA2B,CAAC;AAE5C,MAAM,CAAC,MAAM,gBAAgB,GAAG,aAAa,CAAC,OAAO,EAAE,GAAG,CAAC,IAAI,CAAC,CAAC;AAEjE,MAAM,CAAC,MAAM,gBAAgB,GAAG,aAAa,CAAC,OAAO,EAAE,GAAG,CAAC,IAAI,CAAC,CAAC;AAEjE,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAC,gBAAgB,EAAE;IAC3D,IAAI,EAAE,gBAAgB;CACtB,CAAC,CAAC"}
package/dist/components/splashScreen/SplashScreen.module.css ADDED
@@ -0,0 +1,54 @@
1
+ .root {
2
+ position: relative;
3
+ width: 100%;
4
+ height: 100%;
5
+ display: flex;
6
+ flex-grow: 1;
7
+ align-items: center;
8
+ justify-content: center;
9
+ }
10
+
11
+ .icon {
12
+ margin: auto;
13
+ height: 20vmax;
14
+ width: 20vmax;
15
+ animation-name: fade-and-pop;
16
+ animation-duration: 5s;
17
+ animation-delay: 1s;
18
+ animation-timing-function: ease-in-out;
19
+ animation-iteration-count: infinite;
20
+ opacity: 0;
21
+
22
+ & > img,
23
+ & > svg {
24
+ width: 100%;
25
+ height: 100%;
26
+ }
27
+ }
28
+
29
+ @keyframes fade-and-pop {
30
+ 0% {
31
+ opacity: 0.2;
32
+ transform: scale(0.6);
33
+ }
34
+ 40% {
35
+ opacity: 0.5;
36
+ transform: scale(0.7);
37
+ }
38
+ 50% {
39
+ opacity: 1;
40
+ transform: scale(1.1) rotate(2deg);
41
+ }
42
+ 55% {
43
+ opacity: 1;
44
+ transform: scale(1);
45
+ }
46
+ 70% {
47
+ opacity: 1;
48
+ transform: scale(1);
49
+ }
50
+ 100% {
51
+ opacity: 0.2;
52
+ transform: scale(0.6);
53
+ }
54
+ }
package/dist/components/splashScreen/SplashScreen.stories.d.ts ADDED
@@ -0,0 +1,17 @@
1
+ import type { StoryObj } from '@storybook/react-vite';
2
+ import { SplashScreen } from './SplashScreen.js';
3
+ declare const meta: {
4
+ title: string;
5
+ component: import("react").FunctionComponent<import("../index.js").SlotDivProps> & {
6
+ Icon: import("react").FunctionComponent<import("../index.js").SlotDivProps>;
7
+ };
8
+ argTypes: {};
9
+ parameters: {
10
+ controls: {
11
+ expanded: boolean;
12
+ };
13
+ };
14
+ };
15
+ export default meta;
16
+ type Story = StoryObj<typeof SplashScreen>;
17
+ export declare const Default: Story;
package/dist/components/splashScreen/SplashScreen.stories.js ADDED
@@ -0,0 +1,17 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { SplashScreen } from './SplashScreen.js';
3
+ const meta = {
4
+ title: 'Components/SplashScreen',
5
+ component: SplashScreen,
6
+ argTypes: {},
7
+ parameters: {
8
+ controls: { expanded: true },
9
+ },
10
+ };
11
+ export default meta;
12
+ export const Default = {
13
+ render(args) {
14
+ return (_jsx(SplashScreen, Object.assign({}, args, { children: _jsx(SplashScreen.Icon, { children: _jsx("img", { src: "/android-chrome-512x512.png" }) }) })));
15
+ },
16
+ };
17
+ //# sourceMappingURL=SplashScreen.stories.js.map
package/dist/components/splashScreen/SplashScreen.stories.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SplashScreen.stories.js","sourceRoot":"","sources":["../../../src/components/splashScreen/SplashScreen.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,MAAM,IAAI,GAAG;IACZ,KAAK,EAAE,yBAAyB;IAChC,SAAS,EAAE,YAAY;IACvB,QAAQ,EAAE,EAAE;IACZ,UAAU,EAAE;QACX,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;KAC5B;CACmC,CAAC;AAEtC,eAAe,IAAI,CAAC;AAIpB,MAAM,CAAC,MAAM,OAAO,GAAU;IAC7B,MAAM,CAAC,IAAI;QACV,OAAO,CACN,KAAC,YAAY,oBAAK,IAAI,cACrB,KAAC,YAAY,CAAC,IAAI,cACjB,cAAK,GAAG,EAAC,6BAA6B,GAAG,GACtB,IACN,CACf,CAAC;IACH,CAAC;CACD,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@a-type/ui",
3
- "version": "6.0.7",
3
+ "version": "6.0.8",
4
4
  "type": "module",
5
5
  "repository": {
6
6
  "url": "https://github.com/a-type/ui"
package/src/components/splashScreen/SplashScreen.module.css ADDED
@@ -0,0 +1,54 @@
1
+ .root {
2
+ position: relative;
3
+ width: 100%;
4
+ height: 100%;
5
+ display: flex;
6
+ flex-grow: 1;
7
+ align-items: center;
8
+ justify-content: center;
9
+ }
10
+
11
+ .icon {
12
+ margin: auto;
13
+ height: 20vmax;
14
+ width: 20vmax;
15
+ animation-name: fade-and-pop;
16
+ animation-duration: 5s;
17
+ animation-delay: 1s;
18
+ animation-timing-function: ease-in-out;
19
+ animation-iteration-count: infinite;
20
+ opacity: 0;
21
+
22
+ & > img,
23
+ & > svg {
24
+ width: 100%;
25
+ height: 100%;
26
+ }
27
+ }
28
+
29
+ @keyframes fade-and-pop {
30
+ 0% {
31
+ opacity: 0.2;
32
+ transform: scale(0.6);
33
+ }
34
+ 40% {
35
+ opacity: 0.5;
36
+ transform: scale(0.7);
37
+ }
38
+ 50% {
39
+ opacity: 1;
40
+ transform: scale(1.1) rotate(2deg);
41
+ }
42
+ 55% {
43
+ opacity: 1;
44
+ transform: scale(1);
45
+ }
46
+ 70% {
47
+ opacity: 1;
48
+ transform: scale(1);
49
+ }
50
+ 100% {
51
+ opacity: 0.2;
52
+ transform: scale(0.6);
53
+ }
54
+ }
package/src/components/splashScreen/SplashScreen.stories.tsx ADDED
@@ -0,0 +1,27 @@
1
+ import type { Meta, StoryObj } from '@storybook/react-vite';
2
+ import { SplashScreen } from './SplashScreen.js';
3
+
4
+ const meta = {
5
+ title: 'Components/SplashScreen',
6
+ component: SplashScreen,
7
+ argTypes: {},
8
+ parameters: {
9
+ controls: { expanded: true },
10
+ },
11
+ } satisfies Meta<typeof SplashScreen>;
12
+
13
+ export default meta;
14
+
15
+ type Story = StoryObj<typeof SplashScreen>;
16
+
17
+ export const Default: Story = {
18
+ render(args) {
19
+ return (
20
+ <SplashScreen {...args}>
21
+ <SplashScreen.Icon>
22
+ <img src="/android-chrome-512x512.png" />
23
+ </SplashScreen.Icon>
24
+ </SplashScreen>
25
+ );
26
+ },
27
+ };
package/src/components/splashScreen/SplashScreen.tsx ADDED
@@ -0,0 +1,11 @@
1
+ import { withClassName } from '../../hooks.js';
2
+ import { SlotDiv } from '../utility/SlotDiv.js';
3
+ import cls from './SplashScreen.module.css';
4
+
5
+ export const SplashScreenRoot = withClassName(SlotDiv, cls.root);
6
+
7
+ export const SplashScreenIcon = withClassName(SlotDiv, cls.icon);
8
+
9
+ export const SplashScreen = Object.assign(SplashScreenRoot, {
10
+ Icon: SplashScreenIcon,
11
+ });