@scripso-homepad/ui 0.4.12 → 0.4.13
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/{chunk-YSDLHEJ7.js → chunk-WFMQYYH6.js} +17 -9
- package/dist/chunk-WFMQYYH6.js.map +1 -0
- package/dist/index.cjs +28 -18
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +34 -3
- package/dist/index.d.ts +34 -3
- package/dist/index.js +15 -14
- package/dist/index.js.map +1 -1
- package/dist/web/index.cjs +38 -37
- package/dist/web/index.cjs.map +1 -1
- package/dist/web/index.css +2 -2
- package/dist/web/index.css.map +1 -1
- package/dist/web/index.d.cts +2 -0
- package/dist/web/index.d.ts +2 -0
- package/dist/web/index.js +30 -31
- package/dist/web/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/CountryCodeSelector.tsx +2 -1
- package/src/components/DatePicker.tsx +2 -2
- package/src/components/Select.tsx +2 -2
- package/src/index.ts +1 -0
- package/src/theme/calendar.ts +6 -6
- package/src/theme/tokens.ts +21 -7
- package/src/web/components/Drawer.stories.tsx +1 -1
- package/src/web/components/sonner-toast.css +2 -2
- package/src/web/components/table/TablePrimitives.tsx +5 -1
- package/src/web/icons/TableMenuActivateIcon.tsx +2 -2
- package/src/web/icons/TableMenuEditIcon.tsx +2 -2
- package/src/web/icons/TableMenuSuspendIcon.tsx +2 -9
- package/src/web/mutation-toast.ts +14 -2
- package/dist/chunk-YSDLHEJ7.js.map +0 -1
package/dist/index.d.cts
CHANGED
|
@@ -428,6 +428,37 @@ declare const fontSize: {
|
|
|
428
428
|
readonly xl: 24;
|
|
429
429
|
readonly xxl: 32;
|
|
430
430
|
};
|
|
431
|
+
/**
|
|
432
|
+
* Canonical Homepad type scale (matches `.typography-*` in `src/web/styles/typography.css`).
|
|
433
|
+
* font-size / line-height pairs:
|
|
434
|
+
* 12/16 · 14/19 · 18/24 · 20/27 · 24/25 · 32/34
|
|
435
|
+
*/
|
|
436
|
+
declare const typographyScale: {
|
|
437
|
+
readonly 12: {
|
|
438
|
+
readonly fontSize: 12;
|
|
439
|
+
readonly lineHeight: 16;
|
|
440
|
+
};
|
|
441
|
+
readonly 14: {
|
|
442
|
+
readonly fontSize: 14;
|
|
443
|
+
readonly lineHeight: 19;
|
|
444
|
+
};
|
|
445
|
+
readonly 18: {
|
|
446
|
+
readonly fontSize: 18;
|
|
447
|
+
readonly lineHeight: 24;
|
|
448
|
+
};
|
|
449
|
+
readonly 20: {
|
|
450
|
+
readonly fontSize: 20;
|
|
451
|
+
readonly lineHeight: 27;
|
|
452
|
+
};
|
|
453
|
+
readonly 24: {
|
|
454
|
+
readonly fontSize: 24;
|
|
455
|
+
readonly lineHeight: 25;
|
|
456
|
+
};
|
|
457
|
+
readonly 32: {
|
|
458
|
+
readonly fontSize: 32;
|
|
459
|
+
readonly lineHeight: 34;
|
|
460
|
+
};
|
|
461
|
+
};
|
|
431
462
|
declare const fontWeight: {
|
|
432
463
|
regular: "400";
|
|
433
464
|
medium: "500";
|
|
@@ -437,12 +468,12 @@ declare const fontWeight: {
|
|
|
437
468
|
declare const fonts: {
|
|
438
469
|
readonly sans: "Noto Sans Armenian";
|
|
439
470
|
};
|
|
440
|
-
/** Input label typography —
|
|
471
|
+
/** Input label typography — Medium, typography-12 scale. */
|
|
441
472
|
declare const labelTypography: {
|
|
442
473
|
readonly fontFamily: "Noto Sans Armenian";
|
|
443
474
|
readonly fontSize: 12;
|
|
444
475
|
readonly fontWeight: "500";
|
|
445
|
-
readonly lineHeight:
|
|
476
|
+
readonly lineHeight: 16;
|
|
446
477
|
readonly letterSpacing: 0;
|
|
447
478
|
};
|
|
448
479
|
/** Button label typography — SemiBold. */
|
|
@@ -485,4 +516,4 @@ declare const shadows: {
|
|
|
485
516
|
};
|
|
486
517
|
};
|
|
487
518
|
|
|
488
|
-
export { Button, type ButtonProps, type ButtonSize, type ButtonVariant, Calendar, CalendarIcon, type CalendarLabels, type CalendarLocale, CalendarLocaleProvider, type CalendarLocaleProviderProps, type CalendarProps, type CalendarRangeProps, type CalendarSingleProps, type CalendarTranslationKey$1 as CalendarTranslationKey, type CalendarTranslations, type Country, CountryCodeSelector, type CountryCodeSelectorProps, DatePicker, type DatePickerProps, type DatePickerRangeProps, type DatePickerSingleProps, type DateRange, type EmeraldGreenStep, Input, type InputProps, Label, type LabelProps, LockIcon, type MultipleSelectProps, type NavyStep, PhoneInput, type PhoneInputProps, type RubyRedStep, Select, type SelectOption, type SelectProps, type SingleSelectProps, type StormGrayStep, brand, buttonTypography, calendarTranslations, colors, countries, defaultCountry, emeraldGreen, findCountry, fontSize, fontWeight, fonts, formatLocalizedCalendarMonthYear, getCalendarMonthLabels, getCalendarTranslations, labelTypography, navy, radii, resolveCalendarLocale, resolveWeekdayLabels, rubyRed, shadows, spacing, stormGray, useCalendarLocale };
|
|
519
|
+
export { Button, type ButtonProps, type ButtonSize, type ButtonVariant, Calendar, CalendarIcon, type CalendarLabels, type CalendarLocale, CalendarLocaleProvider, type CalendarLocaleProviderProps, type CalendarProps, type CalendarRangeProps, type CalendarSingleProps, type CalendarTranslationKey$1 as CalendarTranslationKey, type CalendarTranslations, type Country, CountryCodeSelector, type CountryCodeSelectorProps, DatePicker, type DatePickerProps, type DatePickerRangeProps, type DatePickerSingleProps, type DateRange, type EmeraldGreenStep, Input, type InputProps, Label, type LabelProps, LockIcon, type MultipleSelectProps, type NavyStep, PhoneInput, type PhoneInputProps, type RubyRedStep, Select, type SelectOption, type SelectProps, type SingleSelectProps, type StormGrayStep, brand, buttonTypography, calendarTranslations, colors, countries, defaultCountry, emeraldGreen, findCountry, fontSize, fontWeight, fonts, formatLocalizedCalendarMonthYear, getCalendarMonthLabels, getCalendarTranslations, labelTypography, navy, radii, resolveCalendarLocale, resolveWeekdayLabels, rubyRed, shadows, spacing, stormGray, typographyScale, useCalendarLocale };
|
package/dist/index.d.ts
CHANGED
|
@@ -428,6 +428,37 @@ declare const fontSize: {
|
|
|
428
428
|
readonly xl: 24;
|
|
429
429
|
readonly xxl: 32;
|
|
430
430
|
};
|
|
431
|
+
/**
|
|
432
|
+
* Canonical Homepad type scale (matches `.typography-*` in `src/web/styles/typography.css`).
|
|
433
|
+
* font-size / line-height pairs:
|
|
434
|
+
* 12/16 · 14/19 · 18/24 · 20/27 · 24/25 · 32/34
|
|
435
|
+
*/
|
|
436
|
+
declare const typographyScale: {
|
|
437
|
+
readonly 12: {
|
|
438
|
+
readonly fontSize: 12;
|
|
439
|
+
readonly lineHeight: 16;
|
|
440
|
+
};
|
|
441
|
+
readonly 14: {
|
|
442
|
+
readonly fontSize: 14;
|
|
443
|
+
readonly lineHeight: 19;
|
|
444
|
+
};
|
|
445
|
+
readonly 18: {
|
|
446
|
+
readonly fontSize: 18;
|
|
447
|
+
readonly lineHeight: 24;
|
|
448
|
+
};
|
|
449
|
+
readonly 20: {
|
|
450
|
+
readonly fontSize: 20;
|
|
451
|
+
readonly lineHeight: 27;
|
|
452
|
+
};
|
|
453
|
+
readonly 24: {
|
|
454
|
+
readonly fontSize: 24;
|
|
455
|
+
readonly lineHeight: 25;
|
|
456
|
+
};
|
|
457
|
+
readonly 32: {
|
|
458
|
+
readonly fontSize: 32;
|
|
459
|
+
readonly lineHeight: 34;
|
|
460
|
+
};
|
|
461
|
+
};
|
|
431
462
|
declare const fontWeight: {
|
|
432
463
|
regular: "400";
|
|
433
464
|
medium: "500";
|
|
@@ -437,12 +468,12 @@ declare const fontWeight: {
|
|
|
437
468
|
declare const fonts: {
|
|
438
469
|
readonly sans: "Noto Sans Armenian";
|
|
439
470
|
};
|
|
440
|
-
/** Input label typography —
|
|
471
|
+
/** Input label typography — Medium, typography-12 scale. */
|
|
441
472
|
declare const labelTypography: {
|
|
442
473
|
readonly fontFamily: "Noto Sans Armenian";
|
|
443
474
|
readonly fontSize: 12;
|
|
444
475
|
readonly fontWeight: "500";
|
|
445
|
-
readonly lineHeight:
|
|
476
|
+
readonly lineHeight: 16;
|
|
446
477
|
readonly letterSpacing: 0;
|
|
447
478
|
};
|
|
448
479
|
/** Button label typography — SemiBold. */
|
|
@@ -485,4 +516,4 @@ declare const shadows: {
|
|
|
485
516
|
};
|
|
486
517
|
};
|
|
487
518
|
|
|
488
|
-
export { Button, type ButtonProps, type ButtonSize, type ButtonVariant, Calendar, CalendarIcon, type CalendarLabels, type CalendarLocale, CalendarLocaleProvider, type CalendarLocaleProviderProps, type CalendarProps, type CalendarRangeProps, type CalendarSingleProps, type CalendarTranslationKey$1 as CalendarTranslationKey, type CalendarTranslations, type Country, CountryCodeSelector, type CountryCodeSelectorProps, DatePicker, type DatePickerProps, type DatePickerRangeProps, type DatePickerSingleProps, type DateRange, type EmeraldGreenStep, Input, type InputProps, Label, type LabelProps, LockIcon, type MultipleSelectProps, type NavyStep, PhoneInput, type PhoneInputProps, type RubyRedStep, Select, type SelectOption, type SelectProps, type SingleSelectProps, type StormGrayStep, brand, buttonTypography, calendarTranslations, colors, countries, defaultCountry, emeraldGreen, findCountry, fontSize, fontWeight, fonts, formatLocalizedCalendarMonthYear, getCalendarMonthLabels, getCalendarTranslations, labelTypography, navy, radii, resolveCalendarLocale, resolveWeekdayLabels, rubyRed, shadows, spacing, stormGray, useCalendarLocale };
|
|
519
|
+
export { Button, type ButtonProps, type ButtonSize, type ButtonVariant, Calendar, CalendarIcon, type CalendarLabels, type CalendarLocale, CalendarLocaleProvider, type CalendarLocaleProviderProps, type CalendarProps, type CalendarRangeProps, type CalendarSingleProps, type CalendarTranslationKey$1 as CalendarTranslationKey, type CalendarTranslations, type Country, CountryCodeSelector, type CountryCodeSelectorProps, DatePicker, type DatePickerProps, type DatePickerRangeProps, type DatePickerSingleProps, type DateRange, type EmeraldGreenStep, Input, type InputProps, Label, type LabelProps, LockIcon, type MultipleSelectProps, type NavyStep, PhoneInput, type PhoneInputProps, type RubyRedStep, Select, type SelectOption, type SelectProps, type SingleSelectProps, type StormGrayStep, brand, buttonTypography, calendarTranslations, colors, countries, defaultCountry, emeraldGreen, findCountry, fontSize, fontWeight, fonts, formatLocalizedCalendarMonthYear, getCalendarMonthLabels, getCalendarTranslations, labelTypography, navy, radii, resolveCalendarLocale, resolveWeekdayLabels, rubyRed, shadows, spacing, stormGray, typographyScale, useCalendarLocale };
|
package/dist/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { spacing, colors, fontWeight, fontSize, fonts, radii, INPUT_ICON_GAP, useApplyWebClassName, resolveInputVisualState, Label, getInputFieldStyles, inputFieldMetrics } from './chunk-
|
|
2
|
-
export { Button, Input, Label, brand, buttonTypography, colors, emeraldGreen, fontSize, fontWeight, fonts, labelTypography, navy, radii, rubyRed, shadows, spacing, stormGray } from './chunk-
|
|
1
|
+
import { spacing, colors, fontWeight, fontSize, fonts, radii, INPUT_ICON_GAP, useApplyWebClassName, resolveInputVisualState, Label, getInputFieldStyles, inputFieldMetrics } from './chunk-WFMQYYH6.js';
|
|
2
|
+
export { Button, Input, Label, brand, buttonTypography, colors, emeraldGreen, fontSize, fontWeight, fonts, labelTypography, navy, radii, rubyRed, shadows, spacing, stormGray, typographyScale } from './chunk-WFMQYYH6.js';
|
|
3
3
|
import { createContext, useRef, useState, useMemo, useEffect, useLayoutEffect, useContext, isValidElement, cloneElement } from 'react';
|
|
4
4
|
import { Platform, StyleSheet, Animated, Easing, View, Pressable, Text, Modal, ScrollView, TextInput, Dimensions } from 'react-native';
|
|
5
5
|
import Svg2, { Path } from 'react-native-svg';
|
|
@@ -757,12 +757,12 @@ var styles = StyleSheet.create({
|
|
|
757
757
|
},
|
|
758
758
|
error: {
|
|
759
759
|
fontSize: 12,
|
|
760
|
-
lineHeight:
|
|
760
|
+
lineHeight: 16,
|
|
761
761
|
color: colors.inputError
|
|
762
762
|
},
|
|
763
763
|
hint: {
|
|
764
764
|
fontSize: 12,
|
|
765
|
-
lineHeight:
|
|
765
|
+
lineHeight: 16,
|
|
766
766
|
color: colors.stormGray300
|
|
767
767
|
}
|
|
768
768
|
});
|
|
@@ -1032,11 +1032,12 @@ var styles2 = StyleSheet.create({
|
|
|
1032
1032
|
},
|
|
1033
1033
|
flag: {
|
|
1034
1034
|
fontSize: 18,
|
|
1035
|
-
lineHeight:
|
|
1035
|
+
lineHeight: 24
|
|
1036
1036
|
},
|
|
1037
1037
|
dialCode: {
|
|
1038
1038
|
fontSize: fontSize.md,
|
|
1039
|
-
fontWeight: fontWeight.medium
|
|
1039
|
+
fontWeight: fontWeight.medium,
|
|
1040
|
+
lineHeight: 19
|
|
1040
1041
|
},
|
|
1041
1042
|
overlay: {
|
|
1042
1043
|
flex: 1,
|
|
@@ -1277,7 +1278,7 @@ var calendarLabelTypography = {
|
|
|
1277
1278
|
fontFamily: fonts.sans,
|
|
1278
1279
|
fontSize: fontSize.sm,
|
|
1279
1280
|
fontWeight: fontWeight.medium,
|
|
1280
|
-
lineHeight:
|
|
1281
|
+
lineHeight: 16,
|
|
1281
1282
|
letterSpacing: 0,
|
|
1282
1283
|
color: colors.slateBlue
|
|
1283
1284
|
};
|
|
@@ -1285,7 +1286,7 @@ var calendarFieldTypography = {
|
|
|
1285
1286
|
fontFamily: fonts.sans,
|
|
1286
1287
|
fontSize: fontSize.md,
|
|
1287
1288
|
fontWeight: fontWeight.regular,
|
|
1288
|
-
lineHeight:
|
|
1289
|
+
lineHeight: 19,
|
|
1289
1290
|
letterSpacing: 0,
|
|
1290
1291
|
textAlign: "left"
|
|
1291
1292
|
};
|
|
@@ -1323,7 +1324,7 @@ var calendarDropdownMetrics = StyleSheet.create({
|
|
|
1323
1324
|
fontFamily: fonts.sans,
|
|
1324
1325
|
fontSize: fontSize.md,
|
|
1325
1326
|
fontWeight: fontWeight.bold,
|
|
1326
|
-
lineHeight:
|
|
1327
|
+
lineHeight: 19,
|
|
1327
1328
|
letterSpacing: 0,
|
|
1328
1329
|
color: colors.stormGray850
|
|
1329
1330
|
},
|
|
@@ -1364,7 +1365,7 @@ var calendarDropdownMetrics = StyleSheet.create({
|
|
|
1364
1365
|
fontFamily: fonts.sans,
|
|
1365
1366
|
fontSize: fontSize.sm,
|
|
1366
1367
|
fontWeight: fontWeight.regular,
|
|
1367
|
-
lineHeight:
|
|
1368
|
+
lineHeight: 16,
|
|
1368
1369
|
letterSpacing: 0,
|
|
1369
1370
|
textAlign: "center",
|
|
1370
1371
|
color: colors.stormGray300,
|
|
@@ -1406,7 +1407,7 @@ var calendarDropdownMetrics = StyleSheet.create({
|
|
|
1406
1407
|
fontFamily: fonts.sans,
|
|
1407
1408
|
fontSize: fontSize.md,
|
|
1408
1409
|
fontWeight: fontWeight.regular,
|
|
1409
|
-
lineHeight:
|
|
1410
|
+
lineHeight: 19,
|
|
1410
1411
|
letterSpacing: 0,
|
|
1411
1412
|
textAlign: "center",
|
|
1412
1413
|
color: colors.navy,
|
|
@@ -1477,7 +1478,7 @@ var calendarDropdownMetrics = StyleSheet.create({
|
|
|
1477
1478
|
fontFamily: fonts.sans,
|
|
1478
1479
|
fontSize: fontSize.md,
|
|
1479
1480
|
fontWeight: fontWeight.regular,
|
|
1480
|
-
lineHeight:
|
|
1481
|
+
lineHeight: 19,
|
|
1481
1482
|
letterSpacing: 0,
|
|
1482
1483
|
textAlign: "center",
|
|
1483
1484
|
color: colors.navy,
|
|
@@ -2508,12 +2509,12 @@ var styles4 = StyleSheet.create({
|
|
|
2508
2509
|
},
|
|
2509
2510
|
error: {
|
|
2510
2511
|
fontSize: 12,
|
|
2511
|
-
lineHeight:
|
|
2512
|
+
lineHeight: 16,
|
|
2512
2513
|
color: colors.inputError
|
|
2513
2514
|
},
|
|
2514
2515
|
hint: {
|
|
2515
2516
|
fontSize: 12,
|
|
2516
|
-
lineHeight:
|
|
2517
|
+
lineHeight: 16,
|
|
2517
2518
|
color: colors.stormGray300
|
|
2518
2519
|
}
|
|
2519
2520
|
});
|