@opensite/ui 1.7.2 → 1.7.3
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/dist/contact-dark.cjs +137 -95
- package/dist/contact-dark.css +279 -0
- package/dist/contact-dark.d.cts +1 -1
- package/dist/contact-dark.d.ts +1 -1
- package/dist/contact-dark.js +138 -96
- package/dist/contact-faq.cjs +49 -16
- package/dist/contact-faq.css +279 -0
- package/dist/contact-faq.d.cts +1 -1
- package/dist/contact-faq.d.ts +1 -1
- package/dist/contact-faq.js +46 -13
- package/dist/contact-photography.cjs +53 -20
- package/dist/contact-photography.css +279 -0
- package/dist/contact-photography.d.cts +1 -1
- package/dist/contact-photography.d.ts +1 -1
- package/dist/contact-photography.js +49 -16
- package/dist/hero-premium-split-avatars.cjs +1 -1
- package/dist/hero-premium-split-avatars.d.cts +1 -1
- package/dist/hero-premium-split-avatars.d.ts +1 -1
- package/dist/hero-premium-split-avatars.js +1 -1
- package/dist/registry.cjs +240 -126
- package/dist/registry.css +279 -0
- package/dist/registry.js +240 -126
- package/package.json +4 -4
|
@@ -0,0 +1,279 @@
|
|
|
1
|
+
/* components/styles/forms.css */
|
|
2
|
+
.text-input {
|
|
3
|
+
display: flex;
|
|
4
|
+
height: 2.25rem;
|
|
5
|
+
width: 100%;
|
|
6
|
+
border-radius: 0.375rem;
|
|
7
|
+
border: 1px solid var(--input);
|
|
8
|
+
background-color: transparent;
|
|
9
|
+
padding: 0.25rem 0.75rem;
|
|
10
|
+
font-size: 1rem;
|
|
11
|
+
line-height: 1.5rem;
|
|
12
|
+
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
|
|
13
|
+
transition-property:
|
|
14
|
+
color,
|
|
15
|
+
background-color,
|
|
16
|
+
border-color,
|
|
17
|
+
text-decoration-color,
|
|
18
|
+
fill,
|
|
19
|
+
stroke;
|
|
20
|
+
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
21
|
+
transition-duration: 150ms;
|
|
22
|
+
}
|
|
23
|
+
.text-input::placeholder {
|
|
24
|
+
color: var(--muted-foreground);
|
|
25
|
+
}
|
|
26
|
+
.text-input:focus-visible {
|
|
27
|
+
outline: none;
|
|
28
|
+
ring: 1px;
|
|
29
|
+
ring-color: var(--ring);
|
|
30
|
+
}
|
|
31
|
+
.text-input:disabled {
|
|
32
|
+
cursor: not-allowed;
|
|
33
|
+
opacity: 0.5;
|
|
34
|
+
}
|
|
35
|
+
.text-input--error {
|
|
36
|
+
border-color: rgb(239 68 68);
|
|
37
|
+
ring: 1px;
|
|
38
|
+
ring-color: rgb(239 68 68);
|
|
39
|
+
}
|
|
40
|
+
.textarea {
|
|
41
|
+
display: flex;
|
|
42
|
+
min-height: 5rem;
|
|
43
|
+
width: 100%;
|
|
44
|
+
border-radius: 0.375rem;
|
|
45
|
+
border: 1px solid var(--input);
|
|
46
|
+
background-color: transparent;
|
|
47
|
+
padding: 0.5rem 0.75rem;
|
|
48
|
+
font-size: 1rem;
|
|
49
|
+
line-height: 1.5rem;
|
|
50
|
+
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
|
|
51
|
+
transition-property:
|
|
52
|
+
color,
|
|
53
|
+
background-color,
|
|
54
|
+
border-color,
|
|
55
|
+
text-decoration-color,
|
|
56
|
+
fill,
|
|
57
|
+
stroke;
|
|
58
|
+
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
59
|
+
transition-duration: 150ms;
|
|
60
|
+
}
|
|
61
|
+
.textarea::placeholder {
|
|
62
|
+
color: var(--muted-foreground);
|
|
63
|
+
}
|
|
64
|
+
.textarea:focus-visible {
|
|
65
|
+
outline: none;
|
|
66
|
+
ring: 1px;
|
|
67
|
+
ring-color: var(--ring);
|
|
68
|
+
}
|
|
69
|
+
.textarea:disabled {
|
|
70
|
+
cursor: not-allowed;
|
|
71
|
+
opacity: 0.5;
|
|
72
|
+
}
|
|
73
|
+
.textarea--error {
|
|
74
|
+
border-color: rgb(239 68 68);
|
|
75
|
+
ring: 1px;
|
|
76
|
+
ring-color: rgb(239 68 68);
|
|
77
|
+
}
|
|
78
|
+
.select {
|
|
79
|
+
position: relative;
|
|
80
|
+
width: 100%;
|
|
81
|
+
}
|
|
82
|
+
.select-trigger {
|
|
83
|
+
display: flex;
|
|
84
|
+
height: 2.25rem;
|
|
85
|
+
width: 100%;
|
|
86
|
+
align-items: center;
|
|
87
|
+
justify-content: space-between;
|
|
88
|
+
white-space: nowrap;
|
|
89
|
+
border-radius: 0.375rem;
|
|
90
|
+
border: 1px solid var(--input);
|
|
91
|
+
background-color: transparent;
|
|
92
|
+
padding: 0.5rem 0.75rem;
|
|
93
|
+
font-size: 0.875rem;
|
|
94
|
+
line-height: 1.25rem;
|
|
95
|
+
box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
|
|
96
|
+
cursor: pointer;
|
|
97
|
+
transition-property:
|
|
98
|
+
color,
|
|
99
|
+
background-color,
|
|
100
|
+
border-color,
|
|
101
|
+
text-decoration-color,
|
|
102
|
+
fill,
|
|
103
|
+
stroke;
|
|
104
|
+
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
105
|
+
transition-duration: 150ms;
|
|
106
|
+
}
|
|
107
|
+
.select-trigger:hover {
|
|
108
|
+
background-color: var(--accent);
|
|
109
|
+
}
|
|
110
|
+
.select-trigger:focus-visible {
|
|
111
|
+
outline: none;
|
|
112
|
+
ring: 1px;
|
|
113
|
+
ring-color: var(--ring);
|
|
114
|
+
}
|
|
115
|
+
.select-trigger[aria-disabled=true] {
|
|
116
|
+
cursor: not-allowed;
|
|
117
|
+
opacity: 0.5;
|
|
118
|
+
pointer-events: none;
|
|
119
|
+
}
|
|
120
|
+
.select--error .select-trigger {
|
|
121
|
+
border-color: rgb(239 68 68);
|
|
122
|
+
ring: 1px;
|
|
123
|
+
ring-color: rgb(239 68 68);
|
|
124
|
+
}
|
|
125
|
+
.select-value {
|
|
126
|
+
display: flex;
|
|
127
|
+
align-items: center;
|
|
128
|
+
flex: 1;
|
|
129
|
+
overflow: hidden;
|
|
130
|
+
text-overflow: ellipsis;
|
|
131
|
+
}
|
|
132
|
+
.select-placeholder {
|
|
133
|
+
color: var(--muted-foreground);
|
|
134
|
+
}
|
|
135
|
+
.select-icons {
|
|
136
|
+
display: flex;
|
|
137
|
+
align-items: center;
|
|
138
|
+
gap: 0.25rem;
|
|
139
|
+
margin-left: 0.5rem;
|
|
140
|
+
}
|
|
141
|
+
.select-clear {
|
|
142
|
+
display: flex;
|
|
143
|
+
align-items: center;
|
|
144
|
+
justify-content: center;
|
|
145
|
+
height: 1rem;
|
|
146
|
+
width: 1rem;
|
|
147
|
+
border-radius: 0.125rem;
|
|
148
|
+
border: none;
|
|
149
|
+
background: transparent;
|
|
150
|
+
color: var(--muted-foreground);
|
|
151
|
+
cursor: pointer;
|
|
152
|
+
font-size: 0.75rem;
|
|
153
|
+
padding: 0;
|
|
154
|
+
transition: opacity 150ms;
|
|
155
|
+
}
|
|
156
|
+
.select-clear:hover {
|
|
157
|
+
opacity: 0.7;
|
|
158
|
+
}
|
|
159
|
+
.select-arrow {
|
|
160
|
+
color: var(--muted-foreground);
|
|
161
|
+
font-size: 0.75rem;
|
|
162
|
+
line-height: 1;
|
|
163
|
+
}
|
|
164
|
+
.select-loading {
|
|
165
|
+
font-size: 0.75rem;
|
|
166
|
+
}
|
|
167
|
+
.select-dropdown {
|
|
168
|
+
position: absolute;
|
|
169
|
+
z-index: 50;
|
|
170
|
+
top: 100%;
|
|
171
|
+
margin-top: 0.25rem;
|
|
172
|
+
min-width: 100%;
|
|
173
|
+
overflow: hidden;
|
|
174
|
+
border-radius: 0.375rem;
|
|
175
|
+
border: 1px solid var(--border);
|
|
176
|
+
background-color: var(--popover);
|
|
177
|
+
color: var(--popover-foreground);
|
|
178
|
+
box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
|
|
179
|
+
}
|
|
180
|
+
.select-search {
|
|
181
|
+
padding: 0.5rem;
|
|
182
|
+
border-bottom: 1px solid var(--border);
|
|
183
|
+
}
|
|
184
|
+
.select-search-input {
|
|
185
|
+
width: 100%;
|
|
186
|
+
border: 1px solid var(--input);
|
|
187
|
+
border-radius: 0.25rem;
|
|
188
|
+
padding: 0.25rem 0.5rem;
|
|
189
|
+
font-size: 0.875rem;
|
|
190
|
+
background-color: transparent;
|
|
191
|
+
outline: none;
|
|
192
|
+
}
|
|
193
|
+
.select-search-input:focus {
|
|
194
|
+
ring: 1px;
|
|
195
|
+
ring-color: var(--ring);
|
|
196
|
+
}
|
|
197
|
+
.select-options {
|
|
198
|
+
max-height: 16rem;
|
|
199
|
+
overflow-y: auto;
|
|
200
|
+
padding: 0.25rem;
|
|
201
|
+
}
|
|
202
|
+
.select-option {
|
|
203
|
+
position: relative;
|
|
204
|
+
display: flex;
|
|
205
|
+
width: 100%;
|
|
206
|
+
cursor: pointer;
|
|
207
|
+
align-items: center;
|
|
208
|
+
border-radius: 0.25rem;
|
|
209
|
+
padding: 0.375rem 0.5rem 0.375rem 2rem;
|
|
210
|
+
font-size: 0.875rem;
|
|
211
|
+
outline: none;
|
|
212
|
+
transition-property: color, background-color;
|
|
213
|
+
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
214
|
+
transition-duration: 150ms;
|
|
215
|
+
}
|
|
216
|
+
.select-option:hover {
|
|
217
|
+
background-color: var(--accent);
|
|
218
|
+
color: var(--accent-foreground);
|
|
219
|
+
}
|
|
220
|
+
.select-option--focused {
|
|
221
|
+
background-color: var(--accent);
|
|
222
|
+
color: var(--accent-foreground);
|
|
223
|
+
}
|
|
224
|
+
.select-option--selected {
|
|
225
|
+
font-weight: 500;
|
|
226
|
+
background-color: var(--accent);
|
|
227
|
+
}
|
|
228
|
+
.select-option--disabled {
|
|
229
|
+
pointer-events: none;
|
|
230
|
+
opacity: 0.5;
|
|
231
|
+
}
|
|
232
|
+
.select-no-options {
|
|
233
|
+
padding: 0.5rem 0.75rem;
|
|
234
|
+
text-align: center;
|
|
235
|
+
font-size: 0.875rem;
|
|
236
|
+
color: var(--muted-foreground);
|
|
237
|
+
}
|
|
238
|
+
.select-optgroup {
|
|
239
|
+
padding: 0.25rem 0;
|
|
240
|
+
}
|
|
241
|
+
.select-optgroup-label {
|
|
242
|
+
padding: 0.375rem 0.5rem;
|
|
243
|
+
font-size: 0.75rem;
|
|
244
|
+
font-weight: 600;
|
|
245
|
+
color: var(--muted-foreground);
|
|
246
|
+
}
|
|
247
|
+
.field-label {
|
|
248
|
+
display: block;
|
|
249
|
+
font-size: 0.875rem;
|
|
250
|
+
font-weight: 500;
|
|
251
|
+
line-height: 1.25rem;
|
|
252
|
+
margin-bottom: 0.5rem;
|
|
253
|
+
color: var(--foreground);
|
|
254
|
+
}
|
|
255
|
+
.field-required {
|
|
256
|
+
color: rgb(239 68 68);
|
|
257
|
+
margin-left: 0.125rem;
|
|
258
|
+
}
|
|
259
|
+
.field-description {
|
|
260
|
+
font-size: 0.875rem;
|
|
261
|
+
color: var(--muted-foreground);
|
|
262
|
+
margin-bottom: 0.5rem;
|
|
263
|
+
}
|
|
264
|
+
.field-input {
|
|
265
|
+
}
|
|
266
|
+
.field-error {
|
|
267
|
+
font-size: 0.875rem;
|
|
268
|
+
font-weight: 500;
|
|
269
|
+
color: rgb(239 68 68);
|
|
270
|
+
margin-top: 0.5rem;
|
|
271
|
+
}
|
|
272
|
+
@media (min-width: 768px) {
|
|
273
|
+
.text-input,
|
|
274
|
+
.textarea,
|
|
275
|
+
.select-trigger {
|
|
276
|
+
font-size: 0.875rem;
|
|
277
|
+
line-height: 1.25rem;
|
|
278
|
+
}
|
|
279
|
+
}
|
package/dist/contact-faq.d.cts
CHANGED
|
@@ -125,6 +125,6 @@ interface ContactFaqProps {
|
|
|
125
125
|
* />
|
|
126
126
|
* ```
|
|
127
127
|
*/
|
|
128
|
-
declare function ContactFaq({ heading, description, formHeading, buttonText, buttonIcon, actions, actionsSlot, className,
|
|
128
|
+
declare function ContactFaq({ heading, description, formHeading, buttonText, buttonIcon, actions, actionsSlot, className, headerClassName, headingClassName, descriptionClassName, cardClassName, cardContentClassName, formHeadingClassName, formClassName, submitClassName, background, spacing, containerClassName, pattern, patternOpacity, formConfig, onSubmit, onSuccess, onError, }: ContactFaqProps): React.JSX.Element;
|
|
129
129
|
|
|
130
130
|
export { ContactFaq, type ContactFaqProps };
|
package/dist/contact-faq.d.ts
CHANGED
|
@@ -125,6 +125,6 @@ interface ContactFaqProps {
|
|
|
125
125
|
* />
|
|
126
126
|
* ```
|
|
127
127
|
*/
|
|
128
|
-
declare function ContactFaq({ heading, description, formHeading, buttonText, buttonIcon, actions, actionsSlot, className,
|
|
128
|
+
declare function ContactFaq({ heading, description, formHeading, buttonText, buttonIcon, actions, actionsSlot, className, headerClassName, headingClassName, descriptionClassName, cardClassName, cardContentClassName, formHeadingClassName, formClassName, submitClassName, background, spacing, containerClassName, pattern, patternOpacity, formConfig, onSubmit, onSuccess, onError, }: ContactFaqProps): React.JSX.Element;
|
|
129
129
|
|
|
130
130
|
export { ContactFaq, type ContactFaqProps };
|
package/dist/contact-faq.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
import React__default from 'react';
|
|
4
4
|
import { useForm, Form, Field } from '@page-speed/forms';
|
|
5
|
-
import { TextInput
|
|
5
|
+
import { TextInput, TextArea } from '@page-speed/forms/inputs';
|
|
6
6
|
import { clsx } from 'clsx';
|
|
7
7
|
import { twMerge } from 'tailwind-merge';
|
|
8
8
|
import { cva } from 'class-variance-authority';
|
|
@@ -11,8 +11,6 @@ import * as LabelPrimitive from '@radix-ui/react-label';
|
|
|
11
11
|
import { serializeForRails, deserializeErrors } from '@page-speed/forms/integration';
|
|
12
12
|
|
|
13
13
|
// components/blocks/contact/contact-faq.tsx
|
|
14
|
-
var TextInput = TextInput$1;
|
|
15
|
-
var TextArea = TextArea$1;
|
|
16
14
|
function cn(...inputs) {
|
|
17
15
|
return twMerge(clsx(inputs));
|
|
18
16
|
}
|
|
@@ -972,7 +970,6 @@ function ContactFaq({
|
|
|
972
970
|
actions,
|
|
973
971
|
actionsSlot,
|
|
974
972
|
className,
|
|
975
|
-
containerClassName,
|
|
976
973
|
headerClassName,
|
|
977
974
|
headingClassName,
|
|
978
975
|
descriptionClassName,
|
|
@@ -981,10 +978,11 @@ function ContactFaq({
|
|
|
981
978
|
formHeadingClassName,
|
|
982
979
|
formClassName,
|
|
983
980
|
submitClassName,
|
|
984
|
-
background
|
|
985
|
-
spacing = "
|
|
981
|
+
background,
|
|
982
|
+
spacing = "py-8 md:py-32",
|
|
983
|
+
containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
|
|
986
984
|
pattern,
|
|
987
|
-
patternOpacity
|
|
985
|
+
patternOpacity,
|
|
988
986
|
formConfig,
|
|
989
987
|
onSubmit,
|
|
990
988
|
onSuccess,
|
|
@@ -1041,7 +1039,14 @@ function ContactFaq({
|
|
|
1041
1039
|
if (actionsSlot) return actionsSlot;
|
|
1042
1040
|
if (actions && actions.length > 0) {
|
|
1043
1041
|
return actions.map((action, index) => {
|
|
1044
|
-
const {
|
|
1042
|
+
const {
|
|
1043
|
+
label,
|
|
1044
|
+
icon,
|
|
1045
|
+
iconAfter,
|
|
1046
|
+
children,
|
|
1047
|
+
className: actionClassName,
|
|
1048
|
+
...pressableProps
|
|
1049
|
+
} = action;
|
|
1045
1050
|
return /* @__PURE__ */ jsx(
|
|
1046
1051
|
Pressable,
|
|
1047
1052
|
{
|
|
@@ -1067,14 +1072,42 @@ function ContactFaq({
|
|
|
1067
1072
|
spacing,
|
|
1068
1073
|
pattern,
|
|
1069
1074
|
patternOpacity,
|
|
1070
|
-
className
|
|
1071
|
-
|
|
1075
|
+
className,
|
|
1076
|
+
containerClassName,
|
|
1077
|
+
children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
|
|
1072
1078
|
/* @__PURE__ */ jsxs("div", { className: cn("mb-10 text-center", headerClassName), children: [
|
|
1073
|
-
heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
|
|
1074
|
-
|
|
1079
|
+
heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
|
|
1080
|
+
"h2",
|
|
1081
|
+
{
|
|
1082
|
+
className: cn(
|
|
1083
|
+
"mb-3 text-3xl font-bold tracking-tight text-balance",
|
|
1084
|
+
headingClassName
|
|
1085
|
+
),
|
|
1086
|
+
children: heading
|
|
1087
|
+
}
|
|
1088
|
+
) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
|
|
1089
|
+
description && (typeof description === "string" ? /* @__PURE__ */ jsx(
|
|
1090
|
+
"p",
|
|
1091
|
+
{
|
|
1092
|
+
className: cn(
|
|
1093
|
+
"leading-relaxed text-balance",
|
|
1094
|
+
descriptionClassName
|
|
1095
|
+
),
|
|
1096
|
+
children: description
|
|
1097
|
+
}
|
|
1098
|
+
) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description }))
|
|
1075
1099
|
] }),
|
|
1076
1100
|
/* @__PURE__ */ jsx(Card, { className: cn("mx-auto max-w-xl", cardClassName), children: /* @__PURE__ */ jsxs(CardContent, { className: cn("p-6 lg:p-8", cardContentClassName), children: [
|
|
1077
|
-
formHeading && (typeof formHeading === "string" ? /* @__PURE__ */ jsx(
|
|
1101
|
+
formHeading && (typeof formHeading === "string" ? /* @__PURE__ */ jsx(
|
|
1102
|
+
"h3",
|
|
1103
|
+
{
|
|
1104
|
+
className: cn(
|
|
1105
|
+
"mb-6 text-xl font-semibold",
|
|
1106
|
+
formHeadingClassName
|
|
1107
|
+
),
|
|
1108
|
+
children: formHeading
|
|
1109
|
+
}
|
|
1110
|
+
) : /* @__PURE__ */ jsx("div", { className: formHeadingClassName, children: formHeading })),
|
|
1078
1111
|
/* @__PURE__ */ jsxs(
|
|
1079
1112
|
Form,
|
|
1080
1113
|
{
|
|
@@ -33,8 +33,6 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
|
33
33
|
var LabelPrimitive__namespace = /*#__PURE__*/_interopNamespace(LabelPrimitive);
|
|
34
34
|
|
|
35
35
|
// components/blocks/contact/contact-photography.tsx
|
|
36
|
-
var TextInput = inputs.TextInput;
|
|
37
|
-
var TextArea = inputs.TextArea;
|
|
38
36
|
function cn(...inputs) {
|
|
39
37
|
return tailwindMerge.twMerge(clsx.clsx(inputs));
|
|
40
38
|
}
|
|
@@ -993,7 +991,6 @@ function ContactPhotography({
|
|
|
993
991
|
actions,
|
|
994
992
|
actionsSlot,
|
|
995
993
|
className,
|
|
996
|
-
containerClassName,
|
|
997
994
|
headerClassName,
|
|
998
995
|
headingClassName,
|
|
999
996
|
descriptionClassName,
|
|
@@ -1001,10 +998,11 @@ function ContactPhotography({
|
|
|
1001
998
|
cardContentClassName,
|
|
1002
999
|
formClassName,
|
|
1003
1000
|
submitClassName,
|
|
1004
|
-
background
|
|
1005
|
-
spacing = "
|
|
1001
|
+
background,
|
|
1002
|
+
spacing = "py-8 md:py-32",
|
|
1003
|
+
containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
|
|
1006
1004
|
pattern,
|
|
1007
|
-
patternOpacity
|
|
1005
|
+
patternOpacity,
|
|
1008
1006
|
formConfig,
|
|
1009
1007
|
onSubmit,
|
|
1010
1008
|
onSuccess,
|
|
@@ -1063,12 +1061,28 @@ function ContactPhotography({
|
|
|
1063
1061
|
if (actionsSlot) return actionsSlot;
|
|
1064
1062
|
if (actions && actions.length > 0) {
|
|
1065
1063
|
return actions.map((action, index) => {
|
|
1066
|
-
const {
|
|
1067
|
-
return /* @__PURE__ */ jsxRuntime.jsx(Pressable, { asButton: true, className: actionClassName, ...pressableProps, children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1068
|
-
icon,
|
|
1064
|
+
const {
|
|
1069
1065
|
label,
|
|
1070
|
-
|
|
1071
|
-
|
|
1066
|
+
icon,
|
|
1067
|
+
iconAfter,
|
|
1068
|
+
children,
|
|
1069
|
+
className: actionClassName,
|
|
1070
|
+
...pressableProps
|
|
1071
|
+
} = action;
|
|
1072
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1073
|
+
Pressable,
|
|
1074
|
+
{
|
|
1075
|
+
asButton: true,
|
|
1076
|
+
className: actionClassName,
|
|
1077
|
+
...pressableProps,
|
|
1078
|
+
children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
1079
|
+
icon,
|
|
1080
|
+
label,
|
|
1081
|
+
iconAfter
|
|
1082
|
+
] })
|
|
1083
|
+
},
|
|
1084
|
+
index
|
|
1085
|
+
);
|
|
1072
1086
|
});
|
|
1073
1087
|
}
|
|
1074
1088
|
return null;
|
|
@@ -1080,11 +1094,30 @@ function ContactPhotography({
|
|
|
1080
1094
|
spacing,
|
|
1081
1095
|
pattern,
|
|
1082
1096
|
patternOpacity,
|
|
1083
|
-
className
|
|
1084
|
-
|
|
1097
|
+
className,
|
|
1098
|
+
containerClassName,
|
|
1099
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
|
|
1085
1100
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mb-10 text-center", headerClassName), children: [
|
|
1086
|
-
heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
1087
|
-
|
|
1101
|
+
heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
1102
|
+
"h2",
|
|
1103
|
+
{
|
|
1104
|
+
className: cn(
|
|
1105
|
+
"mb-3 text-3xl font-bold tracking-tight text-balance",
|
|
1106
|
+
headingClassName
|
|
1107
|
+
),
|
|
1108
|
+
children: heading
|
|
1109
|
+
}
|
|
1110
|
+
) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
|
|
1111
|
+
description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
1112
|
+
"p",
|
|
1113
|
+
{
|
|
1114
|
+
className: cn(
|
|
1115
|
+
"leading-relaxed text-balance",
|
|
1116
|
+
descriptionClassName
|
|
1117
|
+
),
|
|
1118
|
+
children: description
|
|
1119
|
+
}
|
|
1120
|
+
) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description }))
|
|
1088
1121
|
] }),
|
|
1089
1122
|
/* @__PURE__ */ jsxRuntime.jsx(Card, { className: cn("mx-auto max-w-xl", cardClassName), children: /* @__PURE__ */ jsxRuntime.jsx(CardContent, { className: cn("p-6 lg:p-8", cardContentClassName), children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1090
1123
|
forms.Form,
|
|
@@ -1098,7 +1131,7 @@ function ContactPhotography({
|
|
|
1098
1131
|
/* @__PURE__ */ jsxRuntime.jsx(forms.Field, { name: "first_name", children: ({ field, meta }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
|
|
1099
1132
|
/* @__PURE__ */ jsxRuntime.jsx(Label, { htmlFor: "first-name", children: "First Name" }),
|
|
1100
1133
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1101
|
-
TextInput,
|
|
1134
|
+
inputs.TextInput,
|
|
1102
1135
|
{
|
|
1103
1136
|
...field,
|
|
1104
1137
|
id: "first-name",
|
|
@@ -1111,7 +1144,7 @@ function ContactPhotography({
|
|
|
1111
1144
|
/* @__PURE__ */ jsxRuntime.jsx(forms.Field, { name: "last_name", children: ({ field, meta }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
|
|
1112
1145
|
/* @__PURE__ */ jsxRuntime.jsx(Label, { htmlFor: "last-name", children: "Last Name" }),
|
|
1113
1146
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1114
|
-
TextInput,
|
|
1147
|
+
inputs.TextInput,
|
|
1115
1148
|
{
|
|
1116
1149
|
...field,
|
|
1117
1150
|
id: "last-name",
|
|
@@ -1125,7 +1158,7 @@ function ContactPhotography({
|
|
|
1125
1158
|
/* @__PURE__ */ jsxRuntime.jsx(forms.Field, { name: "email", children: ({ field, meta }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
|
|
1126
1159
|
/* @__PURE__ */ jsxRuntime.jsx(Label, { htmlFor: "email", children: "Email" }),
|
|
1127
1160
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1128
|
-
TextInput,
|
|
1161
|
+
inputs.TextInput,
|
|
1129
1162
|
{
|
|
1130
1163
|
...field,
|
|
1131
1164
|
id: "email",
|
|
@@ -1139,7 +1172,7 @@ function ContactPhotography({
|
|
|
1139
1172
|
/* @__PURE__ */ jsxRuntime.jsx(forms.Field, { name: "phone", children: ({ field, meta }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
|
|
1140
1173
|
/* @__PURE__ */ jsxRuntime.jsx(Label, { htmlFor: "phone", children: "Phone" }),
|
|
1141
1174
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1142
|
-
TextInput,
|
|
1175
|
+
inputs.TextInput,
|
|
1143
1176
|
{
|
|
1144
1177
|
...field,
|
|
1145
1178
|
id: "phone",
|
|
@@ -1153,7 +1186,7 @@ function ContactPhotography({
|
|
|
1153
1186
|
/* @__PURE__ */ jsxRuntime.jsx(forms.Field, { name: "message", children: ({ field, meta }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
|
|
1154
1187
|
/* @__PURE__ */ jsxRuntime.jsx(Label, { htmlFor: "message", children: "Message" }),
|
|
1155
1188
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
1156
|
-
TextArea,
|
|
1189
|
+
inputs.TextArea,
|
|
1157
1190
|
{
|
|
1158
1191
|
...field,
|
|
1159
1192
|
id: "message",
|