@inialum/memories-react 0.3.1 → 1.0.0
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.
- package/README.md +60 -12
- package/dist/assets/cross_icon.svg.js +6 -0
- package/dist/assets/inialum_logo_light_transparent.svg.js +6 -0
- package/dist/assets/inialum_logo_white_transparent.svg.js +6 -0
- package/dist/assets/menu_icon.svg.js +6 -0
- package/dist/assets/x_logo.svg.js +6 -0
- package/dist/components/{Button.d.ts → Button/Button.d.ts} +1 -1
- package/dist/components/Button/Button.js +59 -0
- package/dist/components/Button/Button.stories.d.ts +18 -0
- package/dist/components/Button/index.d.ts +1 -0
- package/dist/components/Button/index.js +2 -0
- package/dist/components/{ButtonLink.d.ts → ButtonLink/ButtonLink.d.ts} +1 -1
- package/dist/components/ButtonLink/ButtonLink.js +64 -0
- package/dist/components/ButtonLink/ButtonLink.stories.d.ts +19 -0
- package/dist/components/ButtonLink/index.d.ts +1 -0
- package/dist/components/ButtonLink/index.js +2 -0
- package/dist/components/Footer/Footer.js +105 -0
- package/dist/components/Footer/Footer.stories.d.ts +9 -0
- package/dist/components/Footer/index.d.ts +1 -0
- package/dist/components/Footer/index.js +2 -0
- package/dist/components/Header/Header.js +46 -0
- package/dist/components/Header/Header.stories.d.ts +11 -0
- package/dist/components/Header/index.d.ts +1 -0
- package/dist/components/Header/index.js +2 -0
- package/dist/components/Navigation/Navigation.js +153 -0
- package/dist/components/Navigation/Navigation.stories.d.ts +17 -0
- package/dist/components/Navigation/index.d.ts +1 -0
- package/dist/components/Navigation/index.js +2 -0
- package/dist/components/index.js +6 -0
- package/dist/index.js +5 -20482
- package/package.json +41 -31
- /package/dist/components/{Footer.d.ts → Footer/Footer.d.ts} +0 -0
- /package/dist/components/{Header.d.ts → Header/Header.d.ts} +0 -0
- /package/dist/components/{Navigation.d.ts → Navigation/Navigation.d.ts} +0 -0
package/README.md
CHANGED
|
@@ -8,36 +8,84 @@ React component library for the Memories - INIALUM Design System.
|
|
|
8
8
|
|
|
9
9
|
## Installation
|
|
10
10
|
|
|
11
|
-
|
|
11
|
+
This package requires [Tailwind CSS](https://tailwindcss.com/docs/installation) and React 19.
|
|
12
12
|
|
|
13
13
|
```bash
|
|
14
|
-
pnpm add
|
|
14
|
+
pnpm add @inialum/memories-tailwind-theme @inialum/memories-react
|
|
15
|
+
pnpm add -D tailwindcss
|
|
15
16
|
```
|
|
16
17
|
|
|
17
|
-
##
|
|
18
|
+
## Setup
|
|
18
19
|
|
|
19
|
-
|
|
20
|
-
|
|
20
|
+
### 1. Import CSS Styles
|
|
21
|
+
|
|
22
|
+
Import the Memories CSS theme in your global CSS file:
|
|
23
|
+
|
|
24
|
+
```css
|
|
25
|
+
/* src/index.css or src/app.css */
|
|
26
|
+
@import 'tailwindcss';
|
|
27
|
+
@import '@inialum/memories-tailwind-theme';
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
### 2. Add data-theme Attribute
|
|
31
|
+
|
|
32
|
+
Add the `data-theme` attribute to your HTML:
|
|
33
|
+
|
|
34
|
+
```html
|
|
35
|
+
<!doctype html>
|
|
36
|
+
<html lang="en" data-theme="memories">
|
|
37
|
+
<head>
|
|
38
|
+
<meta charset="UTF-8" />
|
|
39
|
+
<link rel="stylesheet" href="./styles.css" />
|
|
40
|
+
</head>
|
|
41
|
+
<body>
|
|
42
|
+
<div id="root"></div>
|
|
43
|
+
</body>
|
|
44
|
+
</html>
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
### 3. Tailwind CSS Configuration
|
|
48
|
+
|
|
49
|
+
Update your `tailwind.config.ts`:
|
|
21
50
|
|
|
22
51
|
```ts
|
|
23
52
|
// tailwind.config.ts
|
|
24
|
-
|
|
25
|
-
import { memories } from '@inialum/memories-css'
|
|
26
|
-
import { type Config } from 'tailwindcss'
|
|
53
|
+
import type { Config } from 'tailwindcss'
|
|
27
54
|
|
|
28
55
|
const config = {
|
|
29
56
|
content: [
|
|
30
|
-
'./src/**/*.{
|
|
31
|
-
|
|
32
|
-
// Do not forget to add this line!
|
|
57
|
+
'./src/**/*.{ts,tsx}',
|
|
33
58
|
'./node_modules/@inialum/memories-react/**/*.js',
|
|
34
59
|
],
|
|
35
|
-
plugins: [memories],
|
|
36
60
|
} satisfies Config
|
|
37
61
|
|
|
38
62
|
export default config
|
|
39
63
|
```
|
|
40
64
|
|
|
65
|
+
## Usage
|
|
66
|
+
|
|
67
|
+
```tsx
|
|
68
|
+
import { Button } from '@inialum/memories-react'
|
|
69
|
+
|
|
70
|
+
function App() {
|
|
71
|
+
return (
|
|
72
|
+
<Button variant="filled" color="primary" size="medium">
|
|
73
|
+
Click me
|
|
74
|
+
</Button>
|
|
75
|
+
)
|
|
76
|
+
}
|
|
77
|
+
```
|
|
78
|
+
|
|
79
|
+
## Components
|
|
80
|
+
|
|
81
|
+
- Button
|
|
82
|
+
- ButtonLink
|
|
83
|
+
- Footer
|
|
84
|
+
- Header
|
|
85
|
+
- Navigation
|
|
86
|
+
|
|
87
|
+
See [Storybook](https://memories-react.pages.dev) for detailed documentation and examples.
|
|
88
|
+
|
|
41
89
|
## License
|
|
42
90
|
|
|
43
91
|
Licensed under [Apache License 2.0](LICENSE). (except for images)
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
|
|
3
|
+
const SvgCrossIcon = (props) => /* @__PURE__ */ React.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M18 6L6 18", stroke: "white", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ React.createElement("path", { d: "M6 6L18 18", stroke: "white", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
4
|
+
|
|
5
|
+
export { SvgCrossIcon as default };
|
|
6
|
+
//# sourceMappingURL=cross_icon.svg.js.map
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
|
|
3
|
+
const SvgInialumLogoLightTransparent = (props) => /* @__PURE__ */ React.createElement("svg", { id: "_layer_1", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 180 180", width: "100%", height: "100%", ...props }, /* @__PURE__ */ React.createElement("defs", null, /* @__PURE__ */ React.createElement("style", null, ".cls-logo-light-1{fill:#221716;}.cls-logo-light-1,.cls-logo-light-2{stroke-width:0px;}.cls-logo-light-2{fill:#00b0eb;}")), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M32.39,129.43h2.98v20.8h-2.98v-20.8Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M56.51,129.43h2.83v20.8h-2.56l-13.91-16.02v16.02h-2.8v-20.8h2.41l14.02,16.15v-16.15Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M63.82,129.43h2.98v20.8h-2.98v-20.8Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M78.05,129.31h2.09l9.33,20.92h-3.05l-2.77-6.16h-8.87l-2.6,6.16h-3.06l8.93-20.92ZM82.43,141.41l-3.36-7.53-3.11,7.53h6.47Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M91.75,129.43h2.98v18.09h9.36v2.71h-12.34v-20.8Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M121.17,129.43h2.99v11.81c0,1.6-.12,2.8-.35,3.62-.23.81-.52,1.49-.86,2.03-.34.54-.76,1.03-1.26,1.45-1.65,1.42-3.8,2.13-6.46,2.13s-4.88-.71-6.52-2.11c-.5-.44-.92-.92-1.26-1.47-.34-.54-.63-1.2-.85-1.99-.22-.78-.33-2.01-.33-3.69v-11.78h2.99v11.81c0,1.96.22,3.32.67,4.08.45.76,1.13,1.38,2.04,1.84.91.46,1.99.69,3.23.69,1.77,0,3.21-.46,4.32-1.38.58-.5,1.01-1.08,1.27-1.76.26-.67.39-1.83.39-3.47v-11.81Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M144.82,129.43h2.78v20.8h-2.99v-16.18l-6.39,8.04h-.55l-6.47-8.04v16.18h-2.98v-20.8h2.82l6.91,8.54,6.87-8.54Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M43.85,157.63v6.82h-.53v-6.82h.53Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M51.55,157.63v6.82h-.43l-5.19-5.96v5.96h-.53v-6.82h.45l5.17,5.96v-5.96h.53Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M53.64,157.63v6.82h-.53v-6.82h.53Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M57.9,157.58l3.15,6.87h-.55l-1.08-2.36h-3.34l-1.08,2.36h-.55l3.15-6.87h.29ZM59.22,161.65l-1.47-3.21-1.46,3.21h2.93Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M61.87,157.63h2.39c1.21,0,2.13.32,2.77.95.64.63.95,1.46.95,2.46s-.32,1.8-.94,2.44c-.63.64-1.52.96-2.68.96h-2.48v-6.82ZM62.4,158.07v5.94h1.92c.88,0,1.62-.27,2.21-.81.59-.54.88-1.26.88-2.16s-.29-1.59-.87-2.14-1.33-.83-2.25-.83h-1.89Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M74.75,157.58l3.15,6.87h-.55l-1.08-2.36h-3.34l-1.08,2.36h-.55l3.15-6.87h.29ZM76.07,161.65l-1.47-3.21-1.46,3.21h2.93Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M79.12,157.63v6.82h-.48v-6.82h.48Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M83.6,164.45v-.74h-.02c-.21.3-.42.51-.64.64-.22.13-.5.19-.84.19-.48,0-.88-.16-1.2-.47s-.47-.75-.47-1.33v-2.78h.48v2.77c0,.42.11.74.34.98s.52.36.89.36c.31,0,.58-.07.8-.21.22-.14.44-.39.66-.74v-3.15h.48v4.49h-.48Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M85.8,159.96v.79h.02c.36-.59.84-.88,1.43-.88.69,0,1.17.36,1.45,1.08.42-.72.94-1.08,1.56-1.08.47,0,.84.17,1.13.5s.43.77.43,1.32v2.76h-.48v-2.55c0-.49-.1-.87-.31-1.14-.21-.28-.49-.42-.86-.42-.28,0-.52.08-.72.25s-.42.43-.63.8v3.06h-.48v-2.56c0-.5-.11-.88-.32-1.15-.21-.27-.5-.4-.86-.4-.52,0-.97.32-1.35.96v3.15h-.48v-4.49h.48Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M93.52,159.96v.78h.02c.37-.58.87-.87,1.48-.87.51,0,.91.16,1.22.49s.45.78.45,1.35v2.74h-.48v-2.56c0-1.04-.41-1.55-1.22-1.55-.6,0-1.09.32-1.47.96v3.15h-.48v-4.49h.48Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M98.51,157.63v.82h-.48v-.82h.48ZM98.51,159.96v4.49h-.48v-4.49h.48Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M105.89,160.8l2.59-3.17h.53v6.82h-.53v-6.05l-2.59,3.19-2.61-3.19v6.05h-.53v-6.82h.53l2.61,3.17Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M114.24,162.04h-3.54c0,.08-.01.16-.01.23,0,.5.18.93.54,1.27s.78.52,1.27.52c.57,0,1.13-.22,1.67-.67v.54c-.51.4-1.09.6-1.73.6s-1.18-.22-1.61-.67-.63-1.02-.63-1.71c0-.66.2-1.2.59-1.63.39-.43.88-.65,1.47-.65.56,0,1.03.19,1.41.58.38.39.58.92.58,1.58ZM110.77,161.65h2.91c-.17-.88-.64-1.31-1.42-1.31-.37,0-.69.12-.96.34-.27.23-.45.55-.53.97Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M119.03,162.04h-3.54c0,.08-.01.16-.01.23,0,.5.18.93.54,1.27s.78.52,1.27.52c.57,0,1.13-.22,1.67-.67v.54c-.51.4-1.09.6-1.73.6s-1.18-.22-1.61-.67-.63-1.02-.63-1.71c0-.66.2-1.2.59-1.63.39-.43.88-.65,1.47-.65.56,0,1.03.19,1.41.58.38.39.58.92.58,1.58ZM115.56,161.65h2.91c-.17-.88-.64-1.31-1.42-1.31-.37,0-.69.12-.96.34-.27.23-.45.55-.53.97Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M120.87,158.47v1.49h1.26v.39h-1.26v2.67c0,.43.04.71.1.85.07.14.26.2.56.2.23,0,.51-.07.82-.22v.46c-.32.15-.62.23-.93.23s-.54-.08-.74-.25-.3-.4-.3-.7v-3.23h-1.21v-.39h1.21v-1.07l.33-.42h.15Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M123.57,157.63v.82h-.48v-.82h.48ZM123.57,159.96v4.49h-.48v-4.49h.48Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M125.37,159.96v.78h.02c.37-.58.87-.87,1.48-.87.51,0,.91.16,1.22.49s.45.78.45,1.35v2.74h-.48v-2.56c0-1.04-.41-1.55-1.22-1.55-.6,0-1.09.32-1.47.96v3.15h-.48v-4.49h.48Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M133.34,159.96v.39h-1.02c.41.38.62.77.62,1.19,0,.37-.08.67-.24.89-.16.22-.35.38-.58.48-.22.1-.52.2-.89.29-.37.1-.6.19-.7.27s-.14.18-.14.29c0,.13.06.23.18.31.12.08.5.13,1.14.17.64.04,1.07.16,1.29.37s.33.49.33.83c0,.41-.18.73-.53.96-.35.23-.85.35-1.48.35s-1.11-.11-1.46-.33c-.34-.22-.51-.51-.51-.87,0-.59.44-.95,1.31-1.09v-.02c-.49-.11-.73-.33-.73-.64s.3-.56.9-.73v-.02c-.39-.12-.69-.31-.9-.58-.2-.27-.3-.57-.3-.91,0-.47.16-.86.49-1.15.33-.3.8-.45,1.42-.45h1.8ZM131.35,166.35c.47,0,.84-.08,1.11-.24.27-.16.41-.37.41-.63,0-.53-.48-.79-1.43-.79-1.09,0-1.63.28-1.63.83s.51.83,1.54.83ZM131.28,162.75c.33,0,.61-.12.85-.35.24-.24.35-.52.35-.85s-.12-.61-.35-.84c-.24-.23-.52-.35-.86-.35s-.61.11-.84.34-.34.5-.34.83.12.63.35.86.51.36.84.36Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M136.53,160.25v.52c-.46-.31-.87-.46-1.23-.46-.27,0-.5.07-.68.22-.19.15-.28.33-.28.54,0,.15.06.29.17.42.11.13.42.29.93.49s.84.4,1,.61.23.45.23.71c0,.35-.14.64-.42.88-.28.24-.63.36-1.05.36-.45,0-.9-.14-1.35-.41v-.47c.53.27,1,.41,1.41.41.28,0,.5-.07.68-.22.18-.15.27-.33.27-.56,0-.16-.06-.3-.17-.43-.12-.13-.43-.3-.94-.5-.51-.2-.84-.4-.99-.6-.15-.2-.23-.42-.23-.66,0-.34.14-.63.42-.87.28-.24.62-.36,1.03-.36.37,0,.77.13,1.2.38Z" }), /* @__PURE__ */ React.createElement("circle", { className: "cls-logo-light-2", cx: 90, cy: 69.36, r: 6 }), /* @__PURE__ */ React.createElement("circle", { className: "cls-logo-light-2", cx: 103.37, cy: 112.4, r: 6 }), /* @__PURE__ */ React.createElement("circle", { className: "cls-logo-light-2", cx: 76.62, cy: 112.4, r: 6 }), /* @__PURE__ */ React.createElement("polygon", { className: "cls-logo-light-2", points: "101.47 111.91 90 75.81 78.52 111.91 74.65 111.04 88.06 68.84 91.93 68.84 105.35 111.04 101.47 111.91" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M89.02,19.71l-5.23,6.27c-.69.83-.1,2.08.98,2.08h10.45c1.08,0,1.67-1.26.98-2.08l-5.23-6.27c-.51-.61-1.44-.61-1.95,0Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M90,58.67c.68,0,1.35.07,2,.19V26.17h-4v32.69c.65-.12,1.32-.19,2-.19Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M54.2,34.94l.74,8.13c.1,1.07,1.4,1.54,2.16.78l7.39-7.39c.76-.76.29-2.07-.78-2.16l-8.13-.74c-.79-.07-1.45.59-1.38,1.38Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M82.44,61.8c.48-.48,1.01-.91,1.55-1.28l-23.12-23.12-2.83,2.83,23.12,23.12c.37-.55.79-1.07,1.28-1.55Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M40.35,70.33l6.27,5.23c.83.69,2.08.1,2.08-.98v-10.45c0-1.08-1.26-1.67-2.08-.98l-6.27,5.23c-.61.51-.61,1.44,0,1.95Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M79.31,69.36c0-.68.07-1.35.19-2h-32.69s0,4,0,4h32.69c-.12-.65-.19-1.32-.19-2Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M139.65,68.38l-6.27-5.23c-.83-.69-2.08-.1-2.08.98v10.45c0,1.08,1.26,1.67,2.08.98l6.27-5.23c.61-.51.61-1.44,0-1.95Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M100.69,69.36c0,.68-.07,1.35-.19,2h32.69s0-4,0-4h-32.69c.12.65.19,1.32.19,2Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M124.41,33.56l-8.13.74c-1.07.1-1.54,1.4-.78,2.16l7.39,7.39c.76.76,2.07.29,2.16-.78l.74-8.13c.07-.79-.59-1.45-1.38-1.38Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-light-1", d: "M97.56,61.8c.48.48.91,1.01,1.28,1.55l23.12-23.12-2.83-2.83-23.12,23.12c.55.37,1.07.79,1.55,1.28Z" }));
|
|
4
|
+
|
|
5
|
+
export { SvgInialumLogoLightTransparent as default };
|
|
6
|
+
//# sourceMappingURL=inialum_logo_light_transparent.svg.js.map
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
|
|
3
|
+
const SvgInialumLogoWhiteTransparent = (props) => /* @__PURE__ */ React.createElement("svg", { id: "_layer_1", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 180 180", width: "100%", height: "100%", ...props }, /* @__PURE__ */ React.createElement("defs", null, /* @__PURE__ */ React.createElement("style", null, ".cls-logo-white-1{fill:#fff;stroke-width:0px;}")), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M32.39,129.43h2.98v20.8h-2.98v-20.8Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M56.51,129.43h2.83v20.8h-2.56l-13.91-16.02v16.02h-2.8v-20.8h2.41l14.02,16.15v-16.15Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M63.82,129.43h2.98v20.8h-2.98v-20.8Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M78.05,129.31h2.09l9.33,20.92h-3.05l-2.77-6.16h-8.87l-2.6,6.16h-3.06l8.93-20.92ZM82.43,141.41l-3.36-7.53-3.11,7.53h6.47Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M91.75,129.43h2.98v18.09h9.36v2.71h-12.34v-20.8Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M121.17,129.43h2.99v11.81c0,1.6-.12,2.8-.35,3.62-.23.81-.52,1.49-.86,2.03-.34.54-.76,1.03-1.26,1.45-1.65,1.42-3.8,2.13-6.46,2.13s-4.88-.71-6.52-2.11c-.5-.44-.92-.92-1.26-1.47-.34-.54-.63-1.2-.85-1.99-.22-.78-.33-2.01-.33-3.69v-11.78h2.99v11.81c0,1.96.22,3.32.67,4.08.45.76,1.13,1.38,2.04,1.84.91.46,1.99.69,3.23.69,1.77,0,3.21-.46,4.32-1.38.58-.5,1.01-1.08,1.27-1.76.26-.67.39-1.83.39-3.47v-11.81Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M144.82,129.43h2.78v20.8h-2.99v-16.18l-6.39,8.04h-.55l-6.47-8.04v16.18h-2.98v-20.8h2.82l6.91,8.54,6.87-8.54Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M43.85,157.63v6.82h-.53v-6.82h.53Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M51.55,157.63v6.82h-.43l-5.19-5.96v5.96h-.53v-6.82h.45l5.17,5.96v-5.96h.53Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M53.64,157.63v6.82h-.53v-6.82h.53Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M57.9,157.58l3.15,6.87h-.55l-1.08-2.36h-3.34l-1.08,2.36h-.55l3.15-6.87h.29ZM59.22,161.65l-1.47-3.21-1.46,3.21h2.93Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M61.87,157.63h2.39c1.21,0,2.13.32,2.77.95.64.63.95,1.46.95,2.46s-.32,1.8-.94,2.44c-.63.64-1.52.96-2.68.96h-2.48v-6.82ZM62.4,158.07v5.94h1.92c.88,0,1.62-.27,2.21-.81.59-.54.88-1.26.88-2.16s-.29-1.59-.87-2.14-1.33-.83-2.25-.83h-1.89Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M74.75,157.58l3.15,6.87h-.55l-1.08-2.36h-3.34l-1.08,2.36h-.55l3.15-6.87h.29ZM76.07,161.65l-1.47-3.21-1.46,3.21h2.93Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M79.12,157.63v6.82h-.48v-6.82h.48Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M83.6,164.45v-.74h-.02c-.21.3-.42.51-.64.64-.22.13-.5.19-.84.19-.48,0-.88-.16-1.2-.47s-.47-.75-.47-1.33v-2.78h.48v2.77c0,.42.11.74.34.98s.52.36.89.36c.31,0,.58-.07.8-.21.22-.14.44-.39.66-.74v-3.15h.48v4.49h-.48Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M85.8,159.96v.79h.02c.36-.59.84-.88,1.43-.88.69,0,1.17.36,1.45,1.08.42-.72.94-1.08,1.56-1.08.47,0,.84.17,1.13.5s.43.77.43,1.32v2.76h-.48v-2.55c0-.49-.1-.87-.31-1.14-.21-.28-.49-.42-.86-.42-.28,0-.52.08-.72.25s-.42.43-.63.8v3.06h-.48v-2.56c0-.5-.11-.88-.32-1.15-.21-.27-.5-.4-.86-.4-.52,0-.97.32-1.35.96v3.15h-.48v-4.49h.48Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M93.52,159.96v.78h.02c.37-.58.87-.87,1.48-.87.51,0,.91.16,1.22.49s.45.78.45,1.35v2.74h-.48v-2.56c0-1.04-.41-1.55-1.22-1.55-.6,0-1.09.32-1.47.96v3.15h-.48v-4.49h.48Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M98.51,157.63v.82h-.48v-.82h.48ZM98.51,159.96v4.49h-.48v-4.49h.48Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M105.89,160.8l2.59-3.17h.53v6.82h-.53v-6.05l-2.59,3.19-2.61-3.19v6.05h-.53v-6.82h.53l2.61,3.17Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M114.24,162.04h-3.54c0,.08-.01.16-.01.23,0,.5.18.93.54,1.27s.78.52,1.27.52c.57,0,1.13-.22,1.67-.67v.54c-.51.4-1.09.6-1.73.6s-1.18-.22-1.61-.67-.63-1.02-.63-1.71c0-.66.2-1.2.59-1.63.39-.43.88-.65,1.47-.65.56,0,1.03.19,1.41.58.38.39.58.92.58,1.58ZM110.77,161.65h2.91c-.17-.88-.64-1.31-1.42-1.31-.37,0-.69.12-.96.34-.27.23-.45.55-.53.97Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M119.03,162.04h-3.54c0,.08-.01.16-.01.23,0,.5.18.93.54,1.27s.78.52,1.27.52c.57,0,1.13-.22,1.67-.67v.54c-.51.4-1.09.6-1.73.6s-1.18-.22-1.61-.67-.63-1.02-.63-1.71c0-.66.2-1.2.59-1.63.39-.43.88-.65,1.47-.65.56,0,1.03.19,1.41.58.38.39.58.92.58,1.58ZM115.56,161.65h2.91c-.17-.88-.64-1.31-1.42-1.31-.37,0-.69.12-.96.34-.27.23-.45.55-.53.97Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M120.87,158.47v1.49h1.26v.39h-1.26v2.67c0,.43.04.71.1.85.07.14.26.2.56.2.23,0,.51-.07.82-.22v.46c-.32.15-.62.23-.93.23s-.54-.08-.74-.25-.3-.4-.3-.7v-3.23h-1.21v-.39h1.21v-1.07l.33-.42h.15Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M123.57,157.63v.82h-.48v-.82h.48ZM123.57,159.96v4.49h-.48v-4.49h.48Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M125.37,159.96v.78h.02c.37-.58.87-.87,1.48-.87.51,0,.91.16,1.22.49s.45.78.45,1.35v2.74h-.48v-2.56c0-1.04-.41-1.55-1.22-1.55-.6,0-1.09.32-1.47.96v3.15h-.48v-4.49h.48Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M133.34,159.96v.39h-1.02c.41.38.62.77.62,1.19,0,.37-.08.67-.24.89-.16.22-.35.38-.58.48-.22.1-.52.2-.89.29-.37.1-.6.19-.7.27s-.14.18-.14.29c0,.13.06.23.18.31.12.08.5.13,1.14.17.64.04,1.07.16,1.29.37s.33.49.33.83c0,.41-.18.73-.53.96-.35.23-.85.35-1.48.35s-1.11-.11-1.46-.33c-.34-.22-.51-.51-.51-.87,0-.59.44-.95,1.31-1.09v-.02c-.49-.11-.73-.33-.73-.64s.3-.56.9-.73v-.02c-.39-.12-.69-.31-.9-.58-.2-.27-.3-.57-.3-.91,0-.47.16-.86.49-1.15.33-.3.8-.45,1.42-.45h1.8ZM131.35,166.35c.47,0,.84-.08,1.11-.24.27-.16.41-.37.41-.63,0-.53-.48-.79-1.43-.79-1.09,0-1.63.28-1.63.83s.51.83,1.54.83ZM131.28,162.75c.33,0,.61-.12.85-.35.24-.24.35-.52.35-.85s-.12-.61-.35-.84c-.24-.23-.52-.35-.86-.35s-.61.11-.84.34-.34.5-.34.83.12.63.35.86.51.36.84.36Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M136.53,160.25v.52c-.46-.31-.87-.46-1.23-.46-.27,0-.5.07-.68.22-.19.15-.28.33-.28.54,0,.15.06.29.17.42.11.13.42.29.93.49s.84.4,1,.61.23.45.23.71c0,.35-.14.64-.42.88-.28.24-.63.36-1.05.36-.45,0-.9-.14-1.35-.41v-.47c.53.27,1,.41,1.41.41.28,0,.5-.07.68-.22.18-.15.27-.33.27-.56,0-.16-.06-.3-.17-.43-.12-.13-.43-.3-.94-.5-.51-.2-.84-.4-.99-.6-.15-.2-.23-.42-.23-.66,0-.34.14-.63.42-.87.28-.24.62-.36,1.03-.36.37,0,.77.13,1.2.38Z" }), /* @__PURE__ */ React.createElement("circle", { className: "cls-logo-white-1", cx: 90, cy: 69.36, r: 6 }), /* @__PURE__ */ React.createElement("circle", { className: "cls-logo-white-1", cx: 103.37, cy: 112.4, r: 6 }), /* @__PURE__ */ React.createElement("circle", { className: "cls-logo-white-1", cx: 76.62, cy: 112.4, r: 6 }), /* @__PURE__ */ React.createElement("polygon", { className: "cls-logo-white-1", points: "101.47 111.91 90 75.81 78.52 111.91 74.65 111.04 88.06 68.84 91.93 68.84 105.35 111.04 101.47 111.91" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M89.02,19.71l-5.23,6.27c-.69.83-.1,2.08.98,2.08h10.45c1.08,0,1.67-1.26.98-2.08l-5.23-6.27c-.51-.61-1.44-.61-1.95,0Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M90,58.67c.68,0,1.35.07,2,.19V26.17h-4v32.69c.65-.12,1.32-.19,2-.19Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M54.2,34.94l.74,8.13c.1,1.07,1.4,1.54,2.16.78l7.39-7.39c.76-.76.29-2.07-.78-2.16l-8.13-.74c-.79-.07-1.45.59-1.38,1.38Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M82.44,61.8c.48-.48,1.01-.91,1.55-1.28l-23.12-23.12-2.83,2.83,23.12,23.12c.37-.55.79-1.07,1.28-1.55Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M40.35,70.33l6.27,5.23c.83.69,2.08.1,2.08-.98v-10.45c0-1.08-1.26-1.67-2.08-.98l-6.27,5.23c-.61.51-.61,1.44,0,1.95Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M79.31,69.36c0-.68.07-1.35.19-2h-32.69s0,4,0,4h32.69c-.12-.65-.19-1.32-.19-2Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M139.65,68.38l-6.27-5.23c-.83-.69-2.08-.1-2.08.98v10.45c0,1.08,1.26,1.67,2.08.98l6.27-5.23c.61-.51.61-1.44,0-1.95Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M100.69,69.36c0,.68-.07,1.35-.19,2h32.69s0-4,0-4h-32.69c.12.65.19,1.32.19,2Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M124.41,33.56l-8.13.74c-1.07.1-1.54,1.4-.78,2.16l7.39,7.39c.76.76,2.07.29,2.16-.78l.74-8.13c.07-.79-.59-1.45-1.38-1.38Z" }), /* @__PURE__ */ React.createElement("path", { className: "cls-logo-white-1", d: "M97.56,61.8c.48.48.91,1.01,1.28,1.55l23.12-23.12-2.83-2.83-23.12,23.12c.55.37,1.07.79,1.55,1.28Z" }));
|
|
4
|
+
|
|
5
|
+
export { SvgInialumLogoWhiteTransparent as default };
|
|
6
|
+
//# sourceMappingURL=inialum_logo_white_transparent.svg.js.map
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
|
|
3
|
+
const SvgMenuIcon = (props) => /* @__PURE__ */ React.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M3 12H21", stroke: "white", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ React.createElement("path", { d: "M3 6H21", stroke: "white", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ React.createElement("path", { d: "M3 18H21", stroke: "white", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }));
|
|
4
|
+
|
|
5
|
+
export { SvgMenuIcon as default };
|
|
6
|
+
//# sourceMappingURL=menu_icon.svg.js.map
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
|
|
3
|
+
const SvgXLogo = (props) => /* @__PURE__ */ React.createElement("svg", { role: "img", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", ...props }, /* @__PURE__ */ React.createElement("title", null, "X"), /* @__PURE__ */ React.createElement("path", { d: "M18.901 1.153h3.68l-8.04 9.19L24 22.846h-7.406l-5.8-7.584-6.638 7.584H.474l8.6-9.83L0 1.154h7.594l5.243 6.932ZM17.61 20.644h2.039L6.486 3.24H4.298Z" }));
|
|
4
|
+
|
|
5
|
+
export { SvgXLogo as default };
|
|
6
|
+
//# sourceMappingURL=x_logo.svg.js.map
|
|
@@ -5,5 +5,5 @@ type Props = ComponentPropsWithRef<'button'> & {
|
|
|
5
5
|
styleType?: 'filled' | 'outlined';
|
|
6
6
|
radius?: 'none' | 'rounded' | 'moreRounded';
|
|
7
7
|
};
|
|
8
|
-
export declare const Button: ({ colorTheme, size, styleType, radius, className, children, ...rest }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export declare const Button: ({ colorTheme, size, styleType, radius, disabled, className, children, ...rest }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
9
9
|
export {};
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
import clsx from 'clsx';
|
|
3
|
+
|
|
4
|
+
const Button = ({
|
|
5
|
+
colorTheme = "primary",
|
|
6
|
+
size = "medium",
|
|
7
|
+
styleType = "filled",
|
|
8
|
+
radius = "none",
|
|
9
|
+
disabled,
|
|
10
|
+
className,
|
|
11
|
+
children,
|
|
12
|
+
...rest
|
|
13
|
+
}) => {
|
|
14
|
+
return /* @__PURE__ */ jsx(
|
|
15
|
+
"button",
|
|
16
|
+
{
|
|
17
|
+
...rest,
|
|
18
|
+
disabled,
|
|
19
|
+
className: clsx(
|
|
20
|
+
// Base styles
|
|
21
|
+
"inline-flex items-center justify-center cursor-pointer",
|
|
22
|
+
// Variant styles
|
|
23
|
+
styleType === "filled" && [
|
|
24
|
+
"text-base-white border",
|
|
25
|
+
!disabled && [
|
|
26
|
+
colorTheme === "primary" && "bg-blue-400 border-blue-400",
|
|
27
|
+
colorTheme === "white" && "bg-base-white border-base-white text-primary"
|
|
28
|
+
]
|
|
29
|
+
],
|
|
30
|
+
styleType === "outlined" && [
|
|
31
|
+
"box-border border-2 bg-transparent",
|
|
32
|
+
!disabled && [
|
|
33
|
+
colorTheme === "primary" && "border-blue-400 text-blue-400",
|
|
34
|
+
colorTheme === "white" && "border-base-white text-base-white"
|
|
35
|
+
]
|
|
36
|
+
],
|
|
37
|
+
// Size styles
|
|
38
|
+
size === "small" && "text-base py-8 px-24",
|
|
39
|
+
size === "medium" && "text-lg py-12 px-32",
|
|
40
|
+
size === "large" && "text-xl py-16 px-40",
|
|
41
|
+
size === "fullWidth" && "w-full text-lg py-12 px-32",
|
|
42
|
+
// Radius styles
|
|
43
|
+
radius === "rounded" && "rounded",
|
|
44
|
+
radius === "moreRounded" && "rounded-4xl",
|
|
45
|
+
// Disabled state
|
|
46
|
+
disabled && [
|
|
47
|
+
"cursor-not-allowed",
|
|
48
|
+
styleType === "filled" && "bg-gray-300 border-gray-300",
|
|
49
|
+
styleType === "outlined" && "border-gray-300 text-gray-300"
|
|
50
|
+
],
|
|
51
|
+
className
|
|
52
|
+
),
|
|
53
|
+
children
|
|
54
|
+
}
|
|
55
|
+
);
|
|
56
|
+
};
|
|
57
|
+
|
|
58
|
+
export { Button };
|
|
59
|
+
//# sourceMappingURL=Button.js.map
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { ClassAttributes, ButtonHTMLAttributes } from 'react';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: ({ colorTheme, size, styleType, radius, disabled, className, children, ...rest }: ClassAttributes<HTMLButtonElement> & ButtonHTMLAttributes<HTMLButtonElement> & {
|
|
6
|
+
colorTheme?: "primary" | "secondary" | "white";
|
|
7
|
+
size?: "small" | "medium" | "large" | "fullWidth";
|
|
8
|
+
styleType?: "filled" | "outlined";
|
|
9
|
+
radius?: "none" | "rounded" | "moreRounded";
|
|
10
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
};
|
|
12
|
+
export default meta;
|
|
13
|
+
type Story = StoryObj<typeof meta>;
|
|
14
|
+
export declare const Default: Story;
|
|
15
|
+
export declare const Outlined: Story;
|
|
16
|
+
export declare const Rounded: Story;
|
|
17
|
+
export declare const MoreRounded: Story;
|
|
18
|
+
export declare const Disabled: Story;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { Button } from './Button';
|
|
@@ -6,5 +6,5 @@ type Props = ComponentPropsWithRef<'a'> & {
|
|
|
6
6
|
radius?: 'none' | 'rounded' | 'moreRounded';
|
|
7
7
|
disabled?: boolean;
|
|
8
8
|
};
|
|
9
|
-
export declare const ButtonLink: ({ colorTheme, size, styleType, radius, rel: _rel, className, children, ...rest }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const ButtonLink: ({ colorTheme, size, styleType, radius, rel: _rel, disabled, className, children, ...rest }: Props) => import("react/jsx-runtime").JSX.Element;
|
|
10
10
|
export {};
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import { jsx } from 'react/jsx-runtime';
|
|
2
|
+
import clsx from 'clsx';
|
|
3
|
+
|
|
4
|
+
const ButtonLink = ({
|
|
5
|
+
colorTheme = "primary",
|
|
6
|
+
size = "medium",
|
|
7
|
+
styleType = "filled",
|
|
8
|
+
radius = "none",
|
|
9
|
+
rel: _rel,
|
|
10
|
+
disabled,
|
|
11
|
+
className,
|
|
12
|
+
children,
|
|
13
|
+
...rest
|
|
14
|
+
}) => {
|
|
15
|
+
let rel = _rel;
|
|
16
|
+
if (rest.target === "_blank" && typeof rel === "undefined") {
|
|
17
|
+
rel = "noreferrer noopener";
|
|
18
|
+
}
|
|
19
|
+
return /* @__PURE__ */ jsx(
|
|
20
|
+
"a",
|
|
21
|
+
{
|
|
22
|
+
...rest,
|
|
23
|
+
rel,
|
|
24
|
+
"aria-disabled": disabled,
|
|
25
|
+
className: clsx(
|
|
26
|
+
// Base styles
|
|
27
|
+
"inline-flex items-center justify-center cursor-pointer no-underline",
|
|
28
|
+
styleType === "filled" && [
|
|
29
|
+
"text-base-white border",
|
|
30
|
+
!disabled && [
|
|
31
|
+
colorTheme === "primary" && "bg-blue-400 border-blue-400",
|
|
32
|
+
colorTheme === "white" && "bg-base-white border-base-white text-primary"
|
|
33
|
+
]
|
|
34
|
+
],
|
|
35
|
+
styleType === "outlined" && [
|
|
36
|
+
"box-border border-2 bg-transparent",
|
|
37
|
+
!disabled && [
|
|
38
|
+
colorTheme === "primary" && "border-blue-400 text-blue-400",
|
|
39
|
+
colorTheme === "white" && "border-base-white text-base-white"
|
|
40
|
+
]
|
|
41
|
+
],
|
|
42
|
+
// Size styles
|
|
43
|
+
size === "small" && "text-base py-8 px-24",
|
|
44
|
+
size === "medium" && "text-lg py-12 px-32",
|
|
45
|
+
size === "large" && "text-xl py-16 px-40",
|
|
46
|
+
size === "fullWidth" && "w-full text-lg py-12 px-32",
|
|
47
|
+
// Radius styles
|
|
48
|
+
radius === "rounded" && "rounded",
|
|
49
|
+
radius === "moreRounded" && "rounded-4xl",
|
|
50
|
+
// Disabled state
|
|
51
|
+
disabled && [
|
|
52
|
+
"cursor-not-allowed pointer-events-none",
|
|
53
|
+
styleType === "filled" && "bg-gray-300 border-gray-300",
|
|
54
|
+
styleType === "outlined" && "border-gray-300 text-gray-300"
|
|
55
|
+
],
|
|
56
|
+
className
|
|
57
|
+
),
|
|
58
|
+
children
|
|
59
|
+
}
|
|
60
|
+
);
|
|
61
|
+
};
|
|
62
|
+
|
|
63
|
+
export { ButtonLink };
|
|
64
|
+
//# sourceMappingURL=ButtonLink.js.map
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { ClassAttributes, AnchorHTMLAttributes } from 'react';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: ({ colorTheme, size, styleType, radius, rel: _rel, disabled, className, children, ...rest }: ClassAttributes<HTMLAnchorElement> & AnchorHTMLAttributes<HTMLAnchorElement> & {
|
|
6
|
+
colorTheme?: "primary" | "secondary" | "white";
|
|
7
|
+
size?: "small" | "medium" | "large" | "fullWidth";
|
|
8
|
+
styleType?: "filled" | "outlined";
|
|
9
|
+
radius?: "none" | "rounded" | "moreRounded";
|
|
10
|
+
disabled?: boolean;
|
|
11
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
};
|
|
13
|
+
export default meta;
|
|
14
|
+
type Story = StoryObj<typeof meta>;
|
|
15
|
+
export declare const Default: Story;
|
|
16
|
+
export declare const Outlined: Story;
|
|
17
|
+
export declare const Rounded: Story;
|
|
18
|
+
export declare const MoreRounded: Story;
|
|
19
|
+
export declare const Disabled: Story;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { ButtonLink } from './ButtonLink';
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
+
import clsx from 'clsx';
|
|
3
|
+
import SvgInialumLogoLightTransparent from '../../assets/inialum_logo_light_transparent.svg.js';
|
|
4
|
+
import SvgXLogo from '../../assets/x_logo.svg.js';
|
|
5
|
+
|
|
6
|
+
const Footer = ({ className, ...rest }) => {
|
|
7
|
+
const nowYear = (/* @__PURE__ */ new Date()).getFullYear();
|
|
8
|
+
return /* @__PURE__ */ jsxs(
|
|
9
|
+
"footer",
|
|
10
|
+
{
|
|
11
|
+
...rest,
|
|
12
|
+
className: clsx("bg-base-block", "pt-52 px-48 pb-28 md:pb-64", className),
|
|
13
|
+
children: [
|
|
14
|
+
/* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center gap-y-12 md:gap-y-16", children: [
|
|
15
|
+
/* @__PURE__ */ jsx("div", { className: "w-120 h-120 md:w-280 md:h-280", children: /* @__PURE__ */ jsx(
|
|
16
|
+
SvgInialumLogoLightTransparent,
|
|
17
|
+
{
|
|
18
|
+
"aria-label": "INIALUM - INIAD Alumni Meetings",
|
|
19
|
+
className: "object-cover w-full h-full"
|
|
20
|
+
}
|
|
21
|
+
) }),
|
|
22
|
+
/* @__PURE__ */ jsx("div", { className: "font-bold text-2xs md:text-sm", children: "さらなる連携を、ともに歩んだ仲間と" })
|
|
23
|
+
] }),
|
|
24
|
+
/* @__PURE__ */ jsx("nav", { children: /* @__PURE__ */ jsxs("ul", { className: "flex flex-col items-center text-center gap-y-32 md:gap-y-48 pt-40 md:py-56 pb-28", children: [
|
|
25
|
+
/* @__PURE__ */ jsx("li", { className: "font-bold text-xs md:text-base", children: /* @__PURE__ */ jsx("a", { href: "/", children: "ホーム" }) }),
|
|
26
|
+
/* @__PURE__ */ jsx("li", { className: "font-bold text-xs md:text-base", children: /* @__PURE__ */ jsx("a", { href: "/vision", children: "私たちの思い" }) }),
|
|
27
|
+
/* @__PURE__ */ jsx("li", { className: "font-bold text-xs md:text-base", children: /* @__PURE__ */ jsx("a", { href: "https://inialum.org/join", children: "入会する" }) }),
|
|
28
|
+
/* @__PURE__ */ jsx("li", { className: "font-bold text-xs md:text-base", children: /* @__PURE__ */ jsx("a", { href: "/contact", children: "お問い合わせ" }) }),
|
|
29
|
+
/* @__PURE__ */ jsx("li", { className: "font-bold text-xs md:text-base", children: /* @__PURE__ */ jsx(
|
|
30
|
+
"a",
|
|
31
|
+
{
|
|
32
|
+
href: "https://inialum.notion.site/INIALUM-Q-A-0cfb2bd4cc814df6a29ca5aa7f9ad9b7",
|
|
33
|
+
target: "_blank",
|
|
34
|
+
rel: "noreferrer noopener",
|
|
35
|
+
children: "Q&A"
|
|
36
|
+
}
|
|
37
|
+
) })
|
|
38
|
+
] }) }),
|
|
39
|
+
/* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center text-center border-t border-t-gray-500 max-w-732 mx-auto gap-y-16 md:gap-y-36 pt-28 md:pt-56", children: [
|
|
40
|
+
/* @__PURE__ */ jsx("div", { className: "flex items-center justify-center pt-0 px-0 pb-12 md:pb-8", children: /* @__PURE__ */ jsx(
|
|
41
|
+
"a",
|
|
42
|
+
{
|
|
43
|
+
href: "https://twitter.com/inialum",
|
|
44
|
+
target: "_blank",
|
|
45
|
+
rel: "noreferrer noopener",
|
|
46
|
+
children: /* @__PURE__ */ jsx(
|
|
47
|
+
SvgXLogo,
|
|
48
|
+
{
|
|
49
|
+
"aria-label": "X公式アカウント",
|
|
50
|
+
className: "h-24 md:h-32 fill-black"
|
|
51
|
+
}
|
|
52
|
+
)
|
|
53
|
+
}
|
|
54
|
+
) }),
|
|
55
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center text-gray-500 gap-x-20 md:gap-x-48 text-2xs md:text-sm", children: [
|
|
56
|
+
/* @__PURE__ */ jsx(
|
|
57
|
+
"a",
|
|
58
|
+
{
|
|
59
|
+
href: "https://inialum.notion.site/4cbf67b190544bff8891deabc64e776c",
|
|
60
|
+
target: "_blank",
|
|
61
|
+
rel: "noreferrer noopener",
|
|
62
|
+
children: "同窓会会則"
|
|
63
|
+
}
|
|
64
|
+
),
|
|
65
|
+
/* @__PURE__ */ jsx(
|
|
66
|
+
"a",
|
|
67
|
+
{
|
|
68
|
+
href: "https://inialum.notion.site/4d2374f79b594f00b93c0efccf3c6bb4",
|
|
69
|
+
target: "_blank",
|
|
70
|
+
rel: "noreferrer noopener",
|
|
71
|
+
children: "役員一覧"
|
|
72
|
+
}
|
|
73
|
+
),
|
|
74
|
+
/* @__PURE__ */ jsx(
|
|
75
|
+
"a",
|
|
76
|
+
{
|
|
77
|
+
href: "https://inialum.notion.site/d8a7e0dd14224c0dadfd630a6665cee0",
|
|
78
|
+
target: "_blank",
|
|
79
|
+
rel: "noreferrer noopener",
|
|
80
|
+
children: "プライバシーポリシー"
|
|
81
|
+
}
|
|
82
|
+
),
|
|
83
|
+
/* @__PURE__ */ jsx(
|
|
84
|
+
"a",
|
|
85
|
+
{
|
|
86
|
+
href: "https://github.com/inialum",
|
|
87
|
+
target: "_blank",
|
|
88
|
+
rel: "noreferrer noopener",
|
|
89
|
+
children: "GitHub"
|
|
90
|
+
}
|
|
91
|
+
)
|
|
92
|
+
] }),
|
|
93
|
+
/* @__PURE__ */ jsxs("div", { className: "text-gray-500 text-2xs md:text-sm", children: [
|
|
94
|
+
"© ",
|
|
95
|
+
nowYear,
|
|
96
|
+
" INIALUM - INIAD Alumni Meetings."
|
|
97
|
+
] })
|
|
98
|
+
] })
|
|
99
|
+
]
|
|
100
|
+
}
|
|
101
|
+
);
|
|
102
|
+
};
|
|
103
|
+
|
|
104
|
+
export { Footer };
|
|
105
|
+
//# sourceMappingURL=Footer.js.map
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { DetailedHTMLProps, HTMLAttributes } from 'react';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: ({ className, ...rest }: DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>) => import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
};
|
|
7
|
+
export default meta;
|
|
8
|
+
type Story = StoryObj<typeof meta>;
|
|
9
|
+
export declare const Default: Story;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { Footer } from './Footer';
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
2
|
+
import clsx from 'clsx';
|
|
3
|
+
import { useState, useCallback } from 'react';
|
|
4
|
+
import SvgInialumLogoLightTransparent from '../../assets/inialum_logo_light_transparent.svg.js';
|
|
5
|
+
import SvgMenuIcon from '../../assets/menu_icon.svg.js';
|
|
6
|
+
import { Navigation } from '../Navigation/Navigation.js';
|
|
7
|
+
|
|
8
|
+
const Header = ({ hasNavigation = true, className, ...rest }) => {
|
|
9
|
+
const [isOpen, setIsOpen] = useState(false);
|
|
10
|
+
const onClick = useCallback(() => {
|
|
11
|
+
setIsOpen(!isOpen);
|
|
12
|
+
}, [isOpen]);
|
|
13
|
+
return /* @__PURE__ */ jsxs(
|
|
14
|
+
"header",
|
|
15
|
+
{
|
|
16
|
+
...rest,
|
|
17
|
+
className: clsx(
|
|
18
|
+
"relative flex items-center",
|
|
19
|
+
"bg-primary w-full h-60",
|
|
20
|
+
className
|
|
21
|
+
),
|
|
22
|
+
children: [
|
|
23
|
+
/* @__PURE__ */ jsx("div", { className: "absolute top-0 left-0 flex items-center justify-center w-160 h-160 md:w-xs md:h-320 p-12 md:p-24 bg-base-white z-30", children: /* @__PURE__ */ jsx(SvgInialumLogoLightTransparent, { "aria-label": "INIALUM - INIAD Alumni Meetings" }) }),
|
|
24
|
+
hasNavigation && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
25
|
+
/* @__PURE__ */ jsx(
|
|
26
|
+
"button",
|
|
27
|
+
{
|
|
28
|
+
type: "button",
|
|
29
|
+
className: "ml-auto mr-20 p-4 fill-base-white",
|
|
30
|
+
title: "ナビゲーションメニュー",
|
|
31
|
+
"aria-label": "ナビゲーションメニューを開く",
|
|
32
|
+
"aria-haspopup": "true",
|
|
33
|
+
"aria-expanded": isOpen,
|
|
34
|
+
onClick,
|
|
35
|
+
children: /* @__PURE__ */ jsx(SvgMenuIcon, { "aria-hidden": "true" })
|
|
36
|
+
}
|
|
37
|
+
),
|
|
38
|
+
isOpen && /* @__PURE__ */ jsx(Navigation, { isOpen, onClose: onClick })
|
|
39
|
+
] })
|
|
40
|
+
]
|
|
41
|
+
}
|
|
42
|
+
);
|
|
43
|
+
};
|
|
44
|
+
|
|
45
|
+
export { Header };
|
|
46
|
+
//# sourceMappingURL=Header.js.map
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { ClassAttributes, HTMLAttributes } from 'react';
|
|
3
|
+
declare const meta: {
|
|
4
|
+
title: string;
|
|
5
|
+
component: ({ hasNavigation, className, ...rest }: ClassAttributes<HTMLElement> & HTMLAttributes<HTMLElement> & {
|
|
6
|
+
hasNavigation?: boolean;
|
|
7
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
};
|
|
9
|
+
export default meta;
|
|
10
|
+
type Story = StoryObj<typeof meta>;
|
|
11
|
+
export declare const Default: Story;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { Header } from './Header';
|