@obosbbl/grunnmuren-react 3.4.0 → 3.4.2

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 (23) hide show
  1. package/dist/index.d.mts +762 -628
  2. package/dist/index.mjs +2329 -2869
  3. package/package.json +3 -3
  4. package/dist/__stories__/form-validation.stories.cjs +0 -502
  5. package/dist/__stories__/form-validation.stories.d.cts +0 -11
  6. package/dist/__stories__/form-validation.stories.d.ts +0 -11
  7. package/dist/__stories__/form-validation.stories.js +0 -496
  8. package/dist/__stories__/home.stories.cjs +0 -32
  9. package/dist/__stories__/home.stories.d.cts +0 -10
  10. package/dist/__stories__/home.stories.d.ts +0 -10
  11. package/dist/__stories__/home.stories.js +0 -29
  12. package/dist/__stories__/icons.stories.cjs +0 -47
  13. package/dist/__stories__/icons.stories.d.cts +0 -8
  14. package/dist/__stories__/icons.stories.d.ts +0 -8
  15. package/dist/__stories__/icons.stories.js +0 -24
  16. package/dist/__stories__/layout.stories.cjs +0 -566
  17. package/dist/__stories__/layout.stories.d.cts +0 -9
  18. package/dist/__stories__/layout.stories.d.ts +0 -9
  19. package/dist/__stories__/layout.stories.js +0 -562
  20. package/dist/__stories__/typography.stories.cjs +0 -224
  21. package/dist/__stories__/typography.stories.d.cts +0 -14
  22. package/dist/__stories__/typography.stories.d.ts +0 -14
  23. package/dist/__stories__/typography.stories.js +0 -214
