@jsenv/navi 0.27.9 → 0.27.11

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.
@@ -5347,7 +5347,7 @@ const generateSignalId = () => {
5347
5347
  const stringUndefinedAliasSet = new Set([""]);
5348
5348
  const stringTypeSet = new Set([
5349
5349
  "string",
5350
- "day",
5350
+ "date",
5351
5351
  "month",
5352
5352
  "week",
5353
5353
  "time",
@@ -6387,7 +6387,7 @@ const applyOnTwoProps = (propA, propB) => {
6387
6387
  };
6388
6388
  };
6389
6389
 
6390
- const FLOW_PROPS = {
6390
+ const LAYOUT_PROPS = {
6391
6391
  // all are handled by navi-attributes
6392
6392
  inline: () => {},
6393
6393
  block: () => {},
@@ -6398,12 +6398,8 @@ const FLOW_PROPS = {
6398
6398
  display: PASS_THROUGH, // in case people write "display: none" (even if hidden prop is recommended)
6399
6399
  row: () => {},
6400
6400
  column: () => {},
6401
-
6402
- // not really related to flow but should be on the container element if any
6403
- pointerEvents: PASS_THROUGH,
6404
- viewTransitionName: PASS_THROUGH,
6405
6401
  };
6406
- const OUTER_SPACING_PROPS = {
6402
+ const OUTER_PROPS = {
6407
6403
  margin: PASS_THROUGH,
6408
6404
  marginLeft: PASS_THROUGH,
6409
6405
  marginRight: PASS_THROUGH,
@@ -6411,8 +6407,12 @@ const OUTER_SPACING_PROPS = {
6411
6407
  marginBottom: PASS_THROUGH,
6412
6408
  marginX: applyOnTwoCSSProps("marginLeft", "marginRight"),
6413
6409
  marginY: applyOnTwoCSSProps("marginTop", "marginBottom"),
6410
+
6411
+ // not really related to flow but should be on the container element if any
6412
+ pointerEvents: PASS_THROUGH,
6413
+ viewTransitionName: PASS_THROUGH,
6414
6414
  };
6415
- const INNER_SPACING_PROPS = {
6415
+ const INNER_PROPS = {
6416
6416
  padding: PASS_THROUGH,
6417
6417
  paddingLeft: PASS_THROUGH,
6418
6418
  paddingRight: PASS_THROUGH,
@@ -6692,6 +6692,27 @@ const TYPO_PROPS = {
6692
6692
  uppercase: applyToCssPropWhenTruthy("textTransform", "uppercase", "none"),
6693
6693
  lowercase: applyToCssPropWhenTruthy("textTransform", "lowercase", "none"),
6694
6694
  letterSpacing: PASS_THROUGH,
6695
+ overflowEllipsis: (value) => {
6696
+ if (!value) {
6697
+ return null;
6698
+ }
6699
+ return {
6700
+ overflow: "hidden",
6701
+ textOverflow: "ellipsis",
6702
+ overflowWrap: "normal",
6703
+ };
6704
+ },
6705
+ lineClamp: (value) => {
6706
+ if (!value) {
6707
+ return null;
6708
+ }
6709
+ return {
6710
+ "overflow": "hidden",
6711
+ "display": "-webkit-box",
6712
+ "-webkit-box-orient": "vertical",
6713
+ "-webkit-line-clamp": value,
6714
+ };
6715
+ },
6695
6716
  };
6696
6717
  const VISUAL_PROPS = {
6697
6718
  outline: PASS_THROUGH,
@@ -6725,16 +6746,6 @@ const VISUAL_PROPS = {
6725
6746
  overflow: PASS_THROUGH,
6726
6747
  overflowX: PASS_THROUGH,
6727
6748
  overflowY: PASS_THROUGH,
6728
- overflowEllipsis: (value) => {
6729
- if (value === undefined || value === false) {
6730
- return null;
6731
- }
6732
- return {
6733
- overflow: "hidden",
6734
- textOverflow: "ellipsis",
6735
- overflowWrap: "normal",
6736
- };
6737
- },
6738
6749
  objectFit: PASS_THROUGH,
6739
6750
  accentColor: PASS_THROUGH,
6740
6751
  };
@@ -6778,7 +6789,7 @@ const CONTENT_PROPS = {
6778
6789
  };
6779
6790
  },
6780
6791
  spacing: (value, { boxFlow }) => {
6781
- if (isSpacingHandledByFlow(boxFlow)) {
6792
+ if (isSpacingHandledByLayout(boxFlow)) {
6782
6793
  return {
6783
6794
  gap: stringifySpacingStyle(value, "gap"),
6784
6795
  };
@@ -6812,7 +6823,7 @@ const CONTENT_PROPS = {
6812
6823
  return undefined;
6813
6824
  },
6814
6825
  };
6815
- const flowSpacingHandlerSet = new Set([
6826
+ const LAYOUT_HANDLING_SPACING_SET = new Set([
6816
6827
  "flex-x",
6817
6828
  "flex-y",
6818
6829
  "inline-flex-x",
@@ -6820,36 +6831,58 @@ const flowSpacingHandlerSet = new Set([
6820
6831
  "grid",
6821
6832
  "inline-grid",
6822
6833
  ]);
6823
- const isSpacingHandledByFlow = (boxFlow) => {
6824
- return flowSpacingHandlerSet.has(boxFlow);
6834
+ const isSpacingHandledByLayout = (boxFlow) => {
6835
+ return LAYOUT_HANDLING_SPACING_SET.has(boxFlow);
6825
6836
  };
6826
6837
 
6827
6838
  const All_PROPS = {
6828
- ...FLOW_PROPS,
6829
- ...OUTER_SPACING_PROPS,
6830
- ...INNER_SPACING_PROPS,
6839
+ ...LAYOUT_PROPS,
6840
+ ...OUTER_PROPS,
6841
+ ...INNER_PROPS,
6831
6842
  ...DIMENSION_PROPS,
6832
6843
  ...POSITION_PROPS,
6833
6844
  ...TYPO_PROPS,
6834
6845
  ...VISUAL_PROPS,
6835
6846
  ...CONTENT_PROPS,
6836
6847
  };
6837
- const FLOW_PROP_NAME_SET = new Set(Object.keys(FLOW_PROPS));
6838
- const OUTER_SPACING_PROP_NAME_SET = new Set(Object.keys(OUTER_SPACING_PROPS));
6839
- const INNER_SPACING_PROP_NAME_SET = new Set(Object.keys(INNER_SPACING_PROPS));
6840
- const DIMENSION_PROP_NAME_SET = new Set(Object.keys(DIMENSION_PROPS));
6841
- const POSITION_PROP_NAME_SET = new Set(Object.keys(POSITION_PROPS));
6848
+ const LAYOUT_PROP_NAME_SET = new Set(Object.keys(LAYOUT_PROPS));
6849
+ // const OUTER_PROP_NAME_SET = new Set(Object.keys(OUTER_PROPS));
6850
+ const INNER_PROP_NAME_SET = new Set(Object.keys(INNER_PROPS));
6851
+ // const DIMENSION_PROP_NAME_SET = new Set(Object.keys(DIMENSION_PROPS));
6852
+ // const POSITION_PROP_NAME_SET = new Set(Object.keys(POSITION_PROPS));
6842
6853
  const TYPO_PROP_NAME_SET = new Set(Object.keys(TYPO_PROPS));
6843
6854
  const VISUAL_PROP_NAME_SET = new Set(Object.keys(VISUAL_PROPS));
6844
6855
  const CONTENT_PROP_NAME_SET = new Set(Object.keys(CONTENT_PROPS));
6845
6856
  const STYLE_PROP_NAME_SET = new Set(Object.keys(All_PROPS));
6857
+ const SPACING_PROP_SET = new Set([
6858
+ "borderRadius",
6859
+ "spacing",
6860
+ "spacingX",
6861
+ "spacingY",
6862
+ "margin",
6863
+ "marginLeft",
6864
+ "marginRight",
6865
+ "marginTop",
6866
+ "marginBottom",
6867
+ "marginX",
6868
+ "marginY",
6869
+ "padding",
6870
+ "paddingLeft",
6871
+ "paddingRight",
6872
+ "paddingTop",
6873
+ "paddingBottom",
6874
+ "paddingX",
6875
+ "paddingY",
6876
+ ]);
6846
6877
 
6847
6878
  const COPIED_ON_VISUAL_CHILD_PROP_SET = new Set([
6848
- ...FLOW_PROP_NAME_SET,
6879
+ ...LAYOUT_PROP_NAME_SET,
6849
6880
  "expand",
6850
6881
  "expandX",
6851
6882
  "expandY",
6852
6883
  "shrink",
6884
+ "shrinkX",
6885
+ "shrinkY",
6853
6886
  "align",
6854
6887
  "alignX",
6855
6888
  "alignY",
@@ -6857,7 +6890,7 @@ const COPIED_ON_VISUAL_CHILD_PROP_SET = new Set([
6857
6890
  "minHeight",
6858
6891
  ]);
6859
6892
  const HANDLED_BY_VISUAL_CHILD_PROP_SET = new Set([
6860
- ...INNER_SPACING_PROP_NAME_SET,
6893
+ ...INNER_PROP_NAME_SET,
6861
6894
  ...VISUAL_PROP_NAME_SET,
6862
6895
  ...CONTENT_PROP_NAME_SET,
6863
6896
  ]);
@@ -6873,47 +6906,11 @@ const getVisualChildStylePropStrategy = (name) => {
6873
6906
 
6874
6907
  const isStyleProp = (name) => STYLE_PROP_NAME_SET.has(name);
6875
6908
 
6876
- const getStylePropGroup = (name) => {
6877
- if (FLOW_PROP_NAME_SET.has(name)) {
6878
- return "flow";
6879
- }
6880
- if (OUTER_SPACING_PROP_NAME_SET.has(name)) {
6881
- return "margin";
6882
- }
6883
- if (INNER_SPACING_PROP_NAME_SET.has(name)) {
6884
- return "padding";
6885
- }
6886
- if (DIMENSION_PROP_NAME_SET.has(name)) {
6887
- return "dimension";
6888
- }
6889
- if (POSITION_PROP_NAME_SET.has(name)) {
6890
- return "position";
6891
- }
6892
- if (TYPO_PROP_NAME_SET.has(name)) {
6893
- return "typo";
6894
- }
6895
- if (VISUAL_PROP_NAME_SET.has(name)) {
6896
- return "visual";
6897
- }
6898
- if (CONTENT_PROP_NAME_SET.has(name)) {
6899
- return "content";
6900
- }
6901
- return null;
6902
- };
6903
6909
  const getStringifier = (key) => {
6904
- if (
6905
- key === "borderRadius" ||
6906
- key === "spacing" ||
6907
- key === "spacingX" ||
6908
- key === "spacingY"
6909
- ) {
6910
- return stringifySpacingStyle;
6911
- }
6912
- const group = getStylePropGroup(key);
6913
- if (group === "margin" || group === "padding") {
6910
+ if (SPACING_PROP_SET.has(key)) {
6914
6911
  return stringifySpacingStyle;
6915
6912
  }
6916
- if (group === "typo") {
6913
+ if (TYPO_PROP_NAME_SET.has(key)) {
6917
6914
  return stringifyTypoStyle;
6918
6915
  }
6919
6916
  return stringifyStyle;
@@ -35806,7 +35803,7 @@ installImportMetaCssBuild(import.meta);const css$k = /* css */`
35806
35803
  * A button-like trigger that opens a picker when clicked.
35807
35804
  *
35808
35805
  * Use the `type` prop to choose what kind of picker to open:
35809
- * "day" — calendar day
35806
+ * "date" — calendar day
35810
35807
  * "month" — year + month
35811
35808
  * "week" — ISO week
35812
35809
  * "time" — hours + minutes