@homlista-devs/ui 1.6.8 → 1.7.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/dist/index.css CHANGED
@@ -352,6 +352,9 @@
352
352
  .bottom-0 {
353
353
  bottom: calc(var(--spacing) * 0);
354
354
  }
355
+ .bottom-3 {
356
+ bottom: calc(var(--spacing) * 3);
357
+ }
355
358
  .bottom-4 {
356
359
  bottom: calc(var(--spacing) * 4);
357
360
  }
@@ -388,12 +391,12 @@
388
391
  .col-span-1 {
389
392
  grid-column: span 1 / span 1;
390
393
  }
394
+ .col-span-2 {
395
+ grid-column: span 2 / span 2;
396
+ }
391
397
  .row-span-1 {
392
398
  grid-row: span 1 / span 1;
393
399
  }
394
- .row-span-2 {
395
- grid-row: span 2 / span 2;
396
- }
397
400
  .container {
398
401
  width: 100%;
399
402
  @media (width >= 40rem) {
@@ -570,6 +573,9 @@
570
573
  .h-\[15px\] {
571
574
  height: 15px;
572
575
  }
576
+ .h-\[340px\] {
577
+ height: 340px;
578
+ }
573
579
  .h-\[481px\] {
574
580
  height: 481px;
575
581
  }
@@ -585,6 +591,9 @@
585
591
  .h-px {
586
592
  height: 1px;
587
593
  }
594
+ .max-h-\[70vh\] {
595
+ max-height: 70vh;
596
+ }
588
597
  .max-h-\[90vh\] {
589
598
  max-height: 90vh;
590
599
  }
@@ -740,6 +749,9 @@
740
749
  -moz-appearance: none;
741
750
  appearance: none;
742
751
  }
752
+ .auto-rows-fr {
753
+ grid-auto-rows: minmax(0, 1fr);
754
+ }
743
755
  .grid-cols-1 {
744
756
  grid-template-columns: repeat(1, minmax(0, 1fr));
745
757
  }
@@ -961,9 +973,15 @@
961
973
  .border-input {
962
974
  border-color: var(--color-input);
963
975
  }
976
+ .border-primary {
977
+ border-color: var(--color-primary);
978
+ }
964
979
  .border-success {
965
980
  border-color: var(--color-success);
966
981
  }
982
+ .border-transparent {
983
+ border-color: transparent;
984
+ }
967
985
  .border-warning {
968
986
  border-color: var(--color-warning);
969
987
  }
@@ -1111,6 +1129,12 @@
1111
1129
  background-color: color-mix(in oklab, var(--color-white) 50%, transparent);
1112
1130
  }
1113
1131
  }
1132
+ .bg-white\/90 {
1133
+ background-color: color-mix(in srgb, #fff 90%, transparent);
1134
+ @supports (color: color-mix(in lab, red, red)) {
1135
+ background-color: color-mix(in oklab, var(--color-white) 90%, transparent);
1136
+ }
1137
+ }
1114
1138
  .bg-zinc-100 {
1115
1139
  background-color: var(--color-zinc-100);
1116
1140
  }
@@ -1203,6 +1227,10 @@
1203
1227
  --tw-gradient-to: var(--color-zinc-800);
1204
1228
  --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
1205
1229
  }
1230
+ .object-contain {
1231
+ -o-object-fit: contain;
1232
+ object-fit: contain;
1233
+ }
1206
1234
  .object-cover {
1207
1235
  -o-object-fit: cover;
1208
1236
  object-fit: cover;
@@ -1318,6 +1346,9 @@
1318
1346
  .pr-10 {
1319
1347
  padding-right: calc(var(--spacing) * 10);
1320
1348
  }
1349
+ .pb-1 {
1350
+ padding-bottom: calc(var(--spacing) * 1);
1351
+ }
1321
1352
  .pb-2 {
1322
1353
  padding-bottom: calc(var(--spacing) * 2);
1323
1354
  }
@@ -1874,6 +1905,13 @@
1874
1905
  }
1875
1906
  }
1876
1907
  }