package/dist/__stories__/typography.stories.cjs DELETED
@@ -1,224 +0,0 @@
1
- Object.defineProperty(exports, '__esModule', { value: true });
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
-
5
- const Default = ()=>{
6
- return /*#__PURE__*/ jsxRuntime.jsxs("div", {
7
- className: "grid gap-8",
8
- children: [
9
- /*#__PURE__*/ jsxRuntime.jsx("h1", {
10
- className: "heading-xl",
11
- children: "Grunnmuren"
12
- }),
13
- /*#__PURE__*/ jsxRuntime.jsx("p", {
14
- className: "lead",
15
- children: "Grunnmuren er designsystemet til OBOS."
16
- }),
17
- /*#__PURE__*/ jsxRuntime.jsx("h2", {
18
- className: "heading-l",
19
- children: "Typografi i Grunnmuren"
20
- }),
21
- /*#__PURE__*/ jsxRuntime.jsxs("p", {
22
- className: "paragraph",
23
- children: [
24
- "Typografien i Grunnmuren defineres av tailwind-klasser. Denne teksten har for eksempel klassen ",
25
- /*#__PURE__*/ jsxRuntime.jsx("code", {
26
- children: "paragraph"
27
- }),
28
- "."
29
- ]
30
- }),
31
- /*#__PURE__*/ jsxRuntime.jsx("h3", {
32
- className: "heading-m",
33
- children: "Sitater"
34
- }),
35
- /*#__PURE__*/ jsxRuntime.jsxs("p", {
36
- className: "paragraph",
37
- children: [
38
- "Lengre sitater kan framheves med klassen ",
39
- /*#__PURE__*/ jsxRuntime.jsx("code", {
40
- children: "blockquote"
41
- }),
42
- ":"
43
- ]
44
- }),
45
- /*#__PURE__*/ jsxRuntime.jsx("blockquote", {
46
- className: "blockquote",
47
- children: "Typografi er grunnmuren i all visuell kommunikasjon; den bærer budskapets vekt og gir strukturen vi bygger vår forståelse på."
48
- }),
49
- /*#__PURE__*/ jsxRuntime.jsx("h3", {
50
- className: "heading-m",
51
- children: "Bildetekster"
52
- }),
53
- /*#__PURE__*/ jsxRuntime.jsxs("p", {
54
- className: "paragraph",
55
- children: [
56
- "Klassen ",
57
- /*#__PURE__*/ jsxRuntime.jsx("code", {
58
- children: "description"
59
- }),
60
- " kan f.eks. brukes for bildetekster:"
61
- ]
62
- }),
63
- /*#__PURE__*/ jsxRuntime.jsxs("figure", {
64
- children: [
65
- /*#__PURE__*/ jsxRuntime.jsx("img", {
66
- className: "mb-4 max-w-96 bg-blue-dark p-4",
67
- src: "https://cdn.sanity.io/media-libraries/mln4u7f3Hc8r/images/9a29374fde57a12bedf17149525c325a8c3254ae-850x180.svg?auto=format",
68
- alt: "OBOS logo"
69
- }),
70
- /*#__PURE__*/ jsxRuntime.jsx("figcaption", {
71
- className: "description",
72
- children: "OBOS sin logo har hvit tekst, og bildet må derfor ha en mørk bakgrunn. Slik at man kan se hva det står."
73
- })
74
- ]
75
- })
76
- ]
77
- });
78
- };
79
- const Headings = ()=>{
80
- return /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
81
- children: [
82
- /*#__PURE__*/ jsxRuntime.jsx("h1", {
83
- className: "heading-xl",
84
- children: "Overskrift nivå 1 (XL)"
85
- }),
86
- /*#__PURE__*/ jsxRuntime.jsx("h2", {
87
- className: "heading-l",
88
- children: "Overskrift nivå 2 (L)"
89
- }),
90
- /*#__PURE__*/ jsxRuntime.jsx("h3", {
91
- className: "heading-m",
92
- children: "Overskrift nivå 3 (M)"
93
- }),
94
- /*#__PURE__*/ jsxRuntime.jsx("h4", {
95
- className: "heading-s",
96
- children: "Overskrift nivå 4 (S)"
97
- }),
98
- /*#__PURE__*/ jsxRuntime.jsx("h5", {
99
- className: "heading-xs",
100
- children: "Overskrift nivå 5 (XS)"
101
- })
102
- ]
103
- });
104
- };
105
- const Lead = ()=>/*#__PURE__*/ jsxRuntime.jsx("p", {
106
- className: "lead",
107
- children: "Dokumentavgift er en avgift som du må betale til staten når du kjøper en fast eiendom."
108
- });
109
- const Body = ()=>{
110
- return /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
111
- children: [
112
- /*#__PURE__*/ jsxRuntime.jsx("p", {
113
- className: "paragraph",
114
- children: "Mange opplever at prisvekst og rentehevinger har fått store konsekvenser for økonomien. Førstegangskjøpere og de som tjener mindre, sliter med å komme seg inn på boligmarkedet."
115
- }),
116
- /*#__PURE__*/ jsxRuntime.jsx("p", {
117
- className: "paragraph",
118
- children: "– Det er et tøft boligmarked, og med de prisene det er på bolig i Oslo, virket det nesten umulig å komme inn på markedet. Jeg var på noen visninger, men det ble enten for lite eller for gammelt og slitt, forteller boligkjøper Brita (30)."
119
- })
120
- ]
121
- });
122
- };
123
- const Blockquote = ()=>/*#__PURE__*/ jsxRuntime.jsx("blockquote", {
124
- className: "blockquote",
125
- children: "Typografi er grunnmuren i all visuell kommunikasjon; den bærer budskapets vekt og gir strukturen vi bygger vår forståelse på."
126
- });
127
- const Description = ()=>/*#__PURE__*/ jsxRuntime.jsx("figcaption", {
128
- className: "description",
129
- children: "Lav møblering gjør at rommet oppleves større. Zen Milano-sengen er fra Bohus, mens Soft Serve-lampen er fra Moniker."
130
- });
131
- const ProseContent = ()=>{
132
- return /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
133
- children: [
134
- /*#__PURE__*/ jsxRuntime.jsx("h1", {
135
- className: "text-center",
136
- children: "Woops!"
137
- }),
138
- /*#__PURE__*/ jsxRuntime.jsx("p", {
139
- className: "lead text-center",
140
- children: "Nå er det noe som er galt her."
141
- }),
142
- /*#__PURE__*/ jsxRuntime.jsx("p", {
143
- className: "text-center",
144
- children: "Sidene på fluks.obosblockwatne.no er dessverre ikke tilgjengelige akkurat nå. De digitale bygningsarbeiderne våre jobber på spreng for å fikse feilen, og vanligvis er sidene oppe og går igjen i løpet av kort tid. Nedenfor finner du kontaktinformasjon."
145
- }),
146
- /*#__PURE__*/ jsxRuntime.jsx("h2", {
147
- children: "Kontakt Fluks — OBOS Block Watne"
148
- }),
149
- /*#__PURE__*/ jsxRuntime.jsx("blockquote", {
150
- children: "Det er et tøft boligmarked, og med de prisene det er på bolig i Oslo, virket det nesten umulig å komme inn på markedet. Jeg var på noen visninger, men det ble enten for lite eller for gammelt og slitt"
151
- }),
152
- /*#__PURE__*/ jsxRuntime.jsxs("p", {
153
- children: [
154
- "Telefon: ",
155
- /*#__PURE__*/ jsxRuntime.jsx("a", {
156
- href: "tel:23246000",
157
- children: "+47 23 24 60 00"
158
- })
159
- ]
160
- }),
161
- /*#__PURE__*/ jsxRuntime.jsx("hr", {}),
162
- /*#__PURE__*/ jsxRuntime.jsxs("p", {
163
- children: [
164
- "E-post: ",
165
- /*#__PURE__*/ jsxRuntime.jsx("a", {
166
- href: "mailto:obw.flukspost@obos.no",
167
- children: "obw.flukspost@obos.no"
168
- })
169
- ]
170
- }),
171
- /*#__PURE__*/ jsxRuntime.jsx("p", {
172
- className: "description",
173
- children: "Ved stor pågang vil det være noe ventetid."
174
- }),
175
- /*#__PURE__*/ jsxRuntime.jsxs("ul", {
176
- children: [
177
- /*#__PURE__*/ jsxRuntime.jsx("li", {
178
- children: "hei"
179
- }),
180
- /*#__PURE__*/ jsxRuntime.jsx("li", {
181
- children: "på"
182
- }),
183
- /*#__PURE__*/ jsxRuntime.jsx("li", {
184
- children: "deg"
185
- })
186
- ]
187
- }),
188
- /*#__PURE__*/ jsxRuntime.jsxs("ol", {
189
- children: [
190
- /*#__PURE__*/ jsxRuntime.jsx("li", {
191
- children: "hei"
192
- }),
193
- /*#__PURE__*/ jsxRuntime.jsx("li", {
194
- children: "på"
195
- }),
196
- /*#__PURE__*/ jsxRuntime.jsx("li", {
197
- children: "deg"
198
- })
199
- ]
200
- })
201
- ]
202
- });
203
- };
204
- const Prose = ()=>/*#__PURE__*/ jsxRuntime.jsx("div", {
205
- className: "prose container-prose my-12md:my-20",
206
- children: /*#__PURE__*/ jsxRuntime.jsx(ProseContent, {})
207
- });
208
- const ProseWhite = ()=>/*#__PURE__*/ jsxRuntime.jsx("div", {
209
- className: "prose prose-white container-prose my-12md:my-20 bg-blue-dark",
210
- children: /*#__PURE__*/ jsxRuntime.jsx(ProseContent, {})
211
- });
212
- const meta = {
213
- title: 'Typography'
214
- };
215
-
216
- exports.Blockquote = Blockquote;
217
- exports.Body = Body;
218
- exports.Default = Default;
219
- exports.Description = Description;
220
- exports.Headings = Headings;
221
- exports.Lead = Lead;
222
- exports.Prose = Prose;
223
- exports.ProseWhite = ProseWhite;
224
- exports.default = meta;
package/dist/__stories__/typography.stories.d.cts DELETED
@@ -1,14 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { Meta } from '@storybook/react-vite';
3
-
4
- declare const Default: () => react_jsx_runtime.JSX.Element;
5
- declare const Headings: () => react_jsx_runtime.JSX.Element;
6
- declare const Lead: () => react_jsx_runtime.JSX.Element;
7
- declare const Body: () => react_jsx_runtime.JSX.Element;
8
- declare const Blockquote: () => react_jsx_runtime.JSX.Element;
9
- declare const Description: () => react_jsx_runtime.JSX.Element;
10
- declare const Prose: () => react_jsx_runtime.JSX.Element;
11
- declare const ProseWhite: () => react_jsx_runtime.JSX.Element;
12
- declare const meta: Meta;
13
-
14
- export { Blockquote, Body, Default, Description, Headings, Lead, Prose, ProseWhite, meta as default };
package/dist/__stories__/typography.stories.d.ts DELETED
@@ -1,14 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { Meta } from '@storybook/react-vite';
3
-
4
- declare const Default: () => react_jsx_runtime.JSX.Element;
5
- declare const Headings: () => react_jsx_runtime.JSX.Element;
6
- declare const Lead: () => react_jsx_runtime.JSX.Element;
7
- declare const Body: () => react_jsx_runtime.JSX.Element;
8
- declare const Blockquote: () => react_jsx_runtime.JSX.Element;
9
- declare const Description: () => react_jsx_runtime.JSX.Element;
10
- declare const Prose: () => react_jsx_runtime.JSX.Element;
11
- declare const ProseWhite: () => react_jsx_runtime.JSX.Element;
12
- declare const meta: Meta;
13
-
14
- export { Blockquote, Body, Default, Description, Headings, Lead, Prose, ProseWhite, meta as default };
package/dist/__stories__/typography.stories.js DELETED
@@ -1,214 +0,0 @@
1
- import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
2
-
3
- const Default = ()=>{
4
- return /*#__PURE__*/ jsxs("div", {
5
- className: "grid gap-8",
6
- children: [
7
- /*#__PURE__*/ jsx("h1", {
8
- className: "heading-xl",
9
- children: "Grunnmuren"
10
- }),
11
- /*#__PURE__*/ jsx("p", {
12
- className: "lead",
13
- children: "Grunnmuren er designsystemet til OBOS."
14
- }),
15
- /*#__PURE__*/ jsx("h2", {
16
- className: "heading-l",
17
- children: "Typografi i Grunnmuren"
18
- }),
19
- /*#__PURE__*/ jsxs("p", {
20
- className: "paragraph",
21
- children: [
22
- "Typografien i Grunnmuren defineres av tailwind-klasser. Denne teksten har for eksempel klassen ",
23
- /*#__PURE__*/ jsx("code", {
24
- children: "paragraph"
25
- }),
26
- "."
27
- ]
28
- }),
29
- /*#__PURE__*/ jsx("h3", {
30
- className: "heading-m",
31
- children: "Sitater"
32
- }),
33
- /*#__PURE__*/ jsxs("p", {
34
- className: "paragraph",
35
- children: [
36
- "Lengre sitater kan framheves med klassen ",
37
- /*#__PURE__*/ jsx("code", {
38
- children: "blockquote"
39
- }),
40
- ":"
41
- ]
42
- }),
43
- /*#__PURE__*/ jsx("blockquote", {
44
- className: "blockquote",
45
- children: "Typografi er grunnmuren i all visuell kommunikasjon; den bærer budskapets vekt og gir strukturen vi bygger vår forståelse på."
46
- }),
47
- /*#__PURE__*/ jsx("h3", {
48
- className: "heading-m",
49
- children: "Bildetekster"
50
- }),
51
- /*#__PURE__*/ jsxs("p", {
52
- className: "paragraph",
53
- children: [
54
- "Klassen ",
55
- /*#__PURE__*/ jsx("code", {
56
- children: "description"
57
- }),
58
- " kan f.eks. brukes for bildetekster:"
59
- ]
60
- }),
61
- /*#__PURE__*/ jsxs("figure", {
62
- children: [
63
- /*#__PURE__*/ jsx("img", {
64
- className: "mb-4 max-w-96 bg-blue-dark p-4",
65
- src: "https://cdn.sanity.io/media-libraries/mln4u7f3Hc8r/images/9a29374fde57a12bedf17149525c325a8c3254ae-850x180.svg?auto=format",
66
- alt: "OBOS logo"
67
- }),
68
- /*#__PURE__*/ jsx("figcaption", {
69
- className: "description",
70
- children: "OBOS sin logo har hvit tekst, og bildet må derfor ha en mørk bakgrunn. Slik at man kan se hva det står."
71
- })
72
- ]
73
- })
74
- ]
75
- });
76
- };
77
- const Headings = ()=>{
78
- return /*#__PURE__*/ jsxs(Fragment, {
79
- children: [
80
- /*#__PURE__*/ jsx("h1", {
81
- className: "heading-xl",
82
- children: "Overskrift nivå 1 (XL)"
83
- }),
84
- /*#__PURE__*/ jsx("h2", {
85
- className: "heading-l",
86
- children: "Overskrift nivå 2 (L)"
87
- }),
88
- /*#__PURE__*/ jsx("h3", {
89
- className: "heading-m",
90
- children: "Overskrift nivå 3 (M)"
91
- }),
92
- /*#__PURE__*/ jsx("h4", {
93
- className: "heading-s",
94
- children: "Overskrift nivå 4 (S)"
95
- }),
96
- /*#__PURE__*/ jsx("h5", {
97
- className: "heading-xs",
98
- children: "Overskrift nivå 5 (XS)"
99
- })
100
- ]
101
- });
102
- };
103
- const Lead = ()=>/*#__PURE__*/ jsx("p", {
104
- className: "lead",
105
- children: "Dokumentavgift er en avgift som du må betale til staten når du kjøper en fast eiendom."
106
- });
107
- const Body = ()=>{
108
- return /*#__PURE__*/ jsxs(Fragment, {
109
- children: [
110
- /*#__PURE__*/ jsx("p", {
111
- className: "paragraph",
112
- children: "Mange opplever at prisvekst og rentehevinger har fått store konsekvenser for økonomien. Førstegangskjøpere og de som tjener mindre, sliter med å komme seg inn på boligmarkedet."
113
- }),
114
- /*#__PURE__*/ jsx("p", {
115
- className: "paragraph",
116
- children: "– Det er et tøft boligmarked, og med de prisene det er på bolig i Oslo, virket det nesten umulig å komme inn på markedet. Jeg var på noen visninger, men det ble enten for lite eller for gammelt og slitt, forteller boligkjøper Brita (30)."
117
- })
118
- ]
119
- });
120
- };
121
- const Blockquote = ()=>/*#__PURE__*/ jsx("blockquote", {
122
- className: "blockquote",
123
- children: "Typografi er grunnmuren i all visuell kommunikasjon; den bærer budskapets vekt og gir strukturen vi bygger vår forståelse på."
124
- });
125
- const Description = ()=>/*#__PURE__*/ jsx("figcaption", {
126
- className: "description",
127
- children: "Lav møblering gjør at rommet oppleves større. Zen Milano-sengen er fra Bohus, mens Soft Serve-lampen er fra Moniker."
128
- });
129
- const ProseContent = ()=>{
130
- return /*#__PURE__*/ jsxs(Fragment, {
131
- children: [
132
- /*#__PURE__*/ jsx("h1", {
133
- className: "text-center",
134
- children: "Woops!"
135
- }),
136
- /*#__PURE__*/ jsx("p", {
137
- className: "lead text-center",
138
- children: "Nå er det noe som er galt her."
139
- }),
140
- /*#__PURE__*/ jsx("p", {
141
- className: "text-center",
142
- children: "Sidene på fluks.obosblockwatne.no er dessverre ikke tilgjengelige akkurat nå. De digitale bygningsarbeiderne våre jobber på spreng for å fikse feilen, og vanligvis er sidene oppe og går igjen i løpet av kort tid. Nedenfor finner du kontaktinformasjon."
143
- }),
144
- /*#__PURE__*/ jsx("h2", {
145
- children: "Kontakt Fluks — OBOS Block Watne"
146
- }),
147
- /*#__PURE__*/ jsx("blockquote", {
148
- children: "Det er et tøft boligmarked, og med de prisene det er på bolig i Oslo, virket det nesten umulig å komme inn på markedet. Jeg var på noen visninger, men det ble enten for lite eller for gammelt og slitt"
149
- }),
150
- /*#__PURE__*/ jsxs("p", {
151
- children: [
152
- "Telefon: ",
153
- /*#__PURE__*/ jsx("a", {
154
- href: "tel:23246000",
155
- children: "+47 23 24 60 00"
156
- })
157
- ]
158
- }),
159
- /*#__PURE__*/ jsx("hr", {}),
160
- /*#__PURE__*/ jsxs("p", {
161
- children: [
162
- "E-post: ",
163
- /*#__PURE__*/ jsx("a", {
164
- href: "mailto:obw.flukspost@obos.no",
165
- children: "obw.flukspost@obos.no"
166
- })
167
- ]
168
- }),
169
- /*#__PURE__*/ jsx("p", {
170
- className: "description",
171
- children: "Ved stor pågang vil det være noe ventetid."
172
- }),
173
- /*#__PURE__*/ jsxs("ul", {
174
- children: [
175
- /*#__PURE__*/ jsx("li", {
176
- children: "hei"
177
- }),
178
- /*#__PURE__*/ jsx("li", {
179
- children: "på"
180
- }),
181
- /*#__PURE__*/ jsx("li", {
182
- children: "deg"
183
- })
184
- ]
185
- }),
186
- /*#__PURE__*/ jsxs("ol", {
187
- children: [
188
- /*#__PURE__*/ jsx("li", {
189
- children: "hei"
190
- }),
191
- /*#__PURE__*/ jsx("li", {
192
- children: "på"
193
- }),
194
- /*#__PURE__*/ jsx("li", {
195
- children: "deg"
196
- })
197
- ]
198
- })
199
- ]
200
- });
201
- };
202
- const Prose = ()=>/*#__PURE__*/ jsx("div", {
203
- className: "prose container-prose my-12md:my-20",
204
- children: /*#__PURE__*/ jsx(ProseContent, {})
205
- });
206
- const ProseWhite = ()=>/*#__PURE__*/ jsx("div", {
207
- className: "prose prose-white container-prose my-12md:my-20 bg-blue-dark",
208
- children: /*#__PURE__*/ jsx(ProseContent, {})
209
- });
210
- const meta = {
211
- title: 'Typography'
212
- };
213
-
214
- export { Blockquote, Body, Default, Description, Headings, Lead, Prose, ProseWhite, meta as default };