rename singleline to ellipsizedUrl

cybersemics · Sep 9, 2024 · ee27d30 · ee27d30
1 parent 65ac386
commit ee27d30
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 15 deletions.
diff --git a/src/components/StaticThought.tsx b/src/components/StaticThought.tsx
@@ -36,7 +36,7 @@ export interface ThoughtProps {
   // Subthoughts gets the special __PENDING__ value from getContexts and passes it through to Thought and Static Thought
   isContextPending?: boolean
   isEditing?: boolean
-  singleline?: boolean
+  ellipsizedUrl?: boolean
   isPublishChild?: boolean
   // true if the thought is not hidden by autofocus, i.e. actualDistance < 2
   // currently this does not control visibility, but merely tracks it
@@ -92,7 +92,7 @@ const StaticThought = ({
   env,
   isContextPending,
   isEditing,
-  singleline,
+  ellipsizedUrl,
   isVisible,
   onEdit,
   path,
@@ -154,7 +154,7 @@ const StaticThought = ({
         env={env}
         minContexts={allowSingleContext ? 0 : 2}
         multiline={multiline}
-        singleline={singleline}
+        ellipsizedUrl={ellipsizedUrl}
         placeholder={placeholder}
         path={path}
         showContextBreadcrumbs={showContextBreadcrumbs}
@@ -165,7 +165,7 @@ const StaticThought = ({
       <div
         aria-label='thought'
         className={thought({
-          singleline,
+          ellipsizedUrl,
           inverse: (dark && isBlack(styleAnnotation?.color)) || (!dark && isWhite(styleAnnotation?.color)),
         })}
         style={{
@@ -196,7 +196,7 @@ const StaticThought = ({
             className={css({
               ...(isTableCol1 && { maxWidth: '100%' }),
               ...(isAttribute(value) && { fontFamily: 'monospace' }),
-              ...(singleline && {
+              ...(ellipsizedUrl && {
                 display: 'inline-block',
                 textOverflow: 'ellipsis',
                 overflow: 'hidden',

diff --git a/src/components/Thought.tsx b/src/components/Thought.tsx
@@ -437,7 +437,7 @@ const ThoughtContainer = ({
           env={env}
           isContextPending={isContextPending}
           isEditing={isEditing}
-          singleline={!isEditing && isURL(value)}
+          ellipsizedUrl={!isEditing && isURL(value)}
           isPublishChild={isPublishChild}
           isVisible={isVisible}
           onEdit={!isTouch ? onEdit : undefined}

diff --git a/src/components/ThoughtAnnotation.tsx b/src/components/ThoughtAnnotation.tsx
@@ -94,7 +94,7 @@ const ThoughtAnnotationContainer = React.memo(
     simplePath,
     minContexts = 2,
     multiline,
-    singleline,
+    ellipsizedUrl,
     placeholder,
     invalidState,
     style,
@@ -106,7 +106,7 @@ const ThoughtAnnotationContainer = React.memo(
     invalidState?: boolean
     minContexts?: number
     multiline?: boolean
-    singleline?: boolean
+    ellipsizedUrl?: boolean
     path: Path
     placeholder?: string
     showContextBreadcrumbs?: boolean
@@ -193,7 +193,7 @@ const ThoughtAnnotationContainer = React.memo(
           simplePath,
           isEditing,
           multiline,
-          singleline,
+          ellipsizedUrl: ellipsizedUrl,
           numContexts,
           showSuperscript,
           style,
@@ -214,7 +214,7 @@ const ThoughtAnnotation = React.memo(
     email,
     isEditing,
     multiline,
-    singleline,
+    ellipsizedUrl,
     numContexts,
     showSuperscript,
     simplePath,
@@ -228,7 +228,7 @@ const ThoughtAnnotation = React.memo(
     email?: string
     isEditing?: boolean
     multiline?: boolean
-    singleline?: boolean
+    ellipsizedUrl?: boolean
     numContexts: number
     showSuperscript?: boolean
     simplePath: SimplePath
@@ -272,7 +272,7 @@ const ThoughtAnnotation = React.memo(
           verticalAlign: 'top',
           whiteSpace: 'pre-wrap',
           /* override editable-annotation's single line to have same width with .editable. 100% - 1em since .editable has padding-right 1em */
-          maxWidth: singleline ? 'calc(100% - 2em)' : '100%',
+          maxWidth: ellipsizedUrl ? 'calc(100% - 2em)' : '100%',
           '@media (max-width: 500px)': {
             marginTop: { _android: '-2.1px' },
             marginLeft: { _android: '0.5em' },
@@ -299,7 +299,7 @@ const ThoughtAnnotation = React.memo(
                 maxWidth: '100%',
                 padding: '0 0.333em',
                 boxSizing: 'border-box',
-                whiteSpace: singleline ? 'nowrap' : undefined,
+                whiteSpace: ellipsizedUrl ? 'nowrap' : undefined,
                 /*
                   Since .editable-annotation-text is display: inline the margin only gets applied to its first line, and not later lines.
                   To make sure all lines are aligned need to apply the margin here, and remove margin from the .editable-annotation-text
@@ -323,7 +323,7 @@ const ThoughtAnnotation = React.memo(
               clipPath: 'inset(0.001px 0 0.1em 0)',
               minHeight: 'minThoughtHeight',
               wordBreak: 'break-word',
-              ...(singleline && {
+              ...(ellipsizedUrl && {
                 display: 'inline-block',
                 textOverflow: 'ellipsis',
                 overflow: 'hidden',

diff --git a/src/recipes/thought.ts b/src/recipes/thought.ts
@@ -20,7 +20,7 @@ const thoughtRecipe = defineRecipe({
   },
   variants: {
     /** Assign annotation height on single line truncated url. */
-    singleline: {
+    ellipsizedUrl: {
       true: {
         /**
           .single-line element has display: inline-block property, it affects the height calculation of the .thought div so we need to set the height manually.