1908
+ .hover\:bg-white {
1909
+ &:hover {
1910
+ @media (hover: hover) {
1911
+ background-color: var(--color-white);
1912
+ }
1913
+ }
1914
+ }
1877
1915
  .hover\:bg-zinc-100 {
1878
1916
  &:hover {
1879
1917
  @media (hover: hover) {
@@ -2145,6 +2183,41 @@
2145
2183
  opacity: 50%;
2146
2184
  }
2147
2185
  }
2186
+ .sm\:right-4 {
2187
+ @media (width >= 40rem) {
2188
+ right: calc(var(--spacing) * 4);
2189
+ }
2190
+ }
2191
+ .sm\:bottom-4 {
2192
+ @media (width >= 40rem) {
2193
+ bottom: calc(var(--spacing) * 4);
2194
+ }
2195
+ }
2196
+ .sm\:col-span-1 {
2197
+ @media (width >= 40rem) {
2198
+ grid-column: span 1 / span 1;
2199
+ }
2200
+ }
2201
+ .sm\:row-span-2 {
2202
+ @media (width >= 40rem) {
2203
+ grid-row: span 2 / span 2;
2204
+ }
2205
+ }
2206
+ .sm\:h-20 {
2207
+ @media (width >= 40rem) {
2208
+ height: calc(var(--spacing) * 20);
2209
+ }
2210
+ }
2211
+ .sm\:h-\[460px\] {
2212
+ @media (width >= 40rem) {
2213
+ height: 460px;
2214
+ }
2215
+ }
2216
+ .sm\:w-20 {
2217
+ @media (width >= 40rem) {
2218
+ width: calc(var(--spacing) * 20);
2219
+ }
2220
+ }
2148
2221
  .sm\:grid-cols-2 {
2149
2222
  @media (width >= 40rem) {
2150
2223
  grid-template-columns: repeat(2, minmax(0, 1fr));
@@ -2155,6 +2228,11 @@
2155
2228
  gap: calc(var(--spacing) * 6);
2156
2229
  }
2157
2230
  }
2231
+ .sm\:px-4 {
2232
+ @media (width >= 40rem) {
2233
+ padding-inline: calc(var(--spacing) * 4);
2234
+ }
2235
+ }
2158
2236
  .sm\:px-6 {
2159
2237
  @media (width >= 40rem) {
2160
2238
  padding-inline: calc(var(--spacing) * 6);
@@ -2172,6 +2250,12 @@
2172
2250
  line-height: var(--tw-leading, var(--text-5xl--line-height));
2173
2251
  }
2174
2252
  }
2253
+ .sm\:text-sm {
2254
+ @media (width >= 40rem) {
2255
+ font-size: var(--text-sm);
2256
+ line-height: var(--tw-leading, var(--text-sm--line-height));
2257
+ }
2258
+ }
2175
2259
  .md\:block {
2176
2260
  @media (width >= 48rem) {
2177
2261
  display: block;
@@ -2192,6 +2276,11 @@
2192
2276
  height: calc(var(--spacing) * 24);
2193
2277
  }
2194
2278
  }
2279
+ .md\:h-\[560px\] {
2280
+ @media (width >= 48rem) {
2281
+ height: 560px;
2282
+ }
2283
+ }
2195
2284
  .md\:w-1\/5 {
2196
2285
  @media (width >= 48rem) {
2197
2286
  width: calc(1/5 * 100%);
@@ -352,6 +352,9 @@
352
352
  .bottom-0 {
353
353
  bottom: calc(var(--spacing) * 0);
354
354
  }
355
+ .bottom-3 {
356
+ bottom: calc(var(--spacing) * 3);
357
+ }
355
358
  .bottom-4 {
356
359
  bottom: calc(var(--spacing) * 4);
357
360
  }
@@ -388,12 +391,12 @@
388
391
  .col-span-1 {
389
392
  grid-column: span 1 / span 1;
390
393
  }
394
+ .col-span-2 {
395
+ grid-column: span 2 / span 2;
396
+ }
391
397
  .row-span-1 {
392
398
  grid-row: span 1 / span 1;
393
399
  }
394
- .row-span-2 {
395
- grid-row: span 2 / span 2;
396
- }
397
400
  .container {
398
401
  width: 100%;
399
402
  @media (width >= 40rem) {
@@ -570,6 +573,9 @@
570
573
  .h-\[15px\] {
571
574
  height: 15px;
572
575
  }
576
+ .h-\[340px\] {
577
+ height: 340px;
578
+ }
573
579
  .h-\[481px\] {
574
580
  height: 481px;
575
581
  }
@@ -585,6 +591,9 @@
585
591
  .h-px {
586
592
  height: 1px;
587
593
  }
594
+ .max-h-\[70vh\] {
595
+ max-height: 70vh;
596
+ }
588
597
  .max-h-\[90vh\] {
589
598
  max-height: 90vh;
590
599
  }
@@ -740,6 +749,9 @@
740
749
  -moz-appearance: none;
741
750
  appearance: none;
742
751
  }
752
+ .auto-rows-fr {
753
+ grid-auto-rows: minmax(0, 1fr);
754
+ }
743
755
  .grid-cols-1 {
744
756
  grid-template-columns: repeat(1, minmax(0, 1fr));
745
757
  }
@@ -961,9 +973,15 @@
961
973
  .border-input {
962
974
  border-color: var(--color-input);
963
975
  }
976
+ .border-primary {
977
+ border-color: var(--color-primary);
978
+ }
964
979
  .border-success {
965
980
  border-color: var(--color-success);
966
981
  }
982
+ .border-transparent {
983
+ border-color: transparent;
984
+ }
967
985
  .border-warning {
968
986
  border-color: var(--color-warning);
969
987
  }
@@ -1111,6 +1129,12 @@
1111
1129
  background-color: color-mix(in oklab, var(--color-white) 50%, transparent);
1112
1130
  }
1113
1131
  }
1132
+ .bg-white\/90 {
1133
+ background-color: color-mix(in srgb, #fff 90%, transparent);
1134
+ @supports (color: color-mix(in lab, red, red)) {
1135
+ background-color: color-mix(in oklab, var(--color-white) 90%, transparent);
1136
+ }
1137
+ }
1114
1138
  .bg-zinc-100 {
1115
1139
  background-color: var(--color-zinc-100);
1116
1140
  }
@@ -1203,6 +1227,10 @@
1203
1227
  --tw-gradient-to: var(--color-zinc-800);
1204
1228
  --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
1205
1229
  }
1230
+ .object-contain {
1231
+ -o-object-fit: contain;
1232
+ object-fit: contain;
1233
+ }
1206
1234
  .object-cover {
1207
1235
  -o-object-fit: cover;
1208
1236
  object-fit: cover;
@@ -1318,6 +1346,9 @@
1318
1346
  .pr-10 {
1319
1347
  padding-right: calc(var(--spacing) * 10);
1320
1348
  }
1349
+ .pb-1 {
1350
+ padding-bottom: calc(var(--spacing) * 1);
1351
+ }
1321
1352
  .pb-2 {
1322
1353
  padding-bottom: calc(var(--spacing) * 2);
1323
1354
  }
@@ -1874,6 +1905,13 @@
1874
1905
  }
1875
1906
  }
1876
1907
  }
