@kit-data-manager/pid-component
Version:
The PID-Component is a web component that can be used to evaluate and display FAIR Digital Objects, PIDs, ORCiDs, and possibly other identifiers in a user-friendly way. It is easily extensible to support other identifier types.
54 lines (53 loc) • 2.29 kB
JavaScript
/*!
*
* Copyright 2024-2026 Karlsruhe Institute of Technology.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* https://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*
*/
export function getAriaLabel(isCopied, label) {
const baseLabel = label || 'content';
return isCopied ? `${baseLabel} copied to clipboard` : `Copy ${baseLabel} to clipboard`;
}
export function getButtonText(isCopied) {
return isCopied ? '✓ Copied!' : 'Copy';
}
export function getButtonTitle(isCopied, label) {
return getAriaLabel(isCopied, label);
}
export function isDarkModeEnabled(parent) {
if (!parent)
return false;
return parent.classList.contains('bg-gray-800');
}
export function getButtonClasses(copied, isDarkMode) {
const baseClasses = 'relative z-30 max-h-min flex-none items-center rounded-md border px-2 py-0.5 font-mono font-medium transition-colors duration-200 focus:ring-2 focus:ring-blue-500 focus:ring-offset-1 focus:outline-hidden';
if (copied) {
return isDarkMode
? `${baseClasses} bg-green-700 text-white border-gray-600`
: `${baseClasses} bg-green-200 text-green-900 border-gray-400`;
}
return isDarkMode
? `${baseClasses} bg-gray-700 text-gray-200 border-gray-600 hover:bg-gray-600 hover:text-white`
: `${baseClasses} bg-white text-slate-800 border-slate-500 hover:bg-blue-200`;
}
export function getHostClasses() {
return 'inline-block align-baseline text-xs';
}
export function getSrOnlyText() {
return 'Content copied to clipboard';
}
export const DEFAULT_LABEL = 'content';
export const COPY_SUCCESS_DURATION_MS = 1500;
export const FALLBACK_TEXTAREA_STYLE = 'position:fixed;top:0;left:0;width:2em;height:2em;padding:0;border:none;outline:none;box-shadow:none;opacity:0;';
//# sourceMappingURL=copyButtonUtils.js.map