Bundled output for commit be1b5713fa

Includes transpiled JS/TS, and Typescript declaration files (typings).

[skip ci]

js/dist-typings/common/components/ColorPreviewInput.d.ts

@@ -1,6 +1,5 @@
 import type Mithril from 'mithril';
 import Component, { ComponentAttrs } from '../Component';
 export default class ColorPreviewInput extends Component {
-    value?: string;
     view(vnode: Mithril.Vnode<ComponentAttrs, this>): JSX.Element;
 }

js/src/common/components/ColorPreviewInput.tsx

@@ -5,23 +5,20 @@ import classList from '../utils/classList';
 import icon from '../helpers/icon';
 
 export default class ColorPreviewInput extends Component {
-  value?: string;
-
   view(vnode: Mithril.Vnode<ComponentAttrs, this>) {
-    const { className, ...attrs } = this.attrs;
-    const value = attrs.bidi?.() || attrs.value;
+    const { className, id, ...attrs } = this.attrs;
 
     attrs.type ||= 'text';
 
     return (
       <div className="ColorInput">
-        <input className={classList('FormControl', className)} {...attrs} />
+        <input className={classList('FormControl', className)} id={id} {...attrs} />
 
         <span className="ColorInput-icon" role="presentation">
           {icon('fas fa-exclamation-circle')}
         </span>
 
-        <div className="ColorInput-preview" style={{ '--input-value': value }} role="presentation" />
+        <input className="ColorInput-preview" {...attrs} type="color" />
       </div>
     );
   }

less/common/ColorInput.less

@@ -7,12 +7,26 @@
     bottom: 8px;
     width: 20px;
     height: 20px;
-    pointer-events: none;
   }
 
   &-preview {
-    background-color: var(--input-value);
+    display: inline-block;
     border-radius: 15%;
+    padding: 0;
+    cursor: pointer;
+    overflow: hidden;
+
+    // Match both the wrapper div and the div with the background color
+    &, &::-webkit-color-swatch-wrapper, &::-webkit-color-swatch {
+      border: none;
+      padding: 0;
+    }
+
+    // This has to be a separate entry so other browsers
+    // don't ignore the entire CSS rule. Thanks Firefox.
+    &::-moz-color-swatch {
+      border: none;
+    }
   }
 
   &-icon {

src/Discussion/DiscussionRepository.php

@@ -42,16 +42,29 @@ class DiscussionRepository
     /**
      * Get the IDs of discussions which a user has read completely.
      *
+     * @deprecated 1.3 Use `getReadIdsQuery` instead
+     *
      * @param User $user
      * @return array
      */
     public function getReadIds(User $user)
+    {
+        return $this->getReadIdsQuery($user)
+            ->all();
+    }
+
+    /**
+     * Get a query containing the IDs of discussions which a user has read completely.
+     *
+     * @param User $user
+     * @return Builder
+     */
+    public function getReadIdsQuery(User $user): Builder
     {
         return Discussion::leftJoin('discussion_user', 'discussion_user.discussion_id', '=', 'discussions.id')
             ->where('discussion_user.user_id', $user->id)
             ->whereColumn('last_read_post_number', '>=', 'last_post_number')
-            ->pluck('id')
-            ->all();
+            ->select('id');
     }
 
     /**

src/Discussion/Query/UnreadFilterGambit.php

@@ -61,7 +61,7 @@ class UnreadFilterGambit extends AbstractRegexGambit implements FilterInterface
     protected function constrain(Builder $query, User $actor, bool $negate)
     {
         if ($actor->exists) {
-            $readIds = $this->discussions->getReadIds($actor);
+            $readIds = $this->discussions->getReadIdsQuery($actor);
 
             $query->where(function ($query) use ($readIds, $negate, $actor) {
                 if (! $negate) {