1908
+ .hover\:bg-white {
1909
+ &:hover {
1910
+ @media (hover: hover) {
1911
+ background-color: var(--color-white);
1912
+ }
1913
+ }
1914
+ }
1877
1915
  .hover\:bg-zinc-100 {
1878
1916
  &:hover {
1879
1917
  @media (hover: hover) {
@@ -2145,6 +2183,41 @@
2145
2183
  opacity: 50%;
2146
2184
  }
2147
2185
  }
2186
+ .sm\:right-4 {
2187
+ @media (width >= 40rem) {
2188
+ right: calc(var(--spacing) * 4);
2189
+ }
2190
+ }
2191
+ .sm\:bottom-4 {
2192
+ @media (width >= 40rem) {
2193
+ bottom: calc(var(--spacing) * 4);
2194
+ }
2195
+ }
2196
+ .sm\:col-span-1 {
2197
+ @media (width >= 40rem) {
2198
+ grid-column: span 1 / span 1;
2199
+ }
2200
+ }
2201
+ .sm\:row-span-2 {
2202
+ @media (width >= 40rem) {
2203
+ grid-row: span 2 / span 2;
2204
+ }
2205
+ }
2206
+ .sm\:h-20 {
2207
+ @media (width >= 40rem) {
2208
+ height: calc(var(--spacing) * 20);
2209
+ }
2210
+ }
2211
+ .sm\:h-\[460px\] {
2212
+ @media (width >= 40rem) {
2213
+ height: 460px;
2214
+ }
2215
+ }
2216
+ .sm\:w-20 {
2217
+ @media (width >= 40rem) {
2218
+ width: calc(var(--spacing) * 20);
2219
+ }
2220
+ }
2148
2221
  .sm\:grid-cols-2 {
2149
2222
  @media (width >= 40rem) {
2150
2223
  grid-template-columns: repeat(2, minmax(0, 1fr));
@@ -2155,6 +2228,11 @@
2155
2228
  gap: calc(var(--spacing) * 6);
2156
2229
  }
2157
2230
  }
2231
+ .sm\:px-4 {
2232
+ @media (width >= 40rem) {
2233
+ padding-inline: calc(var(--spacing) * 4);
2234
+ }
2235
+ }
2158
2236
  .sm\:px-6 {
2159
2237
  @media (width >= 40rem) {
2160
2238
  padding-inline: calc(var(--spacing) * 6);
@@ -2172,6 +2250,12 @@
2172
2250
  line-height: var(--tw-leading, var(--text-5xl--line-height));
2173
2251
  }
2174
2252
  }
2253
+ .sm\:text-sm {
2254
+ @media (width >= 40rem) {
2255
+ font-size: var(--text-sm);
2256
+ line-height: var(--tw-leading, var(--text-sm--line-height));
2257
+ }
2258
+ }
2175
2259
  .md\:block {
2176
2260
  @media (width >= 48rem) {
2177
2261
  display: block;
@@ -2192,6 +2276,11 @@
2192
2276
  height: calc(var(--spacing) * 24);
2193
2277
  }
2194
2278
  }
2279
+ .md\:h-\[560px\] {
2280
+ @media (width >= 48rem) {
2281
+ height: 560px;
2282
+ }
2283
+ }
2195
2284
  .md\:w-1\/5 {
2196
2285
  @media (width >= 48rem) {
2197
2286
  width: calc(1/5 * 100%);
@@ -0,0 +1,2 @@
1
+ export { usePropertyGallery } from "./use-property-gallery";
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/widgets/property-gallery/model/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC"}
@@ -0,0 +1,19 @@
1
+ interface UsePropertyGalleryParams {
2
+ images: string[];
3
+ onViewAllClick?: () => void;
4
+ onImageClick?: (index: number) => void;
5
+ }
6
+ interface UsePropertyGalleryResult {
7
+ isModalOpen: boolean;
8
+ activeImageIndex: number;
9
+ totalImageCount: number;
10
+ handlePreviewImageClick: (index: number) => void;
11
+ handleViewAllPhotosClick: () => void;
12
+ handleCloseModal: () => void;
13
+ handlePreviousImage: () => void;
14
+ handleNextImage: () => void;
15
+ handleSelectImage: (index: number) => void;
16
+ }
17
+ export declare const usePropertyGallery: ({ images, onViewAllClick, onImageClick, }: UsePropertyGalleryParams) => UsePropertyGalleryResult;
18
+ export {};
19
+ //# sourceMappingURL=use-property-gallery.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"use-property-gallery.d.ts","sourceRoot":"","sources":["../../../../../src/widgets/property-gallery/model/use-property-gallery.ts"],"names":[],"mappings":"AAEA,UAAU,wBAAwB;IACjC,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC;AAED,UAAU,wBAAwB;IACjC,WAAW,EAAE,OAAO,CAAC;IACrB,gBAAgB,EAAE,MAAM,CAAC;IACzB,eAAe,EAAE,MAAM,CAAC;IACxB,uBAAuB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,wBAAwB,EAAE,MAAM,IAAI,CAAC;IACrC,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,mBAAmB,EAAE,MAAM,IAAI,CAAC;IAChC,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAC3C;AAED,eAAO,MAAM,kBAAkB,GAAI,2CAIhC,wBAAwB,KAAG,wBA2E7B,CAAC"}
@@ -0,0 +1,13 @@
1
+ import React from "react";
2
+ interface PropertyGalleryModalProps {
3
+ images: string[];
4
+ isOpen: boolean;
5
+ activeImageIndex: number;
6
+ onClose: () => void;
7
+ onPrevious: () => void;
8
+ onNext: () => void;
9
+ onSelectImage: (index: number) => void;
10
+ }
11
+ export declare const PropertyGalleryModal: React.FC<PropertyGalleryModalProps>;
12
+ export {};
13
+ //# sourceMappingURL=property-gallery-modal.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"property-gallery-modal.d.ts","sourceRoot":"","sources":["../../../../../src/widgets/property-gallery/ui/property-gallery-modal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,UAAU,yBAAyB;IAClC,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,MAAM,EAAE,OAAO,CAAC;IAChB,gBAAgB,EAAE,MAAM,CAAC;IACzB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC;AAED,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,EAAE,CAAC,yBAAyB,CAmFpE,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"property-gallery.d.ts","sourceRoot":"","sources":["../../../../../src/widgets/property-gallery/ui/property-gallery.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,WAAW,oBAAoB;IACpC,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,eAAO,MAAM,eAAe,6FAkI3B,CAAC"}
1
+ {"version":3,"file":"property-gallery.d.ts","sourceRoot":"","sources":["../../../../../src/widgets/property-gallery/ui/property-gallery.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,MAAM,WAAW,oBAAoB;IACpC,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,eAAO,MAAM,eAAe,6FAuJ3B,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@homlista-devs/ui",
3
- "version": "1.6.8",
3
+ "version": "1.7.0",
4
4
  "main": "./dist/design-system.cjs.js",
5
5
  "module": "./dist/design-system.es.js",
6
6
  "types": "./dist/types/index.d.ts",